1 files changed, 101 insertions, 0 deletions
diff --git a/browser/themes/osx/aboutSyncTabs.css b/browser/themes/osx/aboutSyncTabs.css
new file mode 100644
index 000000000..4cedad649
--- /dev/null
+++ b/browser/themes/osx/aboutSyncTabs.css
@@ -0,0 +1,101 @@
+/* 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/. */
+
+#tabs-display,
+#tabsList {
+  background-color: transparent;
+  -moz-appearance: none;
+  margin: 0;
+}
+
+#tabsList {
+  width: 100%;
+}
+
+#tabs-display {
+  background: #fff url(chrome://browser/skin/sync-bg.png) repeat-x center -80px;
+}
+
+#headers {
+  background: url(chrome://browser/skin/sync-32.png) no-repeat;
+  margin-top: 4px;
+  width: 45em;
+  height: 32px;
+  margin-inline-start: 2em;
+  margin-inline-end: 2em;
+}
+
+#tabsListHeading {
+  font-size: 140%;
+  font-weight: bold;
+  margin-inline-start: 40px;
+}
+
+richlistitem {
+  margin-inline-end: 2em;
+}
+
+richlistitem[selected="true"],
+richlistitem:focus {
+  outline-style: none;
+}
+
+richlistitem[type="tab"] {
+  min-height: 3em;
+  border: #999999 1px solid !important;
+  padding: 2px 5px;
+  margin-bottom: 4px;
+  margin-inline-start: 4em;
+  border-radius: 6px;
+  background-color: menu;
+  width: 44em;
+  opacity: 0.9;
+  box-shadow:
+    inset rgba(255, 255, 255, 0.5) 0 1px 0px,
+    inset rgba(0, 0, 0, 0.1) 0 -2px 0px,
+    rgba(0, 0, 0, 0.1) 0px 1px 0px;
+}
+
+richlistitem[type="tab"][selected="true"] {
+  background-color: -moz-MenuHover;
+}
+
+richlistitem[type="client"] {
+  min-height: 2em;
+  color: #000000;
+  margin-inline-start: 2em;
+  margin-top: 2px;
+  margin-bottom: 3px;
+  width: 42em;
+  border-radius: 6px;
+  background-color: transparent;
+  -moz-user-focus: ignore !important;
+}
+richlistitem.mobile[type="client"] {
+  list-style-image: url("chrome://browser/skin/sync-mobileIcon.svg#icon");
+}
+richlistitem.desktop[type="client"] {
+  list-style-image: url("chrome://browser/skin/sync-desktopIcon.svg#icon");
+}
+
+.title,
+.clientName {
+  color: #000000;
+  font-size: 1.1em;
+}
+
+.title[selected="true"],
+.url[selected="true"] {
+  color: inherit;
+}
+
+.url {
+  color: -moz-nativehyperlinktext;
+  font-size: 0.95em;
+}
+
+.tabIcon {
+  padding-inline-start: 2px;
+  padding-top: 2px;
+}