Title: [177251] trunk/Source/WebCore
Revision
177251
Author
[email protected]
Date
2014-12-12 16:44:32 -0800 (Fri, 12 Dec 2014)

Log Message

[Media iOS] Inline video controls have an outlined scrubber
https://bugs.webkit.org/show_bug.cgi?id=139602
<rdar://problem/19184212>

Reviewed by Eric Carlson.

This is another change similar to https://bugs.webkit.org/show_bug.cgi?id=138378
where the specificity of pseduo elements had changed, and thus iOS
was inheriting some of the UA styles.

The fix is to add some more style rules to ensure that the timeline track
is drawn in white.

* Modules/mediacontrols/mediaControlsiOS.css:
(audio::-webkit-media-controls-timeline): Border rules not needed here.
(video::-webkit-media-controls-timeline::-webkit-slider-runnable-track): But are needed
here, along with some other things.
(audio::-webkit-media-controls-timeline::-webkit-slider-thumb): Now that the runnable
track has some style, we need to account for the change.

Modified Paths

Diff

Modified: trunk/Source/WebCore/ChangeLog (177250 => 177251)


--- trunk/Source/WebCore/ChangeLog	2014-12-13 00:42:16 UTC (rev 177250)
+++ trunk/Source/WebCore/ChangeLog	2014-12-13 00:44:32 UTC (rev 177251)
@@ -1,3 +1,25 @@
+2014-12-12  Dean Jackson  <[email protected]>
+
+        [Media iOS] Inline video controls have an outlined scrubber
+        https://bugs.webkit.org/show_bug.cgi?id=139602
+        <rdar://problem/19184212>
+
+        Reviewed by Eric Carlson.
+
+        This is another change similar to https://bugs.webkit.org/show_bug.cgi?id=138378
+        where the specificity of pseduo elements had changed, and thus iOS
+        was inheriting some of the UA styles.
+
+        The fix is to add some more style rules to ensure that the timeline track
+        is drawn in white.
+
+        * Modules/mediacontrols/mediaControlsiOS.css:
+        (audio::-webkit-media-controls-timeline): Border rules not needed here.
+        (video::-webkit-media-controls-timeline::-webkit-slider-runnable-track): But are needed
+        here, along with some other things.
+        (audio::-webkit-media-controls-timeline::-webkit-slider-thumb): Now that the runnable
+        track has some style, we need to account for the change.
+
 2014-12-12  Anders Carlsson  <[email protected]>
 
         Remove a workaround for a bug that was fixed in Mountain Lion

Modified: trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.css (177250 => 177251)


--- trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.css	2014-12-13 00:42:16 UTC (rev 177250)
+++ trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.css	2014-12-13 00:44:32 UTC (rev 177251)
@@ -276,26 +276,32 @@
     -webkit-flex: 1 1 0;
     height: 3px;
     margin: 0;
-
-    border-radius: 1.5px;
 }
 
 video::-webkit-media-controls-timeline {
     opacity: 0.75;
 }
 
+video::-webkit-media-controls-timeline::-webkit-slider-runnable-track {
+  height: 3px !important;
+  border-radius: 1.5px !important;
+  background-color: white !important;
+}
+
 video::-webkit-media-controls-timeline::-webkit-slider-thumb,
 audio::-webkit-media-controls-timeline::-webkit-slider-thumb {
     -webkit-appearance: none;
+    position: relative;
+    top: -6px;
     width: 16px;
     height: 16px;
     border-width: 0px !important;
     border-radius: 8px;
-    background-image: url('data:image/svg+xml,<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg"><circle r="7.75" cy="8" cx="8" fill="white" stroke="rgba(0, 0, 0, .25)" stroke-width=".5"/></svg>');
+    background-image: url('data:image/svg+xml,<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg"><circle r="7.75" cy="8" cx="8" fill="white" stroke="rgba(0, 0, 0, .25)" stroke-width=".5"/></svg>') !important;
     background-color: transparent !important;
     box-shadow: 0 3px 1px -1px rgba(0, 0, 0, .15);
 
-    /* rotateZ() forces the layer into compositing mode. Slider 
+    /* rotateZ() forces the layer into compositing mode. Slider
        thumbs are small, so forcing a compositing layer is inexpensive,
        and it keeps the slider from having to repaint while sliding. */
     -webkit-transform: rotateZ(0deg);
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to