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, | ||||
|   ... | ||||
| }: | ||||
| # css | ||||
| '' | ||||
|   /* minimal firefox css ooks  */ | ||||
| with palette; | ||||
| #css | ||||
|   '' | ||||
|       /* minimal firefox css ooks  */ | ||||
| 
 | ||||
|   /* ===== Color Variables and Root Styles ===== */ | ||||
|   :root { | ||||
|     /* Base colors */ | ||||
|     --base00: #${palette.base00}; /* ---- */ | ||||
|     --base01: #${palette.base01}; /* --- */ | ||||
|     --base02: #${palette.base02}; /* -- */ | ||||
|     --base03: #${palette.base03}; /* - */ | ||||
|     --base04: #${palette.base04}; /* + */ | ||||
|     --base05: #${palette.base05}; /* ++ */ | ||||
|     --base06: #${palette.base06}; /* +++ */ | ||||
|     --base07: #${palette.base07}; /* ++++ */ | ||||
|       /* ===== Color Variables and Root Styles ===== */ | ||||
|       :root { | ||||
|         /* Fonts */ | ||||
|         --font-mono: ${fonts.monospace.family}, monospace; | ||||
|         } | ||||
| 
 | ||||
|     /* Accent colors */ | ||||
|     --base08: #${palette.base08}; /* red */ | ||||
|     --base09: #${palette.base09}; /* orange */ | ||||
|     --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 */ | ||||
|       /* ===== General UI Modifications ===== */ | ||||
|       /* Hide status panel */ | ||||
|       #statuspanel { display: none !important; } | ||||
| 
 | ||||
|     /* UI-specific colors */ | ||||
|     --toolbar-bgcolor: red; | ||||
|     --tab-active-bg-color: red; | ||||
|       /* Remove border radius from menus */ | ||||
|       menupopup, panel { --panel-border-radius: 0px !important; } | ||||
|       menu, menuitem, menucaption { border-radius: 0px !important; } | ||||
| 
 | ||||
|     /* Fonts */ | ||||
|     --font-mono: ${fonts.monospace.family}, monospace; | ||||
|     } | ||||
|       /* Hide navigation context menu items */ | ||||
|       menupopup > #context-navigation, | ||||
|       menupopup > #context-sep-navigation { display: none !important; } | ||||
| 
 | ||||
|   /* ===== General UI Modifications ===== */ | ||||
|   /* Hide status panel */ | ||||
|   #statuspanel { display: none !important; } | ||||
|       /* Hide various toolbar buttons */ | ||||
|       #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; } | ||||
| 
 | ||||
|   /* Remove border radius from menus */ | ||||
|   menupopup, panel { --panel-border-radius: 0px !important; } | ||||
|   menu, menuitem, menucaption { border-radius: 0px !important; } | ||||
|       /* Hide customizable UI springs */ | ||||
|       #customizableui-special-spring1, | ||||
|       #customizableui-special-spring2 { display: none; } | ||||
| 
 | ||||
|   /* Hide navigation context menu items */ | ||||
|   menupopup > #context-navigation, | ||||
|   menupopup > #context-sep-navigation { display: none !important; } | ||||
|       /* Hide Personal Toolbar */ | ||||
|       #PersonalToolbar { display: none !important; } | ||||
| 
 | ||||
|   /* Hide various toolbar buttons */ | ||||
|   #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; } | ||||
|       /* ===== URL Bar Styling ===== */ | ||||
| 
 | ||||
|   /* Hide customizable UI springs */ | ||||
|   #customizableui-special-spring1, | ||||
|   #customizableui-special-spring2 { display: none; } | ||||
|       #urlbar-container { | ||||
|         margin-left: 0 !important; | ||||
|         margin-right: 0 !important; | ||||
|         padding-top: 0 !important; | ||||
|         padding-bottom: 0!important; | ||||
|       } | ||||
| 
 | ||||
|   /* Hide Personal Toolbar */ | ||||
|   #PersonalToolbar { display: none !important; } | ||||
|       #urlbar-background { | ||||
|         border: solid 1px !important; | ||||
|         border-radius: 0 !important; | ||||
|         outline: none !important; | ||||
|         background: #${crust} !important; | ||||
|       } | ||||
| 
 | ||||
|   /* ===== URL Bar Styling ===== */ | ||||
|   /* Style input box */ | ||||
|   moz-input-box { | ||||
|     background: var(--base01) !important; | ||||
|     color: var(--base07) !important; | ||||
|     border: solid 1px var(--base05) !important; | ||||
|   } | ||||
|       #navigator-toolbox { | ||||
|         border: none !important; | ||||
|         border-bottom: solid 1px !important;\ | ||||
|       } | ||||
| 
 | ||||
|   /* Style input box */ | ||||
|   #urlbar-input-container { | ||||
|     background: var(--base08) !important; | ||||
|     color: var(--base07) !important; | ||||
|     border: none !important; | ||||
|     border-radius: 5 !important; | ||||
|   } | ||||
|       /* Hide URL bar go button */ | ||||
|       .urlbar-go-button { display: none !important; } | ||||
| 
 | ||||
|   /* Hide URL bar go button */ | ||||
|   .urlbar-go-button { display: none !important; } | ||||
|       /* Remove navigation bar background */ | ||||
|       #nav-bar.browser-toolbar { background: none !important; } | ||||
| 
 | ||||
|   /* Remove navigation bar background */ | ||||
|   #nav-bar.browser-toolbar { background: none !important; } | ||||
|       /* Position and style navigation bar */ | ||||
| 
 | ||||
