1 files changed, 51 insertions, 0 deletions
diff --git a/browser/themes/osx/webRTC-indicator.css b/browser/themes/osx/webRTC-indicator.css
new file mode 100644
index 0000000000..784e85adf2
--- /dev/null
+++ b/browser/themes/osx/webRTC-indicator.css
@@ -0,0 +1,51 @@
+%if 0
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+%endif
+
+@namespace html url("http://www.w3.org/1999/xhtml");
+
+%include ../shared/webRTC-indicator.inc.css
+
+/**
+ * On macOS, the ordering of the drag indicator and window controls is reversed
+ * to be more native. We re-order all items including their separators so that
+ * the markup and separator hiding and showing logic in the shared CSS file
+ * doesn't need to be macOS-specific.
+ */
+#window-controls {
+  order: 1;
+}
+
+#display-share + .separator {
+  order: 2;
+}
+
+#display-share {
+  order: 3;
+}
+
+#device-share + .separator {
+  order: 4;
+}
+
+#device-share {
+  order: 5;
+}
+
+#drag-indicator {
+  order: 6;
+}
+
+/**
+ * The minimize button on macOS should be circular, and the icon should be
+ * centered. The asset we have for the minimize icon puts it along the bottom,
+ * so we manually offset it here.
+ */
+#minimize {
+  background-position: center -5px;
+  padding: 8px;
+  border: 1px solid transparent;
+  border-radius: 1000px;
+}