summaryrefslogtreecommitdiffstats
path: root/application/basilisk/themes/osx/compacttheme.css
diff options
context:
space:
mode:
authorMatt A. Tobin <email@mattatobin.com>2018-02-02 03:32:58 -0500
committerMatt A. Tobin <email@mattatobin.com>2018-02-02 03:32:58 -0500
commite72ef92b5bdc43cd2584198e2e54e951b70299e8 (patch)
tree01ceb4a897c33eca9e7ccf2bc3aefbe530169fe5 /application/basilisk/themes/osx/compacttheme.css
parent0d19b77d3eaa5b8d837bf52c19759e68e42a1c4c (diff)
downloadUXP-e72ef92b5bdc43cd2584198e2e54e951b70299e8.tar
UXP-e72ef92b5bdc43cd2584198e2e54e951b70299e8.tar.gz
UXP-e72ef92b5bdc43cd2584198e2e54e951b70299e8.tar.lz
UXP-e72ef92b5bdc43cd2584198e2e54e951b70299e8.tar.xz
UXP-e72ef92b5bdc43cd2584198e2e54e951b70299e8.zip
Add Basilisk
Diffstat (limited to 'application/basilisk/themes/osx/compacttheme.css')
-rw-r--r--application/basilisk/themes/osx/compacttheme.css126
1 files changed, 126 insertions, 0 deletions
diff --git a/application/basilisk/themes/osx/compacttheme.css b/application/basilisk/themes/osx/compacttheme.css
new file mode 100644
index 000000000..4cc5e1139
--- /dev/null
+++ b/application/basilisk/themes/osx/compacttheme.css
@@ -0,0 +1,126 @@
+% 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/.
+
+%include ../shared/compacttheme.inc.css
+
+:root {
+ --forwardbutton-width: 32px;
+}
+
+/* Use only 1px separator between nav toolbox and page content */
+#navigator-toolbox::after {
+ border-top-style: none;
+ margin-top: -1px;
+}
+
+/* Include extra space on left/right for dragging since there is no space above
+ the tabs */
+#main-window[tabsintitlebar] #TabsToolbar {
+ padding-left: 50px;
+ padding-right: 50px;
+ margin-bottom: 0; /* Don't overlap the inner highlight at the top of the nav-bar */
+}
+
+/* Don't use the default background for tabs toolbar */
+#TabsToolbar {
+ -moz-appearance: none !important;
+}
+
+/* Get rid of 1px bright strip at the top of window */
+#main-window[tabsintitlebar] #titlebar-content {
+ background: var(--chrome-background-color);
+}
+
+/* Resize things so that the native titlebar is in line with the tabs */
+#main-window[tabsintitlebar] > #titlebar > #titlebar-content > #titlebar-buttonbox-container,
+#main-window[tabsintitlebar] > #titlebar > #titlebar-content > #titlebar-secondary-buttonbox > #titlebar-fullscreen-button {
+ margin-top: 6px;
+}
+
+/* Square back and forward buttons. Need !important on these because there
+ are a lot of more specific selectors sprinkled around elsewhere for changing
+ background / shadows for different states */
+#back-button,
+#forward-button {
+ height: 24px !important;
+ box-shadow: none !important;
+ border: 1px solid var(--chrome-nav-bar-controls-border-color) !important;
+ background: var(--chrome-nav-buttons-background) !important;
+}
+
+#forward-button {
+ border-inline-start: none !important;
+ /* browser.css and friends set up the width of the button to be 32px.
+ * They then set margin-left to -2px to ensure the button is not too wide
+ * compared to the back button, and set padding-left to center the icon
+ * correctly.
+ * In our theme, the back and forward buttons are the same width, with the
+ * back button being 32px with 1px border on both sides. To ensure the
+ * forward button's content box looks like it is the same size with width
+ * set to 32px and a 1px border on only 1 side, we overlap by 1px, so both
+ * buttons end up with a content box that looks like it's 30px.
+ */
+ margin-left: -1px;
+ padding-left: 1px;
+}
+
+#forward-button > .toolbarbutton-icon {
+ margin-left: 0;
+ margin-right: 0;
+}
+
+#back-button:hover:not([disabled="true"]),
+#forward-button:hover:not([disabled="true"]) {
+ background: var(--chrome-nav-buttons-hover-background) !important;
+}
+
+#back-button {
+ border-radius: 3px 0 0 3px !important;
+ padding: 0 !important;
+ margin: 0 !important;
+}
+
+#back-button:hover:active:not([disabled="true"]) {
+ -moz-image-region: rect(18px, 54px, 36px, 36px);
+}
+
+/* Use smaller back button icon */
+@media (min-resolution: 2dppx) {
+ #back-button:hover:active:not([disabled="true"]) {
+ -moz-image-region: rect(36px, 108px, 72px, 72px);
+ }
+}
+
+/* Prevent the hover styling from on the identity icon from overlapping the
+ urlbar border. */
+#identity-box {
+ margin-top: -1px !important;
+ margin-bottom: -1px !important;
+ padding-top: 3px !important;
+ padding-bottom: 3px !important;
+}
+
+#PanelUI-button {
+ margin-top: 0;
+ margin-bottom: 0;
+}
+
+.findbar-closebutton:-moz-lwtheme-brighttext:not(:hover),
+/* Tab styling - make sure to use an inverted icon for the selected tab
+ (brighttext only covers the unselected tabs) */
+.tab-close-button[selected=true]:not(:hover) {
+ -moz-image-region: rect(0, 64px, 16px, 48px);
+}
+@media (min-resolution: 2dppx) {
+ .findbar-closebutton:-moz-lwtheme-brighttext :not(:hover),
+ .tab-close-button[selected=true]:not(:hover) {
+ -moz-image-region: rect(0, 128px, 32px, 96px);
+ }
+}
+
+.ac-type-icon {
+ /* Left-align the type icon in awesomebar popup results with the icon in the
+ urlbar. */
+ margin-inline-start: 14px;
+}