update css

This commit is contained in:
Çetin
2021-12-23 10:23:33 +03:00
parent 38574a958f
commit 69d2af13e0
5 changed files with 134 additions and 171 deletions

View File

@@ -3,7 +3,47 @@ import {PrimeIcons} from 'primeng/api';
@Component({
templateUrl: './app.timelinedemo.component.html',
styleUrls: ['./app.timelinedemo.scss']
styles: [`
.custom-marker {
display: flex;
width: 2rem;
height: 2rem;
align-items: center;
justify-content: center;
color: #ffffff;
border-radius: 50%;
z-index: 1;
}
::ng-deep {
.p-timeline-event-content,
.p-timeline-event-opposite {
line-height: 1;
}
}
@media screen and (max-width: 960px) {
::ng-deep {
.customized-timeline {
.p-timeline-event:nth-child(even) {
flex-direction: row !important;
.p-timeline-event-content {
text-align: left !important;
}
}
.p-timeline-event-opposite {
flex: 0;
}
.p-card {
margin-top: 1rem;
}
}
}
}
`]
})
export class AppTimelineDemoComponent implements OnInit{

View File

@@ -1,40 +0,0 @@
//timeline
.custom-marker {
display: flex;
width: 2rem;
height: 2rem;
align-items: center;
justify-content: center;
color: #ffffff;
border-radius: 50%;
z-index: 1;
}
::ng-deep {
.p-timeline-event-content,
.p-timeline-event-opposite {
line-height: 1;
}
}
@media screen and (max-width: 960px) {
::ng-deep {
.customized-timeline {
.p-timeline-event:nth-child(even) {
flex-direction: row !important;
.p-timeline-event-content {
text-align: left !important;
}
}
.p-timeline-event-opposite {
flex: 0;
}
.p-card {
margin-top: 1rem;
}
}
}
}