feat(home:firefox): minor adjustments to ooksfox css
This commit is contained in:
		
							parent
							
								
									8f3a3a8be8
								
							
						
					
					
						commit
						3d4b7f6b40
					
				
					 1 changed files with 122 additions and 145 deletions
				
			
		|  | @ -3,174 +3,151 @@ | ||||||
|   fonts, |   fonts, | ||||||
|   ... |   ... | ||||||
| }: | }: | ||||||
| # css | with palette; | ||||||
| '' | #css | ||||||
|   /* minimal firefox css ooks  */ |   '' | ||||||
|  |       /* minimal firefox css ooks  */ | ||||||
| 
 | 
 | ||||||
|   /* ===== Color Variables and Root Styles ===== */ |       /* ===== Color Variables and Root Styles ===== */ | ||||||
|   :root { |       :root { | ||||||
|     /* Base colors */ |         /* Fonts */ | ||||||
|     --base00: #${palette.base00}; /* ---- */ |         --font-mono: ${fonts.monospace.family}, monospace; | ||||||
|     --base01: #${palette.base01}; /* --- */ |         } | ||||||
|     --base02: #${palette.base02}; /* -- */ |  | ||||||
|     --base03: #${palette.base03}; /* - */ |  | ||||||
|     --base04: #${palette.base04}; /* + */ |  | ||||||
|     --base05: #${palette.base05}; /* ++ */ |  | ||||||
|     --base06: #${palette.base06}; /* +++ */ |  | ||||||
|     --base07: #${palette.base07}; /* ++++ */ |  | ||||||
| 
 | 
 | ||||||
|     /* Accent colors */ |       /* ===== General UI Modifications ===== */ | ||||||
|     --base08: #${palette.base08}; /* red */ |       /* Hide status panel */ | ||||||
|     --base09: #${palette.base09}; /* orange */ |       #statuspanel { display: none !important; } | ||||||
|     --base0A: #${palette.base0A}; /* yellow */ |  | ||||||
|     --base0B: #${palette.base0B}; /* green */ |  | ||||||
|     --base0C: #${palette.base0C}; /* aqua/cyan */ |  | ||||||
|     --base0D: #${palette.base0D}; /* blue */ |  | ||||||
|     --base0E: #${palette.base0E}; /* purple */ |  | ||||||
|     --base0F: #${palette.base0F}; /* brown */ |  | ||||||
| 
 | 
 | ||||||
|     /* UI-specific colors */ |       /* Remove border radius from menus */ | ||||||
|     --toolbar-bgcolor: red; |       menupopup, panel { --panel-border-radius: 0px !important; } | ||||||
|     --tab-active-bg-color: red; |       menu, menuitem, menucaption { border-radius: 0px !important; } | ||||||
| 
 | 
 | ||||||
|     /* Fonts */ |       /* Hide navigation context menu items */ | ||||||
|     --font-mono: ${fonts.monospace.family}, monospace; |       menupopup > #context-navigation, | ||||||
|     } |       menupopup > #context-sep-navigation { display: none !important; } | ||||||
| 
 | 
 | ||||||
|   /* ===== General UI Modifications ===== */ |       /* Hide various toolbar buttons */ | ||||||
|   /* Hide status panel */ |       #back-button, | ||||||
|   #statuspanel { display: none !important; } |       #forward-button, | ||||||
|  |       #reload-button, | ||||||
|  |       #stop-button, | ||||||
|  |       #home-button, | ||||||
|  |       #library-button, | ||||||
|  |       #PanelUI-button, | ||||||
|  |       #unified-extensions-button, | ||||||
|  |       #star-button, | ||||||
|  |       #reader-mode-button, | ||||||
|  |       #save-to-pocket-button, | ||||||
|  |       #tracking-protection-icon-container, | ||||||
|  |       #page-action-buttons, | ||||||
|  |       #fxa-toolbar-menu-button, | ||||||
|  |       #identity-box { display: none !important; } | ||||||
| 
 | 
 | ||||||
|   /* Remove border radius from menus */ |       /* Hide customizable UI springs */ | ||||||
|   menupopup, panel { --panel-border-radius: 0px !important; } |       #customizableui-special-spring1, | ||||||
|   menu, menuitem, menucaption { border-radius: 0px !important; } |       #customizableui-special-spring2 { display: none; } | ||||||
| 
 | 
 | ||||||
|   /* Hide navigation context menu items */ |       /* Hide Personal Toolbar */ | ||||||
|   menupopup > #context-navigation, |       #PersonalToolbar { display: none !important; } | ||||||
|   menupopup > #context-sep-navigation { display: none !important; } |  | ||||||
| 
 | 
 | ||||||
|   /* Hide various toolbar buttons */ |       /* ===== URL Bar Styling ===== */ | ||||||
|   #back-button, |  | ||||||
|   #forward-button, |  | ||||||
|   #reload-button, |  | ||||||
|   #stop-button, |  | ||||||
|   #home-button, |  | ||||||
|   #library-button, |  | ||||||
|   #PanelUI-button, |  | ||||||
|   #unified-extensions-button, |  | ||||||
|   #star-button, |  | ||||||
|   #reader-mode-button, |  | ||||||
|   #save-to-pocket-button, |  | ||||||
|   #tracking-protection-icon-container, |  | ||||||
|   #page-action-buttons, |  | ||||||
|   #fxa-toolbar-menu-button, |  | ||||||
|   #identity-box { display: none !important; } |  | ||||||
| 
 | 
 | ||||||
|   /* Hide customizable UI springs */ |       #urlbar-container { | ||||||
|   #customizableui-special-spring1, |         margin-left: 0 !important; | ||||||
|   #customizableui-special-spring2 { display: none; } |         margin-right: 0 !important; | ||||||
|  |         padding-top: 0 !important; | ||||||
|  |         padding-bottom: 0!important; | ||||||
|  |       } | ||||||
| 
 | 
 | ||||||
