From e61151b01c80e525db068ff12fcfe2c8ae04e1a4 Mon Sep 17 00:00:00 2001
From: Rigel Kent <sendmemail@rigelk.eu>
Date: Fri, 13 Mar 2020 20:38:50 +0100
Subject: Replace p-progressbar and bootstrap progressbar with pure CSS alt

---
 client/src/sass/include/_bootstrap.scss |  2 +-
 client/src/sass/include/_mixins.scss    | 29 +++++++++++++++++++++++++++--
 2 files changed, 28 insertions(+), 3 deletions(-)

(limited to 'client/src/sass/include')

diff --git a/client/src/sass/include/_bootstrap.scss b/client/src/sass/include/_bootstrap.scss
index 61bb4739d..b1a23be6b 100644
--- a/client/src/sass/include/_bootstrap.scss
+++ b/client/src/sass/include/_bootstrap.scss
@@ -26,7 +26,7 @@
 @import '~bootstrap/scss/badge';
 //@import '~bootstrap/scss/jumbotron';
 @import '~bootstrap/scss/alert';
-@import '~bootstrap/scss/progress';
+//@import '~bootstrap/scss/progress';
 //@import '~bootstrap/scss/media';
 //@import '~bootstrap/scss/list-group';
 @import '~bootstrap/scss/close';
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