summaryrefslogtreecommitdiff
path: root/src/chrome/browser/browser.css
diff options
context:
space:
mode:
authorVineet Kumar <git@vineetk.net>2022-08-29 17:02:12 -0400
committerVineet Kumar <git@vineetk.net>2026-05-14 17:02:12 -0400
commit199c684366d6cf7431513ff15bae9861166a3a19 (patch)
treeab143c779ca20d6ba39be37b2ee2b93b2802cfa2 /src/chrome/browser/browser.css
parent48c977ab7fcab19dc4da19bba4b209b220c0a33e (diff)
Diffstat (limited to 'src/chrome/browser/browser.css')
-rw-r--r--src/chrome/browser/browser.css85
1 files changed, 43 insertions, 42 deletions
diff --git a/src/chrome/browser/browser.css b/src/chrome/browser/browser.css
index 483e076..6196e97 100644
--- a/src/chrome/browser/browser.css
+++ b/src/chrome/browser/browser.css
@@ -7,18 +7,18 @@
7@namespace html url("http://www.w3.org/1999/xhtml"); 7@namespace html url("http://www.w3.org/1999/xhtml");
8 8
9:root { 9:root {
10 --tab-background: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,1)); 10 --tab-background: #181411;
11 --tab-border-color: rgb(64,64,64); 11 --tab-border-color: #9a9a9a;
12 --tab-border-radius: 0px; 12 --tab-border-radius: 0px;
13 --tab-box-shadow: none; 13 --tab-box-shadow: none;
14 --tab-hover-background: linear-gradient(rgba(0,0,0,.85), rgba(0,0,0,.85)); 14 --tab-hover-background: rgba(24,20,17,.85);
15 --tab-hover-border: var(--tab-border-color); 15 --tab-hover-border: var(--tab-border-color);
16 --tab-pinned-background: linear-gradient(rgba(255,255,255,1) -8px, rgba(23,23,23,1), rgba(23,23,23,1)); 16 --tab-pinned-background: linear-gradient(rgba(255,255,255,1) -8px, rgba(23,23,23,1), rgba(23,23,23,1));
17 --tab-selected-background: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,1)); 17 --tab-selected-background: rgba(24,20,17,1);
18 --tab-selected-border: var(--tab-border-color); 18 --tab-selected-border: var(--tab-border-color);
19 19
20 --toolbar-border: rgba(64,64,64,1); 20 --toolbar-border: #9a9a9a;
21 --toolbar-highlight-top: rgba(32,32,32); 21 --toolbar-highlight-top: #2b2722;
22 --toolbar-highlight-bottom: var(--toolbar-highlight-top); 22 --toolbar-highlight-bottom: var(--toolbar-highlight-top);
23 23
24 --toolbarbutton-background-color: hsla(210,32%,93%,0); 24 --toolbarbutton-background-color: hsla(210,32%,93%,0);
@@ -55,12 +55,12 @@
55} 55}
56 56
57#main-window:not(:-moz-lwtheme):after { 57#main-window:not(:-moz-lwtheme):after {
58 color: #fff !important; 58 color: #bfbbb6 !important;
59 text-shadow: none !important; 59 text-shadow: none !important;
60} 60}
61 61
62#main-window { 62#main-window {
63 background-color: rgb(0,0,0); 63 background-color: #181411;
64} 64}
65 65
66#menubar-items { 66#menubar-items {
@@ -73,9 +73,9 @@
73 73
74#navigator-toolbox { 74#navigator-toolbox {
75 -moz-appearance: none; 75 -moz-appearance: none;
76 background-color: rgb(0,0,0); /*transparent;*/ 76 background-color: #181411; /*transparent;*/
77 border-top: none; 77 border-top: none;
78 color: #fff; 78 color: #bfbbb6;
79} 79}
80 80
81#navigator-toolbox::after { 81#navigator-toolbox::after {
@@ -83,7 +83,7 @@
83 display: -moz-box; 83 display: -moz-box;
84 -moz-box-ordinal-group: 101; 84 -moz-box-ordinal-group: 101;
85 height: 1px; 85 height: 1px;
86 background-color: rgba(0,0,0,1); 86 background-color: #181411;
87} 87}
88 88
89#navigator-toolbox[tabsontop=false]::after, 89#navigator-toolbox[tabsontop=false]::after,
@@ -94,16 +94,16 @@
94#navigator-toolbox > toolbar:not(:-moz-lwtheme) { 94#navigator-toolbox > toolbar:not(:-moz-lwtheme) {
95 -moz-appearance: none; 95 -moz-appearance: none;
96 border-style: none; 96 border-style: none;
97 background-color: rgba(0,0,0,1); 97 background-color: #181411;
98} 98}
99 99
100#toolbar-menubar:not(:-moz-lwtheme), 100#toolbar-menubar:not(:-moz-lwtheme),
101#TabsToolbar[tabsontop=true]:not(:-moz-lwtheme), 101#TabsToolbar[tabsontop=true]:not(:-moz-lwtheme),
102#navigator-toolbox[tabsontop=false] > #nav-bar:not(:-moz-lwtheme), 102#navigator-toolbox[tabsontop=false] > #nav-bar:not(:-moz-lwtheme),
103#nav-bar + #customToolbars + #PersonalToolbar[collapsed=true] + #TabsToolbar[tabsontop=false]:last-child:not(:-moz-lwtheme) { 103#nav-bar + #customToolbars + #PersonalToolbar[collapsed=true] + #TabsToolbar[tabsontop=false]:last-child:not(:-moz-lwtheme) {
104 background-color: rgb(0,0,0) !important; /*transparent !important;*/ 104 background-color: #181411 !important; /*transparent !important;*/
105 background-image: none !important; 105 background-image: none !important;
106 color: #fff; 106 color: #bfbbb6;
107 border-left-style: none !important; 107 border-left-style: none !important;
108 border-right-style: none !important; 108 border-right-style: none !important;
109} 109}
@@ -153,7 +153,7 @@
153 153
154#print-preview-toolbar:not(:-moz-lwtheme) { 154#print-preview-toolbar:not(:-moz-lwtheme) {
155 -moz-appearance: none; 155 -moz-appearance: none;
156 background-color: rgb(0, 0, 0); 156 background-color: #181411;
157} 157}
158 158
159/* ::::: app menu button ::::: */ 159/* ::::: app menu button ::::: */
@@ -185,16 +185,16 @@
185 185
186#appmenu-popup { 186#appmenu-popup {
187 -moz-appearance: none; 187 -moz-appearance: none;
188 background: rgb(0,0,0); 188 background: #181411;
189 border: 1px solid rgb(64,64,64); 189 border: 1px solid rgb(64,64,64);
190} 190}
191#appmenuPrimaryPane { 191#appmenuPrimaryPane {
192 background-color: rgb(0,0,0); 192 background-color: #181411;
193 padding: 2px; 193 padding: 2px;
194 border-inline-end: none; 194 border-inline-end: none;
195} 195}
196#appmenuSecondaryPane { 196#appmenuSecondaryPane {
197 background-color: rgb(0,0,0); 197 background-color: #181411;
198 padding-inline-start: 3px; 198 padding-inline-start: 3px;
199 padding-inline-end: 2px; 199 padding-inline-end: 2px;
200 padding-top: 2px; 200 padding-top: 2px;
@@ -213,7 +213,7 @@
213} 213}
214 214
215.appmenu-edit-button:not([disabled]):hover { 215.appmenu-edit-button:not([disabled]):hover {
216 background: rgb(0,0,0); 216 background: #181411;
217} 217}
218 218
219#appmenuSecondaryPane-spacer { 219#appmenuSecondaryPane-spacer {
@@ -376,13 +376,13 @@ toolbarbutton.bookmark-item {
376} 376}
377 377
378toolbarbutton.bookmark-item:hover { 378toolbarbutton.bookmark-item:hover {
379 background-color: rgb(0,0,0); 379 background-color: #181411;
380 color: white; 380 color: white;
381 text-shadow: none; 381 text-shadow: none;
382} 382}
383 383
384toolbarbutton.bookmark-item:hover:active { 384toolbarbutton.bookmark-item:hover:active {
385 background-color: rgb(0,0,0); 385 background-color: #181411;
386 color: white; 386 color: white;
387 text-shadow: none; 387 text-shadow: none;
388} 388}
@@ -847,8 +847,8 @@ toolbar:not([brighttext]) #tabview-button {
847 border: none; 847 border: none;
848 border-color: rgba(32,32,32,1); 848 border-color: rgba(32,32,32,1);
849 border-radius: 0px; 849 border-radius: 0px;
850 background-color: rgb(0,0,0); 850 background-color: #181411;
851 color: #fff; 851 color: #bfbbb6;
852} 852}
853 853
854#urlbar { 854#urlbar {
@@ -860,22 +860,23 @@ toolbar:not([brighttext]) #tabview-button {
860.searchbar-textbox:-moz-lwtheme { 860.searchbar-textbox:-moz-lwtheme {
861 background-color: rgba(0,0,0,.8); 861 background-color: rgba(0,0,0,.8);
862 border-color: rgba(64,64,64,.27) rgba(64,64,64,.2) rgba(64,64,64,.18); 862 border-color: rgba(64,64,64,.27) rgba(64,64,64,.2) rgba(64,64,64,.18);
863 color: #fff; 863 color: #bfbbb6;
864} 864}
865 865
866html|*.urlbar-input:-moz-lwtheme:-moz-placeholder, 866html|*.urlbar-input:-moz-lwtheme:-moz-placeholder,
867.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input:-moz-placeholder { 867.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input:-moz-placeholder {
868 color: #fff; 868 color: #bfbbb6;
869} 869}
870 870
871#urlbar:-moz-lwtheme[focused="true"], 871#urlbar:-moz-lwtheme[focused="true"],
872.searchbar-textbox:-moz-lwtheme[focused="true"] { 872.searchbar-textbox:-moz-lwtheme[focused="true"] {
873 background-color: rgb(0,0,0); 873 background-color: #181411;
874} 874}
875 875
876#urlbar-container { 876#urlbar-container {
877 -moz-box-orient: horizontal; 877 -moz-box-orient: horizontal;
878 -moz-box-align: stretch; 878 -moz-box-align: stretch;
879 background-color: #181411;
879} 880}
880 881
881.urlbar-textbox-container { 882.urlbar-textbox-container {
@@ -1086,7 +1087,7 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon
1086 1087
1087.ac-url-text, 1088.ac-url-text,
1088.ac-action-text { 1089.ac-action-text {
1089 color: #fff; 1090 color: #bfbbb6;
1090} 1091}
1091 1092
1092 1093
@@ -1266,20 +1267,20 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-
1266} 1267}
1267 1268
1268#sidebar-search-container { 1269#sidebar-search-container {
1269 background-color: #000; 1270 background-color: #181411;
1270} 1271}
1271 1272
1272#sidebar-header { 1273#sidebar-header {
1273 -moz-appearance: none; 1274 -moz-appearance: none;
1274 border-top: none; 1275 border-top: none;
1275 border-bottom: none; 1276 border-bottom: none;
1276 background-color: rgb(0,0,0); 1277 background-color: #181411;
1277 color: #fff; 1278 color: #bfbbb6;
1278} 1279}
1279 1280
1280.browserContainer > findbar { 1281.browserContainer > findbar {
1281 background-color: rgb(0,0,0); 1282 background-color: #181411;
1282 color: #fff; 1283 color: #bfbbb6;
1283 text-shadow: none; 1284 text-shadow: none;
1284} 1285}
1285 1286
@@ -1332,7 +1333,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-
1332 border-radius: var(--tab-border-radius) var(--tab-border-radius) 0 0; 1333 border-radius: var(--tab-border-radius) var(--tab-border-radius) 0 0;
1333 box-shadow: var(--tab-box-shadow); 1334 box-shadow: var(--tab-box-shadow);
1334 margin-inline-start: -1px; 1335 margin-inline-start: -1px;
1335 color: #fff; 1336 color: #bfbbb6;
1336} 1337}
1337 1338
1338.tabs-newtab-button { 1339.tabs-newtab-button {
@@ -2202,12 +2203,12 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2202#ctrlTab-panel { 2203#ctrlTab-panel {
2203 padding: 20px 10px 10px; 2204 padding: 20px 10px 10px;
2204 font-weight: bold; 2205 font-weight: bold;
2205 background: rgb(0,0,0); 2206 background: #181411;
2206 color: #fff; 2207 color: #bfbbb6;
2207} 2208}
2208 2209
2209.ctrlTab-favicon[src] { 2210.ctrlTab-favicon[src] {
2210 background-color: rgb(0,0,0); 2211 background-color: #181411;
2211 width: 20px; 2212 width: 20px;
2212 height: 20px; 2213 height: 20px;
2213 padding: 2px; 2214 padding: 2px;
@@ -2252,8 +2253,8 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2252 padding-bottom: 10px; 2253 padding-bottom: 10px;
2253 -moz-appearance: none; 2254 -moz-appearance: none;
2254 border: none; 2255 border: none;
2255 background: rgb(0,0,0); 2256 background: #181411;
2256 color: #fff; 2257 color: #bfbbb6;
2257} 2258}
2258 2259
2259#allTabs-meta { 2260#allTabs-meta {
@@ -2270,7 +2271,7 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2270} 2271}
2271 2272
2272.allTabs-favicon[src] { 2273.allTabs-favicon[src] {
2273 background-color: rgb(0,0,0); 2274 background-color: #181411;
2274 width: 22px; 2275 width: 22px;
2275 height: 22px; 2276 height: 22px;
2276 padding-top: 1px; 2277 padding-top: 1px;
@@ -2305,7 +2306,7 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2305} 2306}
2306 2307
2307#allTabs-tab-close-button { 2308#allTabs-tab-close-button {
2308 background: rgb(0,0,0); 2309 background: #181411;
2309 border-bottom-left-radius: 4px; 2310 border-bottom-left-radius: 4px;
2310 padding: 2px 1px; 2311 padding: 2px 1px;
2311} 2312}
@@ -2320,7 +2321,7 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2320#addon-bar:not(:-moz-lwtheme), 2321#addon-bar:not(:-moz-lwtheme),
2321#FindToolbar:not(:-moz-lwtheme) { 2322#FindToolbar:not(:-moz-lwtheme) {
2322 -moz-appearance: none; 2323 -moz-appearance: none;
2323 color: #fff; 2324 color: #bfbbb6;
2324} 2325}
2325 2326
2326#status-bar { 2327#status-bar {
@@ -2559,5 +2560,5 @@ toolbar[mode="text"] #addonbar-closebutton > .toolbarbutton-icon {
2559} 2560}
2560 2561
2561#main-window[treestyletab-mode=vertical]:not([treestyletab-style]) .treestyletab-tabbar-placeholder { 2562#main-window[treestyletab-mode=vertical]:not([treestyletab-style]) .treestyletab-tabbar-placeholder {
2562 background: rgb(0,0,0) !important; 2563 background: #181411 !important;
2563} 2564}