|   /* Hide Personal Toolbar */ |       #urlbar-background { | ||||||
|   #PersonalToolbar { display: none !important; } |         border: solid 1px !important; | ||||||
|  |         border-radius: 0 !important; | ||||||
|  |         outline: none !important; | ||||||
|  |         background: #${crust} !important; | ||||||
|  |       } | ||||||
| 
 | 
 | ||||||
|   /* ===== URL Bar Styling ===== */ |       #navigator-toolbox { | ||||||
|   /* Style input box */ |         border: none !important; | ||||||
|   moz-input-box { |         border-bottom: solid 1px !important;\ | ||||||
|     background: var(--base01) !important; |       } | ||||||
|     color: var(--base07) !important; |  | ||||||
|     border: solid 1px var(--base05) !important; |  | ||||||
|   } |  | ||||||
| 
 | 
 | ||||||
|   /* Style input box */ |       /* Hide URL bar go button */ | ||||||
|   #urlbar-input-container { |       .urlbar-go-button { display: none !important; } | ||||||
|     background: var(--base08) !important; |  | ||||||
|     color: var(--base07) !important; |  | ||||||
|     border: none !important; |  | ||||||
|     border-radius: 5 !important; |  | ||||||
|   } |  | ||||||
| 
 | 
 | ||||||
|   /* Hide URL bar go button */ |       /* Remove navigation bar background */ | ||||||
|   .urlbar-go-button { display: none !important; } |       #nav-bar.browser-toolbar { background: none !important; } | ||||||
| 
 | 
 | ||||||
|   /* Remove navigation bar background */ |       /* Position and style navigation bar */ | ||||||
|   #nav-bar.browser-toolbar { background: none !important; } |  | ||||||
| 
 | 
 | ||||||
|   /* Position and style navigation bar */ |       #nav-bar { | ||||||
|   #nav-bar { |         text-align: center; | ||||||
|     opacity: 0; |         min-height: 0 !important; | ||||||
|     text-align: center; |         max-height: 0 !important; | ||||||
|     position: fixed !important; |         height: 0 !important; | ||||||
|     border: solid 1px var(--nix-fg1) !important; |       } | ||||||
|     top: 30px; |  | ||||||
|     left: 25%; |  | ||||||
|     right: 25%; |  | ||||||
|     z-index: 1; |  | ||||||
|   } |  | ||||||
| 
 | 
 | ||||||
|   /* Expand navigation bar on focus */ |     /* Expand navigation bar on focus */ | ||||||
|   #nav-bar:focus-within { |       #nav-bar:focus-within { | ||||||
|     opacity: 1; |         max-height: 40px !important; | ||||||
|     max-height: 40px !important; |         height: 60px !important; | ||||||
|     height: 60px !important; |         min-height: 15px !important; | ||||||
|     min-height: 15px !important; |       } | ||||||
|   } |  | ||||||
| 
 | 
 | ||||||