|   /* Position and style navigation bar */ | ||||
|   #nav-bar { | ||||
|     opacity: 0; | ||||
|     text-align: center; | ||||
|     position: fixed !important; | ||||
|     border: solid 1px var(--nix-fg1) !important; | ||||
|     top: 30px; | ||||
|     left: 25%; | ||||
|     right: 25%; | ||||
|     z-index: 1; | ||||
|   } | ||||
|       #nav-bar { | ||||
|         text-align: center; | ||||
|         min-height: 0 !important; | ||||
|         max-height: 0 !important; | ||||
|         height: 0 !important; | ||||
|       } | ||||
| 
 | ||||
|   /* Expand navigation bar on focus */ | ||||
|   #nav-bar:focus-within { | ||||
|     opacity: 1; | ||||
|     max-height: 40px !important; | ||||
|     height: 60px !important; | ||||
|     min-height: 15px !important; | ||||
|   } | ||||
|     /* Expand navigation bar on focus */ | ||||
|       #nav-bar:focus-within { | ||||
|         max-height: 40px !important; | ||||
|         height: 60px !important; | ||||
|         min-height: 15px !important; | ||||
|       } | ||||
| 
 | ||||
|   /* ===== Tab Bar Styling ===== */ | ||||
|   /* Hide title bar buttons and spacer */ | ||||
|   .titlebar-close, | ||||
|   .titlebar-spacer { display: none !important; } | ||||
|       /* ===== Tab Bar Styling ===== */ | ||||
|       /* Hide title bar buttons and spacer */ | ||||
|       .titlebar-close, | ||||
|       .titlebar-spacer { display: none !important; } | ||||
| 
 | ||||
|   /* Remove tab margin */ | ||||
|   #titlebar { | ||||
|     --proton-tab-block-margin: 0px !important; | ||||
|     --tab-block-margin: 0px !important; | ||||
|   } | ||||
|       /* Remove tab margin */ | ||||
|       #titlebar { | ||||
|         --proton-tab-block-margin: 0px !important; | ||||
|         --tab-block-margin: 0px !important; | ||||
|       } | ||||
| 
 | ||||
|   /* Remove tab shadows */ | ||||
|   #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { | ||||
|     box-shadow: none !important; | ||||
|   } | ||||
|       /* Remove tab shadows */ | ||||
|       #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { | ||||
|         box-shadow: none !important; | ||||
|       } | ||||
| 
 | ||||
|   /* Hide tab-related buttons */ | ||||
|   #alltabs-button, | ||||
|   #tabs-newtab-button, | ||||
|   #firefox-view-button, | ||||
|   #new-tab-button, | ||||
|   .tab-close-button { display: none !important; } | ||||
|       /* Hide tab-related buttons */ | ||||
|       #alltabs-button, | ||||
|       #tabs-newtab-button, | ||||
|       #firefox-view-button, | ||||
|       #new-tab-button, | ||||
|       .tab-close-button { display: none !important; } | ||||
| 
 | ||||
|   /* Style tabs */ | ||||
|   tab { | ||||
|     font-family: var(--font-mono); | ||||
|     font-weight: bold; | ||||
|   } | ||||
|       /* Style tabs */ | ||||
|       tab { | ||||
|         font-family: var(--font-mono); | ||||
|         font-weight: bold; | ||||
|       } | ||||
| 
 | ||||
|   /* Set tab and tab bar height */ | ||||
|   #TabsToolbar, .tabbrowser-tab { | ||||
|     max-height: 35px !important; | ||||
|     background: var(--base00) !important; | ||||
|     padding-bottom:0 !important; | ||||
|     border: none; | ||||
|   } | ||||
|       /* Set tab and tab bar height */ | ||||
|       #TabsToolbar, .tabbrowser-tab { | ||||
|         max-height: 35px !important; | ||||
|         background: #${crust} !important; | ||||
|         border: none; | ||||
|       } | ||||
| 
 | ||||
|   /* Center tabs when not overflowing */ | ||||
|   #tabbrowser-arrowscrollbox:not([overflowing]) { | ||||
|     --uc-flex-justify: center; | ||||
|   } | ||||
|       /* Center tabs when not overflowing */ | ||||
|       #tabbrowser-arrowscrollbox:not([overflowing]) { | ||||
|         --uc-flex-justify: center; | ||||
|       } | ||||
| 
 | ||||
|   scrollbox[orient="horizontal"] { | ||||
|     justify-content: var(--uc-flex-justify, initial); | ||||
|   } | ||||
|       scrollbox[orient="horizontal"] { | ||||
|         justify-content: var(--uc-flex-justify, initial); | ||||
|       } | ||||
| 
 | ||||
|   /* Style selected tabs */ | ||||
|   #tabbrowser-tabs .tabbrowser-tab[selected] .tab-content { | ||||
|     border: solid 1px var(--base05) !important; | ||||
|     color: var(--base07); | ||||
|     background: var(--base02) | ||||
|   } | ||||
|       /* Style selected tabs */ | ||||
|       #tabbrowser-tabs .tabbrowser-tab[selected] .tab-content { | ||||
|         border: solid 1px var(--base05) !important; | ||||
|         color: var(--base07); | ||||
|         background: var(--base02) | ||||
|       } | ||||
| 
 | ||||
|   /* Style non-selected tabs */ | ||||
|   tab:not([selected="true"]) { | ||||
|     /* border: solid 1px var(--base05) !important; */ | ||||
|     background: var(--base01) !important; | ||||
|   } | ||||
| '' | ||||
|       /* Style non-selected tabs */ | ||||
|       tab:not([selected="true"]) { | ||||
|         /* border: solid 1px var(--base05) !important; */ | ||||
|         background: var(--base01) !important; | ||||
|       } | ||||
|   '' | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue