Split statusbar styling per OS

Lootyhoof · May 26, 2020 · 6edcb66 · 6edcb66
1 parent e6fa015
commit 6edcb66
Show file tree

Hide file tree

Showing 6 changed files with 193 additions and 85 deletions.
diff --git a/src/chrome/browser/browser.css b/src/chrome/browser/browser.css
@@ -1,4 +1,5 @@
 @import url("chrome://os/skin/browser/browser.css");
+@import url("chrome://os/skin/browser/statusbar/overlay.css");
 @import url("chrome://browser/skin/devtools.css");
 @import url("chrome://browser/skin/padlock/padlock.css");
 @import url("chrome://global/skin/");

diff --git a/src/chrome/browser/statusbar/dynamic.css b/src/chrome/browser/statusbar/dynamic.css
@@ -6,17 +6,20 @@
 
 /* Progress bar/line styles */
 
-#status4evar-progress-bar[s4estyle="true"] > .progress-bar {
+#status4evar-progress-bar[s4estyle="true"] > .progress-bar
+{
 	-moz-appearance: none;
 	background: #333399;
 	border-radius: 3px;
 }
 
-#status4evar-download-progress-bar[pmType^="active"] > .progress-bar {
+#status4evar-download-progress-bar[pmType^="active"] > .progress-bar
+{
 	background-color: #333399;
 }
 
-#status4evar-download-progress-bar[pmType^="paused"] > .progress-bar {
+#status4evar-download-progress-bar[pmType^="paused"] > .progress-bar
+{
 	background-color: gray;
 }
 
diff --git a/src/chrome/browser/statusbar/overlay.css b/src/chrome/browser/statusbar/overlay.css
@@ -5,9 +5,7 @@
 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
 @namespace html url("http://www.w3.org/1999/xhtml");
 
-/*
- * General styles
- */
+/* General styles */
 
 #status4evar-status-widget,
 #status4evar-progress-widget {
@@ -28,9 +26,7 @@
 	padding: 2px 4px;
 }
 
-/*
- * Options button
- */
+/* Options button */
 
 #status4evar-options-button {
 	list-style-image: url("chrome://browser/skin/statusbar/pms24.png");
@@ -40,9 +36,7 @@ toolbar[iconsize="small"] #status4evar-options-button {
 	list-style-image: url("chrome://browser/skin/statusbar/pms16.png");
 }
 
-/*
- * Download status
- */
+/* Download status */
 
 toolbar[mode="icons"] #status4evar-download-button[forcelabel="true"],
 toolbar[mode="text"] #status4evar-download-button {
@@ -112,9 +106,7 @@ toolbar[brighttext] #status4evar-download-button #status4evar-download-icon {
 	animation-duration: 1s;
 }
 
-/*
- * Splitter
- */
+/* Splitter */
 
 splitter.status4evar-status-splitter {
 	-moz-appearance: splitter;
@@ -127,9 +119,7 @@ splitter.status4evar-status-splitter:not(:hover) {
 	-moz-appearance: none;
 }
 
-/*
- * General progress
- */
+/* General progress */
 
 #status4evar-progress-bar[s4estyle="true"] > * {
 	border: none;
@@ -149,74 +139,8 @@ splitter.status4evar-status-splitter:not(:hover) {
 	border-right: none;
 }
 
-/*
- * Status bar
- */
+/* Status bar */
 
 #status-bar > .statusbar-resizerpanel {
 	display: none !important;
 }