|   /* ===== Tab Bar Styling ===== */ |       /* ===== Tab Bar Styling ===== */ | ||||||
|   /* Hide title bar buttons and spacer */ |       /* Hide title bar buttons and spacer */ | ||||||
|   .titlebar-close, |       .titlebar-close, | ||||||
|   .titlebar-spacer { display: none !important; } |       .titlebar-spacer { display: none !important; } | ||||||
| 
 | 
 | ||||||
|   /* Remove tab margin */ |       /* Remove tab margin */ | ||||||
|   #titlebar { |       #titlebar { | ||||||
|     --proton-tab-block-margin: 0px !important; |         --proton-tab-block-margin: 0px !important; | ||||||
|     --tab-block-margin: 0px !important; |         --tab-block-margin: 0px !important; | ||||||
|   } |       } | ||||||
| 
 | 
 | ||||||
|   /* Remove tab shadows */ |       /* Remove tab shadows */ | ||||||
|   #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { |       #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { | ||||||
|     box-shadow: none !important; |         box-shadow: none !important; | ||||||
|   } |       } | ||||||
| 
 | 
 | ||||||
|   /* Hide tab-related buttons */ |       /* Hide tab-related buttons */ | ||||||
|   #alltabs-button, |       #alltabs-button, | ||||||
|   #tabs-newtab-button, |       #tabs-newtab-button, | ||||||
|   #firefox-view-button, |       #firefox-view-button, | ||||||
|   #new-tab-button, |       #new-tab-button, | ||||||
|   .tab-close-button { display: none !important; } |       .tab-close-button { display: none !important; } | ||||||
| 
 | 
 | ||||||
|   /* Style tabs */ |       /* Style tabs */ | ||||||
|   tab { |       tab { | ||||||
|     font-family: var(--font-mono); |         font-family: var(--font-mono); | ||||||
|     font-weight: bold; |         font-weight: bold; | ||||||
|   } |       } | ||||||
| 
 | 
 | ||||||
|   /* Set tab and tab bar height */ |       /* Set tab and tab bar height */ | ||||||
|   #TabsToolbar, .tabbrowser-tab { |       #TabsToolbar, .tabbrowser-tab { | ||||||
|     max-height: 35px !important; |         max-height: 35px !important; | ||||||
|     background: var(--base00) !important; |         background: #${crust} !important; | ||||||
|     padding-bottom:0 !important; |         border: none; | ||||||
|     border: none; |       } | ||||||
|   } |  | ||||||
| 
 | 
 | ||||||
|   /* Center tabs when not overflowing */ |       /* Center tabs when not overflowing */ | ||||||
|   #tabbrowser-arrowscrollbox:not([overflowing]) { |       #tabbrowser-arrowscrollbox:not([overflowing]) { | ||||||
|     --uc-flex-justify: center; |         --uc-flex-justify: center; | ||||||
|   } |       } | ||||||
| 
 | 
 | ||||||
|   scrollbox[orient="horizontal"] { |       scrollbox[orient="horizontal"] { | ||||||
|     justify-content: var(--uc-flex-justify, initial); |         justify-content: var(--uc-flex-justify, initial); | ||||||
|   } |       } | ||||||
| 
 | 
 | ||||||
|   /* Style selected tabs */ |       /* Style selected tabs */ | ||||||
|   #tabbrowser-tabs .tabbrowser-tab[selected] .tab-content { |       #tabbrowser-tabs .tabbrowser-tab[selected] .tab-content { | ||||||
|     border: solid 1px var(--base05) !important; |         border: solid 1px var(--base05) !important; | ||||||
|     color: var(--base07); |         color: var(--base07); | ||||||
|     background: var(--base02) |         background: var(--base02) | ||||||
|   } |       } | ||||||
| 
 | 
 | ||||||
|   /* Style non-selected tabs */ |       /* Style non-selected tabs */ | ||||||
|   tab:not([selected="true"]) { |       tab:not([selected="true"]) { | ||||||
|     /* border: solid 1px var(--base05) !important; */ |         /* border: solid 1px var(--base05) !important; */ | ||||||
|     background: var(--base01) !important; |         background: var(--base01) !important; | ||||||
|   } |       } | ||||||
| '' |   '' | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue