Sync Android <video controls> with the default controls

Source/core/css/mediaControlsAndroid.css

 /*
  * Copyright (C) 2012 Google Inc.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  * 1. Redistributions of source code must retain the above copyright
  *    notice, this list of conditions and the following disclaimer.
  * 2. Redistributions in binary form must reproduce the above copyright
  *    notice, this list of conditions and the following disclaimer in the
@@ skipping 12 matching lines @@
  */
 
 /* Media controls for Chromium on Android */
 
 /* WARNING: This css file can only style <audio> and <video> elements */
 
 audio {
     height: 35px;
 }
 
-audio::-webkit-media-controls-enclosure, video::-webkit-media-controls-enclosure {
+audio::-webkit-media-controls-enclosure {
     height: 35px;
 }
 
+video::-webkit-media-controls-enclosure {

[qinmin, 2013/09/20 14:52:09]

why the difference between video and audio ?

[philipj_slow, 2013/09/22 08:11:48]

There's a 5px difference in mediaControls.css as well to account for the extra
5px padding, but someone overlooked that when making the Android stylesheet,
which is why there wasn't any padding at the bottom before. It should now match
Desktop, except that the controls are bigger.

+    height: 40px;
+}
+
 audio::-webkit-media-controls-overlay-enclosure {
     display: none;
 }
 
 video::-webkit-media-controls-overlay-enclosure {
     display: flex;
     position: relative;
     flex-direction: column;
     justify-content: flex-end;
     align-items: center;
     flex: 1 1;
     width: 100%;
     max-width: 800px;
     text-indent: 0;
     box-sizing: border-box;
     overflow: hidden;
 }
 
 audio::-webkit-media-controls-panel, video::-webkit-media-controls-panel {
     height: 35px;
-    border-radius: 0;

[qinmin, 2013/09/20 14:52:09]

why this? no rounded corners?

[philipj_slow, 2013/09/22 08:11:48]

I don't know why this was here, as you've probably noticed there are no rounded
corners in current Chrome or Opera for Android. This is fixing that to align
with Desktop.

[qinmin, 2013/09/22 15:51:45]

I don't think this aligns with desktop, desktop chrome has rounded corners on
the media control panel.

On 2013/09/22 08:11:48, philipj wrote:

[philipj_slow, 2013/09/25 17:01:47]

Yes, and now Android does too. "border-radius: 0" *removes* the rounded corners,
removing this line adds them back.

[qinmin, 2013/09/25 17:10:16]

This looks like a bug we missed earlier when changing all the css files, thanks
for removing this.

 }
 
 audio::-webkit-media-controls-mute-button, video::-webkit-media-controls-mute-button {
     display: none;
 }
 
 video::-webkit-media-controls-overlay-play-button {
     -webkit-appearance: media-overlay-play-button;
     display: flex;
     position: absolute;
@@ skipping 34 matching lines @@
 
 audio::-webkit-media-controls-fullscreen-button {
     display: none;
 }
 
 audio::-webkit-media-controls-toggle-closed-captions-button, video::-webkit-media-controls-toggle-closed-captions-button {
     width: 35px;
     height: 35px;
     line-height: 35px;
 }