progress bar styling changes

This commit is contained in:
Sofia Papacharalampous 2024-04-26 17:17:50 +03:00
parent 627ea6f5c0
commit 1cdd77e73a
1 changed files with 32 additions and 9 deletions

View File

@ -1,16 +1,39 @@
.percentage {
color: #212121;
opacity: 0.7;
font-weight: 400;
font-size: 0.875rem;
}
// .percentage {
// color: #212121;
// opacity: 0.7;
// font-weight: 400;
// font-size: 0.875rem;
// }
// .progress-bar {
// border-radius: 20px;
// height: 11px;
// }
// ::ng-deep .mat-progress-bar .mat-progress-bar-fill::after {
// border-radius: 20px !important;
// }
// Bar container
.progress-bar {
--mdc-linear-progress-active-indicator-height: 11px !important;
border-radius: 20px;
height: 11px;
}
::ng-deep .mat-progress-bar .mat-progress-bar-fill::after {
//Progress bar
::ng-deep .mdc-linear-progress__bar-inner {
--mdc-linear-progress-active-indicator-color: var(--primary-color) !important;
border-radius: 20px !important;
}
// Buffer bar
::ng-deep .mdc-linear-progress__buffer {
--mdc-linear-progress-track-height: 11px !important;
--mdc-linear-progress-active-indicator-color: var(--secondary-color) !important;
}
::ng-deep .mdc-linear-progress__buffer-bar {
--mdc-linear-progress-track-color: var(--secondary-color) !important;
}