Merge pull request #641 from jwplayer/bugfix/skip-ad-mk-2

Corner rounding, mouse highlighting for skip buttons [Delivers #99791878]
jwplayer · Jul 30, 2015 · 8560646 · 8560646
2 parents a9c702b + 3591546
commit 8560646
Show file tree

Hide file tree

Showing 8 changed files with 27 additions and 8 deletions.
diff --git a/src/css/imports/mixins.less b/src/css/imports/mixins.less
@@ -162,6 +162,11 @@
             .jw-skip-icon {
                 color: @inactive-color;
             }
+
+            &.jw-skippable:hover .jw-skip-icon,
+            &.jw-skippable:hover .jw-text {
+                color: @active-color;
+            }
         }
 
         .jw-time-tip,

diff --git a/src/css/imports/skipad.less b/src/css/imports/skipad.less
@@ -27,7 +27,7 @@
     .jw-text, .jw-skip-icon {
         color: @inactive-color;
         vertical-align: middle;
-        line-height: 1em;
+        line-height: 1.5em;
         font-size: 0.7em;
     }
 

diff --git a/src/css/skins/beelden.less b/src/css/skins/beelden.less
@@ -206,7 +206,8 @@
     .jw-time-tip,
     .jw-volume-tip,
     .jw-menu,
-    .jw-dock-button {
+    .jw-dock-button,
+    .jw-skip {
         border-radius: @ui-padding;
     }
 

diff --git a/src/css/skins/glow.less b/src/css/skins/glow.less
@@ -26,7 +26,8 @@
     /* For the overlay containers */
     .jw-time-tip,
     .jw-volume-tip,
-    .jw-menu {
+    .jw-menu,
+    .jw-skip {
         border-radius: @ui-padding;
     }
 

diff --git a/src/css/skins/seven.less b/src/css/skins/seven.less
@@ -263,11 +263,17 @@
     /* Skip icon and text styles */
     .jw-skip {
         padding: 0.4em;
-        border-radius: 1em;
+        border-radius: 1.75em;
 
-        .jw-text, 
+        .jw-text,
         .jw-icon-inline {
             color: @inactive-color;
+            line-height: 1.75em;
+        }
+
+        &.jw-skippable:hover .jw-text,
+        &.jw-skippable:hover .jw-icon-inline {
+            color: @active-color;
         }
     }
 

diff --git a/src/css/skins/six.less b/src/css/skins/six.less
@@ -60,7 +60,7 @@
         background: @def-transparent-background-style;
         background-size: @def-background-size;
         border-radius: .3em;
-        border: 1px solid #000;
+        border: @def-border;
     }
 
     &:hover {
@@ -244,10 +244,11 @@
     .jw-skip {
         background: @def-transparent-background-style;
         background-size: @def-background-size;
+        border: @def-border;
         border-radius: .3em;
         padding: @ui-padding @ui-corner-round;
 
-        &:hover {
+        &:hover.jw-skippable {
             background: @def-background-style;
             background-size: @def-background-size;
         }

diff --git a/src/css/skins/stormtrooper.less b/src/css/skins/stormtrooper.less
@@ -32,7 +32,8 @@
     /* For the overlay containers */
     .jw-time-tip,
     .jw-volume-tip,
-    .jw-menu {
+    .jw-menu,
+    .jw-skip {
         border-radius: @ui-padding;
     }
 

diff --git a/src/css/skins/vapor.less b/src/css/skins/vapor.less
@@ -33,6 +33,10 @@
         bottom: .3em;
     }
 
+    .jw-skip {
+        border-radius: @ui-padding;
+    }
+
     /* Styles for menu list items */
     .jw-option {
         color: @active-color;