From e61151b01c80e525db068ff12fcfe2c8ae04e1a4 Mon Sep 17 00:00:00 2001 From: Rigel Kent Date: Fri, 13 Mar 2020 20:38:50 +0100 Subject: Replace p-progressbar and bootstrap progressbar with pure CSS alt --- client/src/sass/include/_mixins.scss | 29 +++++++++++++++++++++++++++-- 1 file changed, 27 insertions(+), 2 deletions(-) (limited to 'client/src/sass/include/_mixins.scss') diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index 5163ea056..e8dfb79bc 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss @@ -225,6 +225,7 @@ overflow: hidden; display: inline-block; width: $width; + min-height: 30px; @include peertube-button; @include orange-button; @@ -233,8 +234,8 @@ position: absolute; top: 0; right: 0; - min-width: 100%; - min-height: 100%; + width: 100%; + height: 100%; font-size: 100px; text-align: right; filter: alpha(opacity=0); @@ -596,3 +597,27 @@ top: -2px; } } + +@mixin progressbar { + background-color: $grey-background-color; + display: flex; + height: 1rem; + overflow: hidden; + font-size: 0.75rem; + border-radius: 0.25rem; + + .progress-bar { + color: var(--mainBackgroundColor); + background-color: var(--mainColor); + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; + white-space: nowrap; + transition: width 0.6s ease; + + &.secondary { + background-color: var(--secondaryColor); + } + } +} -- cgit v1.2.3