Change window control placeholders to use ::before and ::after
This commit is contained in:
		
							parent
							
								
									dc72d829da
								
							
						
					
					
						commit
						53ea91d2e8
					
				
					 4 changed files with 30 additions and 15 deletions
				
			
		| 
						 | 
				
			
			@ -4,22 +4,26 @@
 | 
			
		|||
/* This file should preferably be imported before other stylesheets */
 | 
			
		||||
 | 
			
		||||
/* Defaults for window controls on RIGHT side of the window */
 | 
			
		||||
/* Modify these values to match your preferences */
 | 
			
		||||
:root{
 | 
			
		||||
  --uc-window-control-width: 138px;
 | 
			
		||||
  --uc-window-drag-space-width: 24px;
 | 
			
		||||
  --uc-window-control-width: 138px; /* Space reserved for window controls */
 | 
			
		||||
  --uc-window-drag-space-width: 24px; /* Extra space reserved on both sides of the nav-bar to be able to drag the window */
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
 | 
			
		||||
  padding-right: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px));
 | 
			
		||||
  padding-left: var(--uc-window-drag-space-width);
 | 
			
		||||
#nav-bar::before,
 | 
			
		||||
#nav-bar::after{
 | 
			
		||||
  content: "";
 | 
			
		||||
  display: -moz-box;
 | 
			
		||||
  width: var(--uc-window-drag-space-width);
 | 
			
		||||
}
 | 
			
		||||
toolbar#nav-bar::after{ width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px)) }
 | 
			
		||||
 | 
			
		||||
/* Use this pref to check Mac OS where window controls are on left */
 | 
			
		||||
/* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */
 | 
			
		||||
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
 | 
			
		||||
	:root{ --uc-window-control-width: 72px; }
 | 
			
		||||
  :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
 | 
			
		||||
  padding-left: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px));
 | 
			
		||||
  padding-right: var(--uc-window-drag-space-width);
 | 
			
		||||
  :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar::before{
 | 
			
		||||
    width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px))
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
  :root[tabsintitlebar="true"]:not([inFullscreen]) toolbar#nav-bar::after{ width: var(--uc-window-drag-space-width); }
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue