Bug 1643503 - Make the WebRTC indicator's drag-ability more obvious, and update button styles. r=pbz

This also splits out the indicator theme-ing into an include file, with
platform-specific CSS files that import it. This allows us to do
platform-specific tweaks, such as changing the ordering of the window
controls and drag indicator, which we do on macOS.

Differential Revision: https://phabricator.services.mozilla.com/D79344
This commit is contained in:
Mike Conley
2020-06-12 19:09:20 +00:00
parent 4c141c447c
commit d6ef6c4202
10 changed files with 150 additions and 19 deletions

View File

@@ -22,6 +22,7 @@
</head>
<body role="alert">
<div id="drag-indicator" />
<div id="display-share" class="row-item">
<image id="display-share-icon" />
@@ -32,8 +33,12 @@
<span id="screen-share-info" data-l10n-id="webrtc-sharing-screen"/>
<button id="stop-sharing-screen" class="stop-button" data-l10n-id="webrtc-stop-sharing-button"/>
</div>
<button id="microphone-button" class="row-item control-icon" type="microphone" data-l10n-id="webrtc-microphone-button"/>
<button id="camera-button" class="row-item control-icon" type="camera" data-l10n-id="webrtc-camera-button"/>
<div class="row-item separator" />
<div id="device-share" class="row-item">
<button id="microphone-button" class="control-icon" type="microphone" data-l10n-id="webrtc-microphone-button"/>
<button id="camera-button" class="control-icon" type="camera" data-l10n-id="webrtc-camera-button"/>
</div>
<div class="row-item separator" />
<div id="window-controls" class="row-item">
<button id="minimize" class="control-icon" data-l10n-id="webrtc-minimize"/>
</div>