about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/styles/components/media.scss
diff options
context:
space:
mode:
Diffstat (limited to 'app/javascript/flavours/glitch/styles/components/media.scss')
-rw-r--r--app/javascript/flavours/glitch/styles/components/media.scss30
1 files changed, 11 insertions, 19 deletions
diff --git a/app/javascript/flavours/glitch/styles/components/media.scss b/app/javascript/flavours/glitch/styles/components/media.scss
index 58bdb642f..f504fa91e 100644
--- a/app/javascript/flavours/glitch/styles/components/media.scss
+++ b/app/javascript/flavours/glitch/styles/components/media.scss
@@ -385,7 +385,6 @@
   }
 
   .video-player__controls {
-    padding: 0 15px;
     padding-top: 10px;
     background: transparent;
   }
@@ -512,7 +511,8 @@
   &__buttons-bar {
     display: flex;
     justify-content: space-between;
-    padding-bottom: 10px;
+    padding-bottom: 8px;
+    margin: 0 -5px;
 
     .video-player__download__icon {
       color: inherit;
@@ -536,22 +536,13 @@
     overflow: hidden;
     text-overflow: ellipsis;
 
-    &.left {
-      button {
-        padding-left: 0;
-      }
-    }
-
-    &.right {
-      button {
-        padding-right: 0;
-      }
-    }
+    .player-button {
+      display: inline-block;
+      outline: 0;
 
-    button {
       flex: 0 0 auto;
       background: transparent;
-      padding: 2px 10px;
+      padding: 5px;
       font-size: 16px;
       border: 0;
       color: rgba($white, 0.75);
@@ -569,6 +560,7 @@
     flex: 0 1 auto;
     overflow: hidden;
     text-overflow: ellipsis;
+    margin: 0 5px;
   }
 
   &__time-sep,
@@ -688,7 +680,7 @@
       display: block;
       position: absolute;
       height: 4px;
-      top: 10px;
+      top: 14px;
     }
 
     &__progress,
@@ -697,7 +689,7 @@
       position: absolute;
       height: 4px;
       border-radius: 4px;
-      top: 10px;
+      top: 14px;
       background: lighten($ui-highlight-color, 8%);
     }
 
@@ -712,7 +704,7 @@
       border-radius: 50%;
       width: 12px;
       height: 12px;
-      top: 6px;
+      top: 10px;
       margin-left: -6px;
       background: lighten($ui-highlight-color, 8%);
       box-shadow: 1px 2px 6px rgba($base-shadow-color, 0.2);
@@ -736,7 +728,7 @@
   &.detailed,
   &.fullscreen {
     .video-player__buttons {
-      button {
+      .player-button {
         padding-top: 10px;
         padding-bottom: 10px;
       }