Add theme files and some compatbility rules
This commit is contained in:
		
							parent
							
								
									0de6ebaa9a
								
							
						
					
					
						commit
						a19e10aeda
					
				
					 7 changed files with 157 additions and 22 deletions
				
			
		| 
						 | 
				
			
			@ -21,6 +21,7 @@
 | 
			
		|||
  opacity: 1 !important;
 | 
			
		||||
  background-color: var(--lwt-toolbar-field-background-color, hsla(0,0%,100%,.8));
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#nav-bar-customization-target > .chromeclass-toolbar-additional[overflows="false"] .toolbarbutton-icon{
 | 
			
		||||
  border: none !important;
 | 
			
		||||
  border-radius: 0 !important;
 | 
			
		||||
| 
						 | 
				
			
			@ -30,8 +31,15 @@
 | 
			
		|||
  width: initial !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#back-button{ --backbutton-background: transparent }
 | 
			
		||||
 | 
			
		||||
#nav-bar-customization-target > .chromeclass-toolbar-additional[overflows="false"]:hover .toolbarbutton-icon{
 | 
			
		||||
  background-color: transparent !important;
 | 
			
		||||
  box-shadow: none !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#nav-bar-customization-target > .chromeclass-toolbar-additional[overflows="false"]:not([disabled]):hover{
 | 
			
		||||
  background-color: hsla(0,0%,70%,.35);
 | 
			
		||||
  background-image: linear-gradient(to bottom, var(--uc-active-color,hsla(0,0%,70%,.2)), var(--uc-active-color,hsla(0,0%,70%,.2)))
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#urlbar-container:focus-within ~ .chromeclass-toolbar-additional[overflows="false"]{
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -3,9 +3,10 @@
 | 
			
		|||
  opacity: 0;
 | 
			
		||||
  transition: margin-inline-end 200ms linear, opacity 200ms linear;
 | 
			
		||||
}
 | 
			
		||||
:root[uidensity="compact"] #page-action-buttons > *[class^=urlbar-icon]{ margin-inline-end: -22px; }
 | 
			
		||||
#page-action-buttons:hover > *[class^=urlbar-icon],
 | 
			
		||||
#page-action-buttons > *[class^=urlbar-icon][open],
 | 
			
		||||
