Title: [164857] trunk/Source/WebCore
- Revision
- 164857
- Author
- calva...@igalia.com
- Date
- 2014-02-28 02:06:29 -0800 (Fri, 28 Feb 2014)
Log Message
[GTK] Finetune captions menu as per design team
https://bugs.webkit.org/show_bug.cgi?id=129432
Reviewed by Eric Carlson.
Some design fine tuning of the captions dialog was required.
No new tests, current suffice.
* Modules/mediacontrols/mediaControlsApple.js:
Added out class.
* Modules/mediacontrols/mediaControlsGtk.js:
(ControllerGtk.prototype.buildCaptionMenu): Setting out class when
menu is going to show overlap the panel right border.
* css/mediaControlsGtk.css:
(video::-webkit-media-controls-closed-captions-container.out):
Setting all borders to 5px;
(video::-webkit-media-controls-closed-captions-container h3):
Reduced font size and increasing top padding.
(video::-webkit-media-controls-closed-captions-container ul):
Increased top padding.
Modified Paths
Diff
Modified: trunk/Source/WebCore/ChangeLog (164856 => 164857)
--- trunk/Source/WebCore/ChangeLog 2014-02-28 07:50:20 UTC (rev 164856)
+++ trunk/Source/WebCore/ChangeLog 2014-02-28 10:06:29 UTC (rev 164857)
@@ -1,3 +1,27 @@
+2014-02-28 Xabier Rodriguez Calvar <calva...@igalia.com>
+
+ [GTK] Finetune captions menu as per design team
+ https://bugs.webkit.org/show_bug.cgi?id=129432
+
+ Reviewed by Eric Carlson.
+
+ Some design fine tuning of the captions dialog was required.
+
+ No new tests, current suffice.
+
+ * Modules/mediacontrols/mediaControlsApple.js:
+ Added out class.
+ * Modules/mediacontrols/mediaControlsGtk.js:
+ (ControllerGtk.prototype.buildCaptionMenu): Setting out class when
+ menu is going to show overlap the panel right border.
+ * css/mediaControlsGtk.css:
+ (video::-webkit-media-controls-closed-captions-container.out):
+ Setting all borders to 5px;
+ (video::-webkit-media-controls-closed-captions-container h3):
+ Reduced font size and increasing top padding.
+ (video::-webkit-media-controls-closed-captions-container ul):
+ Increased top padding.
+
2014-02-27 Ryosuke Niwa <rn...@webkit.org>
Element::attributeChanged shouldn't do any work when attribute value didn't change
Modified: trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js (164856 => 164857)
--- trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js 2014-02-28 07:50:20 UTC (rev 164856)
+++ trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js 2014-02-28 10:06:29 UTC (rev 164857)
@@ -83,6 +83,7 @@
volumeBox: 'volume-box',
noVideo: 'no-video',
down: 'down',
+ out: 'out',
},
KeyCodes: {
enter: 13,
Modified: trunk/Source/WebCore/Modules/mediacontrols/mediaControlsGtk.js (164856 => 164857)
--- trunk/Source/WebCore/Modules/mediacontrols/mediaControlsGtk.js 2014-02-28 07:50:20 UTC (rev 164856)
+++ trunk/Source/WebCore/Modules/mediacontrols/mediaControlsGtk.js 2014-02-28 10:06:29 UTC (rev 164857)
@@ -160,7 +160,10 @@
// Caption menu has to be centered to the caption button.
var captionButtonCenter = this.controls.panel.offsetLeft + this.controls.captionButton.offsetLeft +
this.controls.captionButton.offsetWidth / 2;
- this.captionMenu.style.left = (captionButtonCenter - this.captionMenu.offsetWidth / 2) + 'px';
+ var captionMenuLeft = (captionButtonCenter - this.captionMenu.offsetWidth / 2);
+ if (captionMenuLeft + this.captionMenu.offsetWidth > this.controls.panel.offsetLeft + this.controls.panel.offsetWidth)
+ this.captionMenu.classList.add(this.ClassNames.out);
+ this.captionMenu.style.left = captionMenuLeft + 'px';
// As height is not in the css, it needs to be specified to animate it.
this.captionMenu.height = this.captionMenu.offsetHeight;
this.captionMenu.style.height = 0;
Modified: trunk/Source/WebCore/css/mediaControlsGtk.css (164856 => 164857)
--- trunk/Source/WebCore/css/mediaControlsGtk.css 2014-02-28 07:50:20 UTC (rev 164856)
+++ trunk/Source/WebCore/css/mediaControlsGtk.css 2014-02-28 10:06:29 UTC (rev 164857)
@@ -308,15 +308,24 @@
transition: height 0.10s linear;
}
+video::-webkit-media-controls-closed-captions-container.out {
+ border-radius: 5px;
+}
+
video::-webkit-media-controls-closed-captions-container h3 {
- margin: 1px 10px;
- padding-top: 4px;
+ padding-top: 8px;
+ margin: 0;
+ padding-left: 17px;
+ padding-right: 15px;
+ font-size: 10pt;
+ font-weight: bold;
+ font-style: normal;
}
video::-webkit-media-controls-closed-captions-container ul {
list-style-type: none;
margin: 0 0 4px 0;
- padding: 0;
+ padding: 4px 0 0 0;
}
video::-webkit-media-controls-closed-captions-container li {
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes
