chore: pr comments

box · May 25, 2021 · aad8613 · aad8613
1 parent 99b04da
commit aad8613
Show file tree

Hide file tree

Showing 6 changed files with 44 additions and 53 deletions.
diff --git a/src/lib/viewers/controls/media/_styles.scss b/src/lib/viewers/controls/media/_styles.scss
@@ -6,3 +6,37 @@ $bp-MediaControl-width: 36px;
 @mixin bp-MediaButton {
     @include bp-Control($width: $bp-MediaControl-width, $height: $bp-MediaControl-height);
 }
+
+@mixin bp-VideoControls {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    background-image: linear-gradient(to top, rgba($black, .6) 0%, rgba($black, 0) 100%);
+
+    .bp-FullscreenToggle {
+        width: $bp-MediaControl-width;
+        height: $bp-MediaControl-height;
+    }
+}
+
+@mixin bp-VideoControls-bar {
+    display: flex;
+    justify-content: space-between;
+    padding: 0 10px 5px;
+}
+
+@mixin bp-VideoControls-group {
+    display: flex;
+    align-items: center;
+}
+
+@mixin bp-VideoControls-settings {
+    .bp-SettingsFlyout {
+        right: 15px;
+    }
+
+    .bp-SettingsToggle {
+        width: $bp-MediaControl-width;
+        height: $bp-MediaControl-height;
+    }
+}
diff --git a/src/lib/viewers/media/Dash.scss b/src/lib/viewers/media/Dash.scss
@@ -25,10 +25,6 @@
             cursor: pointer;
         }
     }
-
-    .bp-VideoControlsRoot {
-        @include bp-VideoControlsRoot;
-    }
 }
 
 .bp-media-filmstrip-container {

diff --git a/src/lib/viewers/media/DashControls.scss b/src/lib/viewers/media/DashControls.scss
@@ -1,4 +1,4 @@
-@import './mediaBase';
+@import '../controls//media/styles';
 
 .bp-DashControls {
     @include bp-VideoControls;

diff --git a/src/lib/viewers/media/MP4.scss b/src/lib/viewers/media/MP4.scss
@@ -34,8 +34,4 @@
             opacity: 1;
         }
     }
-
-    .bp-VideoControlsRoot {
-        @include bp-VideoControlsRoot;
-    }
 }
diff --git a/src/lib/viewers/media/MP4Controls.scss b/src/lib/viewers/media/MP4Controls.scss
@@ -1,4 +1,4 @@
-@import './mediaBase';
+@import '../controls//media/styles';
 
 .bp-MP4Controls {
     @include bp-VideoControls;

diff --git a/src/lib/viewers/media/_mediaBase.scss b/src/lib/viewers/media/_mediaBase.scss
@@ -1,48 +1,5 @@
 @import '../../boxuiVariables';
 @import './MediaControls';
-@import '../controls/media/styles';
-
-@mixin bp-VideoControlsRoot {
-    position: absolute;
-    right: 0;
-    bottom: -1px;
-    left: 0;
-    width: 100%;
-}
-
-@mixin bp-VideoControls {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    background-image: linear-gradient(to top, rgba($black, .6) 0%, rgba($black, 0) 100%);
-
-    .bp-FullscreenToggle {
-        width: $bp-MediaControl-width;
-        height: $bp-MediaControl-height;
-    }
-}
-
-@mixin bp-VideoControls-bar {
-    display: flex;
-    justify-content: space-between;
-    padding: 0 10px 5px;
-}
-
-@mixin bp-VideoControls-group {
-    display: flex;
-    align-items: center;
-}
-
-@mixin bp-VideoControls-settings {
-    .bp-SettingsFlyout {
-        right: 15px;
-    }
-
-    .bp-SettingsToggle {
-        width: $bp-MediaControl-width;
-        height: $bp-MediaControl-height;
-    }
-}
 
 .bp-media {
     position: absolute;
@@ -134,3 +91,11 @@
         display: none;
     }
 }
+
+.bp-VideoControlsRoot {
+    position: absolute;
+    right: 0;
+    bottom: -1px;
+    left: 0;
+    width: 100%;
+}