forked from cybrespace/mastodon
		
	Don't load Roboto webfont when system font is used in the app (#4591)
* Don't load Roboto webfont when system font is used in the app * remove trailing whitespace
This commit is contained in:
		
							parent
							
								
									da172a8b1b
								
							
						
					
					
						commit
						f72ed21cd6
					
				
					 1 changed files with 10 additions and 2 deletions
				
			
		| 
						 | 
					@ -1,5 +1,4 @@
 | 
				
			||||||
body {
 | 
					body {
 | 
				
			||||||
  font-family: 'mastodon-font-sans-serif', sans-serif;
 | 
					 | 
				
			||||||
  background: $ui-base-color;
 | 
					  background: $ui-base-color;
 | 
				
			||||||
  background-size: cover;
 | 
					  background-size: cover;
 | 
				
			||||||
  background-attachment: fixed;
 | 
					  background-attachment: fixed;
 | 
				
			||||||
| 
						 | 
					@ -14,6 +13,11 @@ body {
 | 
				
			||||||
  -webkit-tap-highlight-color: rgba(0,0,0,0);
 | 
					  -webkit-tap-highlight-color: rgba(0,0,0,0);
 | 
				
			||||||
  -webkit-tap-highlight-color: transparent;
 | 
					  -webkit-tap-highlight-color: transparent;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  // This is done because we want to use mastodon-font-sans-serif (a.k.a Roboto) on the `.ui` element in the app UI
 | 
				
			||||||
 | 
					  &:not(.app-body) {
 | 
				
			||||||
 | 
					    font-family: 'mastodon-font-sans-serif', sans-serif;
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  &.app-body {
 | 
					  &.app-body {
 | 
				
			||||||
    position: fixed;
 | 
					    position: fixed;
 | 
				
			||||||
    width: 100%;
 | 
					    width: 100%;
 | 
				
			||||||
| 
						 | 
					@ -69,7 +73,7 @@ button {
 | 
				
			||||||
  justify-content: center;
 | 
					  justify-content: center;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.system-font {
 | 
					.ui.system-font {
 | 
				
			||||||
  // system-ui => standard property (Chrome/Android WebView 56+, Opera 43+, Safari 11+)
 | 
					  // system-ui => standard property (Chrome/Android WebView 56+, Opera 43+, Safari 11+)
 | 
				
			||||||
  // -apple-system => Safari <11 specific
 | 
					  // -apple-system => Safari <11 specific
 | 
				
			||||||
  // BlinkMacSystemFont => Chrome <56 on macOS specific
 | 
					  // BlinkMacSystemFont => Chrome <56 on macOS specific
 | 
				
			||||||
| 
						 | 
					@ -83,3 +87,7 @@ button {
 | 
				
			||||||
  // mastodon-font-sans-serif => web-font (Roboto) fallback and newer Androids (>=4.0)
 | 
					  // mastodon-font-sans-serif => web-font (Roboto) fallback and newer Androids (>=4.0)
 | 
				
			||||||
  font-family: system-ui, -apple-system,BlinkMacSystemFont, "Segoe UI","Oxygen", "Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",mastodon-font-sans-serif, sans-serif;
 | 
					  font-family: system-ui, -apple-system,BlinkMacSystemFont, "Segoe UI","Oxygen", "Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",mastodon-font-sans-serif, sans-serif;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.ui:not(.system-font) {
 | 
				
			||||||
 | 
					  font-family: 'mastodon-font-sans-serif', sans-serif;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		
		Reference in a new issue