aboutsummaryrefslogtreecommitdiff
path: root/arc-firefox-theme/chrome/browser/devedition.css
diff options
context:
space:
mode:
authorHorst31802015-08-19 19:38:44 +0200
committerHorst31802015-08-19 19:38:44 +0200
commit1d5f9f7aa7ac0bfe6a091b7c1395cafa33d52c43 (patch)
tree99efccaeba25e26aa03bdefcb83fb874b5061acc /arc-firefox-theme/chrome/browser/devedition.css
parentc5fee00815d47f0d3970c6c4761ef1c15e5ee16f (diff)
downloadsolarc-firefox-theme-1d5f9f7aa7ac0bfe6a091b7c1395cafa33d52c43.tar.gz
solarc-firefox-theme-1d5f9f7aa7ac0bfe6a091b7c1395cafa33d52c43.tar.xz
solarc-firefox-theme-1d5f9f7aa7ac0bfe6a091b7c1395cafa33d52c43.zip
add firefox theme40.20150819
Diffstat (limited to 'arc-firefox-theme/chrome/browser/devedition.css')
-rw-r--r--arc-firefox-theme/chrome/browser/devedition.css413
1 files changed, 413 insertions, 0 deletions
diff --git a/arc-firefox-theme/chrome/browser/devedition.css b/arc-firefox-theme/chrome/browser/devedition.css
new file mode 100644
index 0000000..c795641
--- /dev/null
+++ b/arc-firefox-theme/chrome/browser/devedition.css
@@ -0,0 +1,413 @@
+
+
+/* devedition.css is loaded in browser.xul after browser.css when it is
+ preffed on. The bulk of the styling is here in the shared file, but
+ there are overrides for each platform in their devedition.css files. */
+
+:root {
+ --tab-toolbar-navbar-overlap: 0px;
+ --space-above-tabbar: 0px;
+ --toolbarbutton-text-shadow: none;
+}
+
+:root[devtoolstheme="dark"] {
+ /* Chrome */
+ --chrome-background-color: #1C2126;
+ --chrome-color: #F5F7FA;
+ --chrome-secondary-background-color: #39424D;
+ --chrome-navigator-toolbox-separator-color: rgba(0,0,0,.2);
+ --chrome-nav-bar-separator-color: rgba(0,0,0,.2);
+ --chrome-nav-buttons-background: #252C33;
+ --chrome-nav-buttons-hover-background: #1B2127;
+ --chrome-nav-bar-controls-border-color: #1D2328;
+ --chrome-selection-color: #fff;
+ --chrome-selection-background-color: #074D75;
+
+ /* Tabs */
+ --tabs-toolbar-color: #F5F7FA;
+ --tab-background-color: #1C2126;
+ --tab-hover-background-color: #07090a;
+ --tab-separator-color: #474C50;
+ --tab-selection-color: #f5f7fa;
+ --tab-selection-background-color: #1a4666;
+ --tab-selection-box-shadow: 0 2px 0 #D7F1FF inset,
+ 0 -2px 0 rgba(0,0,0,.05) inset,
+ 0 -1px 0 rgba(0,0,0,.3) inset;
+ --pinned-tab-glow: radial-gradient(22px at center calc(100% - 2px), rgba(76,158,217,0.9) 13%, rgba(0,0,0,0.4) 16%, transparent 70%);
+
+ /* Toolbar buttons */
+ --toolbarbutton-hover-background: rgba(25,33, 38,.6) linear-gradient(rgba(25,33,38,.6), rgba(25,33,38,.6)) padding-box;
+ --toolbarbutton-hover-boxshadow: none;
+ --toolbarbutton-hover-bordercolor: rgba(25,33,38,.6);
+ --toolbarbutton-active-background: rgba(25,33,38,1) linear-gradient(rgba(25,33,38,1), rgba(25,33,38,1)) border-box;
+ --toolbarbutton-active-boxshadow: none;
+ --toolbarbutton-active-bordercolor: rgba(25,33,38,.8);
+ --toolbarbutton-checkedhover-backgroundcolor: #1D4F73;
+ --toolbarbutton-combined-boxshadow: none;
+ --toolbarbutton-combined-backgroundimage: linear-gradient(#5F6670 0, #5F6670 18px);
+
+ /* Identity box */
+ --identity-box-chrome-color: #46afe3;
+ --identity-box-chrome-background-image: linear-gradient(#5F6670 0, #5F6670 100%);
+ --identity-box-verified-background-image: linear-gradient(#5F6670 0, #5F6670 100%);
+ --verified-identity-box-backgroundcolor: transparent;
+
+ /* Url and search bars */
+ --url-and-searchbar-background-color: #171B1F;
+ --url-and-searchbar-color: #fff;
+ --urlbar-dropmarker-url: url("chrome://browser/skin/devedition/urlbar-history-dropmarker.svg");
+ --urlbar-dropmarker-region: rect(0px, 11px, 14px, 0px);
+ --urlbar-dropmarker-active-region: rect(0px, 22px, 14px, 11px);
+ --urlbar-dropmarker-2x-url: url("chrome://browser/skin/devedition/urlbar-history-dropmarker.svg");
+ --urlbar-dropmarker-2x-region: rect(0px, 11px, 14px, 0px);
+ --urlbar-dropmarker-active-2x-region: rect(0px, 22px, 14px, 11px);
+ --search-button-image: url("chrome://browser/skin/devedition/search.svg#search-icon-inverted");
+}
+
+:root[devtoolstheme="dark"] .searchbar-dropmarker-image {
+ --searchbar-dropmarker-url: url("chrome://browser/skin/devtools/dropmarker.svg");
+ --searchbar-dropmarker-2x-url: url("chrome://browser/skin/devtools/dropmarker.svg");
+}
+
+:root[devtoolstheme="light"] {
+ --url-and-searchbar-background-color: #fff;
+
+ --chrome-background-color: #E3E4E6;
+ --chrome-color: #18191a;
+ --chrome-secondary-background-color: #f5f6f7;
+ --chrome-navigator-toolbox-separator-color: #cccccc;
+ --chrome-nav-bar-separator-color: #B6B6B8;
+ --chrome-nav-buttons-background: #fcfcfc;
+ --chrome-nav-buttons-hover-background: #DADBDB;
+ --chrome-nav-bar-controls-border-color: #ccc;
+ --chrome-selection-color: #f5f7fa;
+ --chrome-selection-background-color: #4c9ed9;
+
+ --tab-background-color: #E3E4E6;
+ --tab-hover-background-color: #D7D8DA;
+ --tab-separator-color: #C6C6C7;
+ --tab-selection-color: #f5f7fa;
+ --tab-selection-background-color: #4c9ed9;
+ --tab-selection-box-shadow: 0 2px 0 #9FDFFF inset,
+ 0 -2px 0 rgba(0,0,0,.05) inset,
+ 0 -1px 0 rgba(0,0,0,.2) inset;
+ --pinned-tab-glow: radial-gradient(22px at center calc(100% - 2px), rgba(76,158,217,0.9) 13%, transparent 16%);
+
+
+ /* Toolbar buttons */
+ --toolbarbutton-hover-background: #eaeaea;
+ --toolbarbutton-hover-boxshadow: none;
+ --toolbarbutton-hover-bordercolor: rgba(0,0,0,0.1);
+ --toolbarbutton-active-background: #d7d7d8 border-box;
+ --toolbarbutton-active-boxshadow: none;
+ --toolbarbutton-active-bordercolor: rgba(0,0,0,0.15);
+ --toolbarbutton-checkedhover-backgroundcolor: #d7d7d8;
+ --toolbarbutton-combined-boxshadow: none;
+ --toolbarbutton-combined-backgroundimage: linear-gradient(rgba(0,0,0,0.1) 0, rgba(0,0,0,0.1) 18px);
+
+ /* Url and search bars */
+ --search-button-image: url("chrome://browser/skin/devedition/search.svg#search-icon");
+}
+
+/* Give some space to drag the window around while customizing
+ (normal space to left and right of tabs doesn't work in this case) */
+#main-window[tabsintitlebar][customizing] {
+ --space-above-tabbar: 9px;
+}
+
+/* Override @tabCurveHalfWidth@ and @tabCurveWidth@. XXX: Switch to a CSS variable once the perf is sorted out - bug 1088771 */
+.tab-background-middle {
+ border-left-width: 0;
+ border-right-width: 0;
+ margin: 0;
+}
+
+.tab-background,
+.tabs-newtab-button {
+ -moz-margin-end: 0;
+ -moz-margin-start: 0;
+}
+
+.tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox {
+ -moz-padding-end: 0;
+ -moz-padding-start: 0;
+}
+
+.tab-background-start[visuallyselected=true]::after,
+.tab-background-start[visuallyselected=true]::before,
+.tab-background-start,
+.tab-background-end,
+.tab-background-end[visuallyselected=true]::after,
+.tab-background-end[visuallyselected=true]::before {
+ width: 0;
+}
+
+.tab-background-start[visuallyselected=true]::after,
+.tab-background-end[visuallyselected=true]::after {
+ -moz-margin-start: 0;
+}
+/* End override @tabCurveHalfWidth@ and @tabCurveWidth@ */
+
+#urlbar ::-moz-selection,
+#navigator-toolbox .searchbar-textbox ::-moz-selection,
+.browserContainer > findbar ::-moz-selection {
+ background-color: var(--chrome-selection-background-color);
+ color: var(--chrome-selection-color);
+}
+
+/* Change the base colors for the browser chrome */
+
+#tabbrowser-tabs,
+#TabsToolbar,
+#browser-panel {
+ background: var(--chrome-background-color);
+ color: var(--chrome-color);
+}
+
+#navigator-toolbox::after {
+ background: var(--chrome-navigator-toolbox-separator-color);
+}
+
+#navigator-toolbox > toolbar:not(#TabsToolbar):not(#toolbar-menubar),
+.browserContainer > findbar,
+#browser-bottombox {
+ background-color: var(--chrome-secondary-background-color) !important;
+ color: var(--chrome-color);
+}
+
+.browserContainer > findbar {
+ background-image: none;
+}
+
+.browserContainer > .findbar-textbox {
+ background-color: var(--url-and-searchbar-background-color) !important;
+ color: var(--url-and-searchbar-color);
+}
+
+/* Default findbar text color doesn't look good - Bug 1125677 */
+.browserContainer > findbar .findbar-find-status,
+.browserContainer > findbar .found-matches {
+ color: inherit;
+}
+
+#navigator-toolbox .toolbarbutton-1,
+.browserContainer > findbar .findbar-button,
+#PlacesToolbar toolbarbutton.bookmark-item {
+ color: var(--chrome-color);
+ text-shadow: var(--toolbarbutton-text-shadow);
+}
+
+/* Using toolbar[brighttext] instead of important to override linux */
+toolbar[brighttext] #downloads-indicator-counter {
+ text-shadow: var(--toolbarbutton-text-shadow);
+ color: var(--chrome-color);
+}
+
+#TabsToolbar {
+ text-shadow: none !important;
+ color: var(--chrome-color) !important; /* Make sure that the brighttext attribute is added */
+}
+
+/* URL bar and search bar*/
+#urlbar,
+#navigator-toolbox .searchbar-textbox {
+ background-color: var(--url-and-searchbar-background-color) !important;
+ background-image: none !important;
+ color: var(--url-and-searchbar-color) !important;
+ border: 1px solid var(--chrome-nav-bar-controls-border-color) !important;
+ box-shadow: none !important;
+}
+
+#urlbar {
+ -moz-border-start: none !important;
+ opacity: 1 !important;
+}
+
+window:not([chromehidden~="toolbar"]) #urlbar-wrapper {
+ overflow: -moz-hidden-unscrollable;
+ clip-path: none;
+ -moz-margin-start: 0;
+}
+
+/* Make the white notication box stick out less. */
+#notification-popup-box {
+ border-radius: 0;
+ border: none;
+ background: transparent;
+}
+
+/* Nav bar specific stuff */
+#nav-bar {
+ margin-top: 0 !important;
+ border-top: none !important;
+ border-bottom: none !important;
+ border-radius: 0 !important;
+ box-shadow: 0 -1px var(--chrome-nav-bar-separator-color) !important;
+ background-image: none !important;
+}
+
+/* No extra vertical padding for nav bar */
+#nav-bar-customization-target,
+#nav-bar {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+/* Use smaller back button icon */
+#back-button {
+ -moz-image-region: rect(0, 54px, 18px, 36px);
+}
+
+searchbar:not([oneoffui]) .search-go-button {
+ /* !important is needed because searchbar.css is loaded after this */
+ -moz-image-region: auto !important;
+ list-style-image: var(--search-button-image);
+}
+
+.tab-background {
+ visibility: hidden;
+}
+
+/* Make the tab splitter 1px wide with a solid background. */
+#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
+.tabbrowser-tab:not([visuallyselected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
+#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after {
+ background: var(--tab-separator-color);
+ opacity: 1;
+ width: 1px;
+ -moz-margin-start: 0;
+ -moz-margin-end: -1px;
+}
+
+/* For the last tab separator, use margin-start of -1px to prevent jittering
+ due to the ::after element causing the width of the tab to extend, which
+ causes an overflow and makes it disappear, which removes the overflow and
+ causes it to reappear, etc, etc. */
+#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after {
+ -moz-margin-start: -1px;
+ -moz-margin-end: 0;
+}
+
+.tabbrowser-arrowscrollbox > .scrollbutton-down,
+.tabbrowser-arrowscrollbox > .scrollbutton-up {
+ background-color: var(--tab-background-color);
+ border-color: transparent;
+}
+
+.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:not([collapsed]),
+.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:not([collapsed]) {
+ margin-bottom: 0;
+}
+
+.tabbrowser-tab {
+ /* We normally rely on other tab elements for pointer events, but this
+ theme hides those so we need it set here instead */
+ pointer-events: auto;
+}
+
+.tabbrowser-tab[pinned][titlechanged]:not([visuallyselected="true"]) > .tab-stack > .tab-content {
+ background-image: var(--pinned-tab-glow);
+ background-position: center;
+ background-size: 100%;
+}
+
+.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):hover,
+.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):hover,
+.tabbrowser-tab:hover {
+ background-color: var(--tab-hover-background-color);
+}
+
+.tabbrowser-tab[visuallyselected] {
+ color: var(--tab-selection-color) !important; /* Override color: inherit */
+ background-color: var(--tab-selection-background-color);
+ box-shadow: var(--tab-selection-box-shadow);
+}
+
+/* Don't need space for the tab curves (66px - 30px) */
+.tabs-newtab-button {
+ width: 36px;
+}
+
+.tabs-newtab-button:hover {
+ /* Important needed because !important is used in browser.css */
+ background-color: var(--tab-hover-background-color) !important;
+ background-image: none;
+}
+
+.tab-close-button[selected]:not(:hover) {
+ background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 80, 16, 64);
+}
+
+/* The menubar and tabs toolbar should match the devedition theme */
+#TabsToolbar,
+#toolbar-menubar {
+ -moz-appearance: none !important;
+}
+#main-menubar {
+ color: var(--chrome-color);
+}
+#main-menubar > menu:not([open]) {
+ color: inherit;
+}
+
+/* Allow buttons with -moz-appearance set to look normal on hover and open states */
+#navigator-toolbox .toolbarbutton-1:-moz-any(:hover, [open="true"]),
+#PlacesToolbar toolbarbutton.bookmark-item:-moz-any(:hover, [open="true"]) {
+ color: initial;
+}
+
+/* Square back and forward buttons */
+#back-button > .toolbarbutton-icon,
+#forward-button > .toolbarbutton-icon {
+ margin: 0;
+ border: 1px solid var(--chrome-nav-bar-controls-border-color);
+ padding: 2px 5px;
+ background: var(--chrome-nav-buttons-background);
+ box-shadow: none !important;
+}
+
+#forward-button > .toolbarbutton-icon {
+ -moz-border-start: none;
+}
+
+/* Override a box shadow for disabled back button */
+#main-window:not([customizing]) #back-button[disabled] > .toolbarbutton-icon {
+ box-shadow: none !important;
+}
+
+#back-button:hover:not([disabled="true"]) > .toolbarbutton-icon,
+#forward-button:hover:not([disabled="true"]) > .toolbarbutton-icon {
+ background: var(--chrome-nav-buttons-hover-background) !important;
+}
+
+#back-button > .toolbarbutton-icon {
+ border-radius: 2px 0 0 2px !important;
+}
+
+.urlbar-history-dropmarker {
+ -moz-appearance: none;
+ padding: 0 3px;
+ list-style-image: var(--urlbar-dropmarker-url);
+ -moz-image-region: var(--urlbar-dropmarker-region);
+}
+
+/* Add the proper background for tab overflow */
+#alltabs-button,
+#new-tab-button {
+ background: var(--chrome-background-color);
+}
+
+#new-tab-button:hover > .toolbarbutton-icon {
+ border-color: transparent !important;
+}
+
+/* Prevent double border below tabs toolbar */
+#TabsToolbar:not([collapsed="true"]) + #nav-bar {
+ border-top-width: 0 !important;
+}
+
+/* Prevent devedition foreground color from seeping into the sidebar-box (since
+ * its background colors aren't affected by the devedition theme) */
+#sidebar-box {
+ color: initial;
+}