diff options
author | Manuel Quiñones <manuq@laptop.org> | 2013-04-11 19:58:16 (GMT) |
---|---|---|
committer | Manuel Quiñones <manuq@laptop.org> | 2013-04-11 20:13:30 (GMT) |
commit | 4bc02188f12c1eb9e272be4cbeeb2f70092cfc46 (patch) | |
tree | 6679e84fcc442810b920b9a3266b184d81a3753d /data/media-controls.css | |
parent | 11c09800773d4d7eb96b8e0dcd83f3d9422e03f8 (diff) |
Partial fix to style the Embedded media player - SL #3933 #4465
The only way to do this in webkitgtk1 is to inject CSS using
WebKit.WebView.execute_script:
http://webkitgtk.org/reference/webkitgtk/stable/webkitgtk-webkitwebview.html#webkit-web-view-execute-script
The new CSS rules do:
- set page background white
- set player background dark grey, same as Sugar toolbar
- set player text white
- set buttons size to the same size as Sugar toolbar buttons
This commit doesn't change the size of the icons inside the buttons,
which is too small. Ongoing investigation in the #4465 ticket, it
looks like it should be an upstream fix.
Signed-off-by: Manuel Quiñones <manuq@laptop.org>
Diffstat (limited to 'data/media-controls.css')
-rw-r--r-- | data/media-controls.css | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/data/media-controls.css b/data/media-controls.css new file mode 100644 index 0000000..9e21f08 --- /dev/null +++ b/data/media-controls.css @@ -0,0 +1,32 @@ +body { + background-color: #ffffff; +} +audio, video { + width: 500px; + height: 55px; + color: #ffffff; +} +audio::-webkit-media-controls-enclosure, video::-webkit-media-controls-enclosure { + height: 55px; +} +audio::-webkit-media-controls-panel, video::-webkit-media-controls-panel { + height: 55px; + background-color: #282828; + border-radius: 25px; +} +audio::-webkit-media-controls-mute-button, video::-webkit-media-controls-mute-button, +audio::-webkit-media-controls-play-button, video::-webkit-media-controls-play-button, +audio::-webkit-media-controls-toggle-closed-captions-button, video::-webkit-media-controls-toggle-closed-captions-button, +audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-fullscreen-button, +audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button, +audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button { + width: 55px; + height: 55px; +} +audio::-webkit-media-controls-current-time-display, video::-webkit-media-controls-current-time-display, +audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display { + height: 55px; + line-height: 0px; + font-size: 23px; + text-align: center; +} |