-
-
-/*
- * General
- */
-
-#status4evar-status-text,
-#status4evar-progress-bar {
-	margin: 0px 3px;
-}
-
-/*
- * Download status
- */
-
-#status4evar-download-progress-bar {
-	height: 4px;
-}
-
-#status4evar-download-button #status4evar-download-icon {
-	min-width: 18px;
-	min-height: 18px;
-}
-
-toolbar[mode="icons"] #status4evar-download-button[forcelabel="true"] > label {
-	margin-inline-start: 5px !important;
-}
-
-/*
- * Splitter
- */
-
-splitter.status4evar-status-splitter {
-	width: 6px;
-	margin: 0px -3px;
-}
-
-/*
- * Location bar
- */
-
-#urlbar-progress-alt {
-	margin-inline-end: -2px;
-}
-
-/*
- * Status bar
- */
-
-#browser-bottombox[s4eboarder="true"] :-moz-any(#status4evar-status-bar, #addon-bar) {
-	-moz-appearance: none;
-}
-
-#browser-bottombox[s4eboarder="true"] > *:not([hidden="true"]):not([collapsed="true"]) {
-	box-shadow: none !important;
-	border: none !important;
-	border-top: 2px solid !important;
-	-moz-border-top-colors: ThreeDShadow ThreeDHighlight !important;
-}
-
-#browser-bottombox[s4eboarder="true"] > *:not([hidden="true"]):not([collapsed="true"]) ~ * {
-	border: none !important;
-}
-
diff --git a/src/chrome/os/darwin/browser/statusbar/overlay.css b/src/chrome/os/darwin/browser/statusbar/overlay.css
@@ -0,0 +1,61 @@
+/* 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/. */
+
+@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
+
+/* General */
+
+#status4evar-status-text,
+#status4evar-progress-bar {
+  margin: 0px 4px;
+}
+
+/* Download status */
+
+#status4evar-download-progress-bar {
+  height: 5px;
+}
+
+#status-bar {
+  padding-right: 0px;
+}
+
+#browser-bottombox > #addon-bar:last-child {
+  padding-right: 16px;
+}
+
+toolbar[mode="icons"] #status4evar-download-button[forcelabel="true"] > label {
+  margin: 0px 2px !important;
+  margin-inline-start: 3px !important;
+}
+
+/* Splitter */
+
+splitter.status4evar-status-splitter {
+  width: 8px;
+  margin: 0px -4px;
+}
+
+/* Location bar */
+
+#urlbar-progress-alt {
+       margin-right: -1px;
+}
+
+/* Toolbar progress */
+
+#status4evar-progress-bar[s4estyle="true"] {
+  -moz-appearance: none;
+  border: 1px solid gray;
+}
+
+#status4evar-progress-bar[s4estyle="true"] > .progress-remainder {
+  background-color: white;
+}
+
+/* Gripper */
+
+#status4evar-window-gripper {
+  display: none;
+}
diff --git a/src/chrome/os/linux/browser/statusbar/overlay.css b/src/chrome/os/linux/browser/statusbar/overlay.css
@@ -0,0 +1,67 @@
+/* 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/. */
+
+@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
+
+/* General */
+
+#status4evar-status-text,
+#status4evar-progress-bar {
+  margin: 0px 4px;
+}
+
+/* Download status */
+
+#status4evar-download-progress-bar {
+  height: 6px;
+}
+
+toolbar[iconsize="small"] #status4evar-download-progress-bar {
+  height: 4px;
+}
+
+toolbar[mode="icons"] #status4evar-download-button[forcelabel="true"] > label {
+  margin: 0px 2px !important;
+  margin-top: -1px !important;
+  margin-inline-start: 4px !important;
+}
+
+/* Splitter */
+
+splitter.status4evar-status-splitter {
+  width: 8px;
+  margin: 0px -4px;
+}
+
+/* Location bar */
+
+#urlbar-progress-alt {
+  margin: -1px;
+}
+
+#notification-popup-box {
+  margin-inline-start: -1px;
+}
+
+#urlbar .urlbar-over-link-box {
+  margin-top: -1px;
+  margin-bottom: -1px;
+}
+
+/* Add-on bar */
+
+#browser-bottombox[s4eboarder="true"] :-moz-any(#status4evar-status-bar, #addon-bar) {
+  -moz-appearance: none;
+}
+
+#browser-bottombox[s4eboarder="true"] > *:not([hidden="true"]):not([collapsed="true"]) {
+  box-shadow: none !important;
+  border: none !important;
+  border-top: 2px solid !important;
+  -moz-border-top-colors: ThreeDShadow ThreeDHighlight !important;
+}
+
+#browser-bottombox[s4eboarder="true"] > *:not([hidden="true"]):not([collapsed="true"]) ~ * {
+  border: none !important;
+}
diff --git a/src/chrome/os/winnt/browser/statusbar/overlay.css b/src/chrome/os/winnt/browser/statusbar/overlay.css
@@ -0,0 +1,52 @@
+/* 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/. */
+
+@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
+
+/* General */
+
+#status4evar-status-text,
+#status4evar-progress-bar {
+  margin: 0px 3px;
+}
+
+/* Download status */
+
+#status4evar-download-progress-bar {
+  height: 4px;
+}
+
+toolbar[mode="icons"] #status4evar-download-button[forcelabel="true"] > label {
+  margin-inline-start: 5px !important;
+}
+
+/* Splitter */
+
+splitter.status4evar-status-splitter {
+  width: 6px;
+  margin: 0px -3px;
+}
+
+/* Location bar */
+
+#urlbar-progress-alt {
+  margin-inline-end: -2px;
+}
+
+/* Status bar */
+
+#browser-bottombox[s4eboarder="true"] :-moz-any(#status4evar-status-bar, #addon-bar) {
+  -moz-appearance: none;
+}
+
+#browser-bottombox[s4eboarder="true"] > *:not([hidden="true"]):not([collapsed="true"]) {
+  box-shadow: none !important;
+  border: none !important;
+  border-top: 2px solid !important;
+  -moz-border-top-colors: ThreeDShadow ThreeDHighlight !important;
+}
+
+#browser-bottombox[s4eboarder="true"] > *:not([hidden="true"]):not([collapsed="true"]) ~ * {
+  border: none !important;
+}