Fixed #1752 - ProgressBar text color enhancements
parent
fa3aae4085
commit
fb7b2b24cc
|
@ -5293,7 +5293,7 @@
|
||||||
background: #64B5F6;
|
background: #64B5F6;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #212529;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #81C784;
|
background: #81C784;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #212529;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #FFD54F;
|
background: #FFD54F;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #212529;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #BA68C8;
|
background: #BA68C8;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5305,7 +5305,7 @@
|
||||||
background: #8dd0ff;
|
background: #8dd0ff;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #151515;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5305,7 +5305,7 @@
|
||||||
background: #c298d8;
|
background: #c298d8;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #151515;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5305,7 +5305,7 @@
|
||||||
background: #007bff;
|
background: #007bff;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #212529;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5305,7 +5305,7 @@
|
||||||
background: #883cae;
|
background: #883cae;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #212529;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5244,7 +5244,7 @@
|
||||||
background: #0078d4;
|
background: #0078d4;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #323130;
|
color: #ffffff;
|
||||||
line-height: 2px;
|
line-height: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5279,7 +5279,7 @@
|
||||||
background: #93C5FD;
|
background: #93C5FD;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #1c2127;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5279,7 +5279,7 @@
|
||||||
background: #A5B4FC;
|
background: #A5B4FC;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #1c2127;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5279,7 +5279,7 @@
|
||||||
background: #C4B5FD;
|
background: #C4B5FD;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #1c2127;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5279,7 +5279,7 @@
|
||||||
background: #5EEAD4;
|
background: #5EEAD4;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #1c2127;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5279,7 +5279,7 @@
|
||||||
background: #3B82F6;
|
background: #3B82F6;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #495057;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5279,7 +5279,7 @@
|
||||||
background: #6366F1;
|
background: #6366F1;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #495057;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5279,7 +5279,7 @@
|
||||||
background: #8B5CF6;
|
background: #8B5CF6;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #495057;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5279,7 +5279,7 @@
|
||||||
background: #14B8A6;
|
background: #14B8A6;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #495057;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5256,7 +5256,7 @@
|
||||||
background: #FFE082;
|
background: #FFE082;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #dedede;
|
color: #212529;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5256,7 +5256,7 @@
|
||||||
background: #81D4FA;
|
background: #81D4FA;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #dedede;
|
color: #212529;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5256,7 +5256,7 @@
|
||||||
background: #C5E1A5;
|
background: #C5E1A5;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #dedede;
|
color: #212529;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5256,7 +5256,7 @@
|
||||||
background: #F48FB1;
|
background: #F48FB1;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #dedede;
|
color: #212529;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5317,7 +5317,7 @@
|
||||||
background: #CE93D8;
|
background: #CE93D8;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #121212;
|
||||||
line-height: 4px;
|
line-height: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6507,7 +6507,7 @@
|
||||||
.p-progressbar {
|
.p-progressbar {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar.p-progressbar-determinate .p-progressbar-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5317,7 +5317,7 @@
|
||||||
background: #9FA8DA;
|
background: #9FA8DA;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #121212;
|
||||||
line-height: 4px;
|
line-height: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6507,7 +6507,7 @@
|
||||||
.p-progressbar {
|
.p-progressbar {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar.p-progressbar-determinate .p-progressbar-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5317,7 +5317,7 @@
|
||||||
background: #673AB7;
|
background: #673AB7;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(0, 0, 0, 0.87);
|
color: #ffffff;
|
||||||
line-height: 4px;
|
line-height: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6507,7 +6507,7 @@
|
||||||
.p-progressbar {
|
.p-progressbar {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar.p-progressbar-determinate .p-progressbar-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5317,7 +5317,7 @@
|
||||||
background: #3F51B5;
|
background: #3F51B5;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(0, 0, 0, 0.87);
|
color: #ffffff;
|
||||||
line-height: 4px;
|
line-height: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6507,7 +6507,7 @@
|
||||||
.p-progressbar {
|
.p-progressbar {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar.p-progressbar-determinate .p-progressbar-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5317,7 +5317,7 @@
|
||||||
background: #CE93D8;
|
background: #CE93D8;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #121212;
|
||||||
line-height: 4px;
|
line-height: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6507,7 +6507,7 @@
|
||||||
.p-progressbar {
|
.p-progressbar {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar.p-progressbar-determinate .p-progressbar-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5317,7 +5317,7 @@
|
||||||
background: #9FA8DA;
|
background: #9FA8DA;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #121212;
|
||||||
line-height: 4px;
|
line-height: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6507,7 +6507,7 @@
|
||||||
.p-progressbar {
|
.p-progressbar {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar.p-progressbar-determinate .p-progressbar-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5317,7 +5317,7 @@
|
||||||
background: #673AB7;
|
background: #673AB7;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(0, 0, 0, 0.87);
|
color: #ffffff;
|
||||||
line-height: 4px;
|
line-height: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6507,7 +6507,7 @@
|
||||||
.p-progressbar {
|
.p-progressbar {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar.p-progressbar-determinate .p-progressbar-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5317,7 +5317,7 @@
|
||||||
background: #3F51B5;
|
background: #3F51B5;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(0, 0, 0, 0.87);
|
color: #ffffff;
|
||||||
line-height: 4px;
|
line-height: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6507,7 +6507,7 @@
|
||||||
.p-progressbar {
|
.p-progressbar {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar.p-progressbar-determinate .p-progressbar-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5244,7 +5244,7 @@
|
||||||
background: #007ad9;
|
background: #007ad9;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #333333;
|
color: #ffffff;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5256,7 +5256,7 @@
|
||||||
background: #007ad9;
|
background: #007ad9;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #333333;
|
color: #ffffff;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5256,7 +5256,7 @@
|
||||||
background: #41b883;
|
background: #41b883;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #333333;
|
color: #ffffff;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5256,7 +5256,7 @@
|
||||||
background: #007ad9;
|
background: #007ad9;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #333333;
|
color: #ffffff;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5244,7 +5244,7 @@
|
||||||
background: #7B95A3;
|
background: #7B95A3;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #666666;
|
color: #ffffff;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #2196F3;
|
background: #2196F3;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #495057;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #4CAF50;
|
background: #4CAF50;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #495057;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #FFC107;
|
background: #FFC107;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #495057;
|
color: #212529;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #9C27B0;
|
background: #9C27B0;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #495057;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5328,7 +5328,7 @@
|
||||||
background: #4F46E5;
|
background: #4F46E5;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: #3f3f46;
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #64B5F6;
|
background: #64B5F6;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #212529;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #81C784;
|
background: #81C784;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #212529;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #FFD54F;
|
background: #FFD54F;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #212529;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5293,7 +5293,7 @@
|
||||||
background: #BA68C8;
|
background: #BA68C8;
|
||||||
}
|
}
|
||||||
.p-progressbar .p-progressbar-label {
|
.p-progressbar .p-progressbar-label {
|
||||||
color: rgba(255, 255, 255, 0.87);
|
color: #ffffff;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,9 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<div role="progressbar" :class="containerClass" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100">
|
<div role="progressbar" :class="containerClass" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100">
|
||||||
<div v-if="determinate" class="p-progressbar-value p-progressbar-value-animate" :style="progressStyle"></div>
|
<div v-if="determinate" class="p-progressbar-value p-progressbar-value-animate" :style="progressStyle">
|
||||||
<div v-if="determinate && (value !== null) && showValue" class="p-progressbar-label">
|
<div v-if="(value != null && value !== 0) && showValue" class="p-progressbar-label">
|
||||||
<slot>{{value + '%'}}</slot>
|
<slot>{{value + '%'}}</slot>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div v-if="indeterminate" class="p-progressbar-indeterminate-container">
|
<div v-if="indeterminate" class="p-progressbar-indeterminate-container">
|
||||||
<div class="p-progressbar-value p-progressbar-value-animate"></div>
|
<div class="p-progressbar-value p-progressbar-value-animate"></div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -40,7 +41,7 @@ export default {
|
||||||
progressStyle() {
|
progressStyle() {
|
||||||
return {
|
return {
|
||||||
width: this.value + '%',
|
width: this.value + '%',
|
||||||
display: 'block'
|
display: 'flex'
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
indeterminate() {
|
indeterminate() {
|
||||||
|
@ -65,20 +66,20 @@ export default {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
display: none;
|
display: none;
|
||||||
border: 0 none;
|
border: 0 none;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-progressbar-determinate .p-progressbar-label {
|
||||||
|
display: inline-flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-progressbar-determinate .p-progressbar-value-animate {
|
.p-progressbar-determinate .p-progressbar-value-animate {
|
||||||
transition: width 1s ease-in-out;
|
transition: width 1s ease-in-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-progressbar-determinate .p-progressbar-label {
|
|
||||||
text-align: center;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
position: absolute;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.p-progressbar-indeterminate .p-progressbar-value::before {
|
.p-progressbar-indeterminate .p-progressbar-value::before {
|
||||||
content: '';
|
content: '';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
Loading…
Reference in New Issue