#page-action-buttons > *[class^=urlbar-icon][open] ~ *[class^=urlbar-icon]{
 | 
			
		||||
  opacity: 1;
 | 
			
		||||
  margin-inline-end: 0px;
 | 
			
		||||
  margin-inline-end: 0px !important;
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			@ -6,9 +6,8 @@
 | 
			
		|||
  content: "";
 | 
			
		||||
  width: 100%;
 | 
			
		||||
  height: 100%;
 | 
			
		||||
  display: none;
 | 
			
		||||
  pointer-events:none;
 | 
			
		||||
  background: -moz-element(#statuspanel) 0 -11px no-repeat !important;
 | 
			
		||||
  background: -moz-element(#statuspanel) left calc(90% - var(--toolbarbutton-outer-padding)) no-repeat !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#urlbar .urlbar-input-box::after{
 | 
			
		||||
| 
						 | 
				
			
			@ -16,14 +15,6 @@
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
#statuspanel{ z-index: -1; }
 | 
			
		||||
/* Don't show common values to save space (useful for oneliner) - safe to delete these */
 | 
			
		||||
#statuspanel-label[value^="http"]{ margin-left: -5.8ch !important; }
 | 
			
		||||
#statuspanel-label[value^="https"]{ margin-left: -6.6ch !important; }
 | 
			
		||||
#statuspanel-label[value^="www"]{ margin-left: -5.3ch !important; }
 | 
			
		||||
#statuspanel-label[value^="http://www"]{ margin-left: -10.6ch !important; }
 | 
			
		||||
#statuspanel-label[value^="https://www"]{ margin-left: -11.3ch !important; } 
 | 
			
		||||
 | 
			
		||||
.searchbar-textbox{ margin: 2px 0 !important; }
 | 
			
		||||
 | 
			
		||||
#statuspanel-inner > #statuspanel-label{
 | 
			
		||||
  height:23px;
 | 
			
		||||
| 
						 | 
				
			
			@ -31,6 +22,17 @@
 | 
			
		|||
  background-color: var(--lwt-toolbar-field-background-color, hsla(0,0%,100%,.8)) !important;
 | 
			
		||||
  border: none !important;
 | 
			
		||||
  color: var(--lwt-toolbar-field-color, black) !important;
 | 
			
		||||
  font-weight: bold !important;
 | 
			
		||||
  margin-left: -3px
 | 
			
		||||
}
 | 
			
		||||
  font-size: larger;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/* Don't show common values to save space (useful for oneliner) - safe to delete these */
 | 
			
		||||
/* If you change the font size of the label then you'll have to modify these too */
 | 
			
		||||
/* non-https links get a slight red hue */
 | 
			
		||||
 | 
			
		||||
#statuspanel-inner > #statuspanel-label{ margin-left: -3px !important; color: lightpink !important;}
 | 
			
		||||
#statuspanel-inner > #statuspanel-label[value^="http"]{ margin-left: -3.7ch !important; }
 | 
			
		||||
#statuspanel-inner > #statuspanel-label[value^="https"]{ margin-left: -6.1ch !important; color: var(--lwt-toolbar-field-color, black) !important}
 | 
			
		||||
#statuspanel-inner > #statuspanel-label[value^="www"]{ margin-left: -4.5ch !important; }
 | 
			
		||||
#statuspanel-inner > #statuspanel-label[value^="http://www"]{ margin-left: -9.7ch !important; }
 | 
			
		||||
#statuspanel-inner > #statuspanel-label[value^="https://www"]{ margin-left: -10.1ch !important; } 
 | 
			
		||||
#statuspanel-inner{ margin-left: -1px; }
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
							
								
								
									
										13
									
								
								chrome/theme_color_variables.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										13
									
								
								chrome/theme_color_variables.css
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,13 @@
 | 
			
		|||
/* Color controls for theme_***.css files */
 | 
			
		||||
:root{
 | 
			
		||||
  --uc-dark-bkgnd-color: rgb(12,16,32);
 | 
			
		||||
  --uc-light-bkgnd-color: rgb(46,54,69);
 | 
			
		||||
  --uc-active-color: rgb(26, 70, 102);
 | 
			
		||||
  --uc-text-color: rgb(195, 198, 201);
 | 
			
		||||
  --uc-border-color: rgb(43,130,191);
 | 
			
		||||
}
 | 
			
		||||
/* Override some default variables - stylesheet compatibility */
 | 
			
		||||
:root{
 | 
			
		||||
  --lwt-toolbar-field-background-color: var(--uc-dark-bkgnd-color) !important;
 | 
			
		||||
  --lwt-toolbar-field-border-color: transparent !important;)
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			@ -1,11 +1,6 @@
 | 
			
		|||
/*!!! IMPORT theme_color_variables.css !!!*/
 | 
			
		||||
/* Makes popups, menus and context menus dark */
 | 
			
		||||
:root{
 | 
			
		||||
  --uc-dark-bkgnd-color: rgb(12,16,32);
 | 
			
		||||
  --uc-light-bkgnd-color: rgb(46,54,69);
 | 
			
		||||
  --uc-active-color: rgb(26, 70, 102);
 | 
			
		||||
  --uc-text-color: rgb(195, 198, 201);
 | 
			
		||||
  --uc-border-color: rgb(43,130,191);
 | 
			
		||||
}
 | 
			
		||||
@import url(theme_color_variables.css);
 | 
			
		||||
 | 
			
		||||
.panel-arrowcontent,
 | 
			
		||||
#alltabs-popup .arrowscrollbox-scrollbox,
 | 
			
		||||
							
								
								
									
										37
									
								
								chrome/theme_sidebar.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										37
									
								
								chrome/theme_sidebar.css
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,37 @@
 | 
			
		|||
/*!!! IMPORT theme_color_variables.css !!!*/
 | 
			
		||||
@import url(theme_color_variables.css);
 | 
			
		||||
#sidebar-search-container #search-box{
 | 
			
		||||
	-moz-appearance:none !important;
 | 
			
		||||
	background-color: var(--uc-dark-bkgnd-color) !important;
 | 
			
		||||
	border: none !important;
 | 
			
		||||
	color: var(--uc-text-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#history-panel,
 | 
			
		||||
#bookmarksPanel,
 | 
			
		||||
#sidebar-header{
 | 
			
		||||
	background-color: var(--uc-light-bkgnd-color) !important;
 | 
			
		||||
	color: var(--uc-text-color) !important;
 | 
			
		||||
	border-top: none !important;
 | 
			
		||||
	border-bottom:none !important;
 | 
			
		||||
  scrollbar-color: rgb(210,210,210) var(--uc-light-bkgnd-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.sidebar-placesTreechildren,
 | 
			
		||||
#sidebar-header{
 | 
			
		||||
	color: var(--uc-text-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.sidebar-placesTreechildren::-moz-tree-cell{
 | 
			
		||||
	outline:none;
 | 
			
		||||
	border-radius:0px;
 | 
			
		||||
	background-image:none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.sidebar-placesTreechildren::-moz-tree-cell(selected){
 | 
			
		||||
	background-color: var(--uc-border-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.sidebar-placesTreechildren::-moz-tree-cell(hover){
 | 
			
		||||
	background-color: var(--uc-active-color) !important;
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										79
									
								
								chrome/theme_toolbars.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										79
									
								
								chrome/theme_toolbars.css
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,79 @@
 | 
			
		|||
/*!!! IMPORT theme_color_variables.css !!!*/
 | 
			
		||||
@import url(theme_color_variables.css);
 | 
			
		||||
#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar),
 | 
			
		||||
#browser-bottombox,
 | 
			
		||||
.browserContainer > findbar,
 | 
			
		||||
.searchbar-textbox{
 | 
			
		||||
	background-color: var(--uc-light-bkgnd-color) !important;
 | 
			
		||||
	color: var(--uc-text-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.browserContainer > findbar{ background-image: none !important; }
 | 
			
		||||
 | 
			
		||||
#TabsToolbar,
 | 
			
		||||
.searchbar-textbox,
 | 
			
		||||
.findbar-textbox,
 | 
			
		||||
.findbar-find-previous,
 | 
			
		||||
.findbar-find-next,
 | 
			
		||||
#urlbar{
 | 
			
		||||
	background-color: var(--uc-dark-bkgnd-color) !important;
 | 
			
		||||
  color: var(--uc-text-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#urlbar{ border-color: transparent !important; }
 | 
			
		||||
 | 
			
		||||
#urlbar[focused]{
 | 
			
		||||
	border-color: var(--uc-border-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#urlbar .urlbar-icon:hover{
 | 
			
		||||
  box-shadow: none !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#tabbrowser-tabs,
 | 
			
		||||
.search-panel-input-value,
 | 
			
		||||
.titlebar-buttonbox-container,
 | 
			
		||||
.tab-close-button{
 | 
			
		||||
  color: var(--uc-text-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.toolbarbutton-icon, toolbarbutton stack{ border-radius: 0px !important; }
 | 
			
		||||
:root:not([uidensity="compact"]) #back-button > .toolbarbutton-icon{ border-radius: 10000px !important; }
 | 
			
		||||
 | 
			
		||||
toolbar toolbarbutton:not([disabled]):hover > .toolbarbutton-icon,
 | 
			
		||||
toolbar toolbarbutton:not([disabled]):hover > stack,
 | 
			
		||||
toolbar toolbarbutton[open="true"] > .toolbarbutton-icon,
 | 
			
		||||
toolbar toolbarbutton[open="true"] > stack,
 | 
			
		||||
toolbar toolbarbutton[checked="true"] > .toolbarbutton-icon,
 | 
			
		||||
toolbar toolbarbutton[checked="true"] > stack,
 | 
			
		||||
toolbar .bookmark-item:hover,
 | 
			
		||||
#page-action-buttons image:hover,
 | 
			
		||||
.urlbar-icon:hover,
 | 
			
		||||
#TabsToolbar .scrollbutton-down:hover,
 | 
			
		||||
#TabsToolbar .scrollbutton-up:hover,
 | 
			
		||||
findbar toolbarbutton:not([disabled]):hover,
 | 
			
		||||
findbar toolbarbutton[checked="true"]{
 | 
			
		||||
  background-color: var(--uc-active-color) !important;
 | 
			
		||||
  box-shadow: inset 0 0 0 1px var(--uc-border-color) !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/* Override some special cases */
 | 
			
		||||
#TabsToolbar .scrollbutton-down > .toolbarbutton-icon,
 | 
			
		||||
#TabsToolbar .scrollbutton-up > .toolbarbutton-icon,
 | 
			
		||||
#downloads-indicator-anchor,
 | 
			
		||||
#PersonalToolbar .bookmark-item > .toolbarbutton-icon,
 | 
			
		||||
#titlebar .titlebar-button > .toolbarbutton-icon{
 | 
			
		||||
  background-color: transparent !important;
 | 
			
		||||
  box-shadow: none !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.toolbarbutton-1{ fill: var(--uc-text-color) !important; }
 | 
			
		||||
 | 
			
		||||
.tab-line[selected]{ height: 1px !important; }
 | 
			
		||||
 | 
			
		||||
.tabbrowser-tab[selected] .tab-background{
 | 
			
		||||
  background-image: linear-gradient(var(--uc-active-color) 75%,var(--uc-light-bkgnd-color)) !important;
 | 
			
		||||
  box-shadow:0 3px 1px -1px white inset,  
 | 
			
		||||
      0 10px 4px -5px var(--uc-border-color) inset,
 | 
			
		||||
               0 -2px 0 rgba(0,0,0,.06) inset !important;
 | 
			
		||||
}
 | 
			
		||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue