mirror of
				https://github.com/searxng/searxng
				synced 2024-01-01 19:24:07 +01:00 
			
		
		
		
	[theme] optimize switching between different device types
This commit is contained in:
		
							parent
							
								
									385dce213b
								
							
						
					
					
						commit
						859179f0c9
					
				
					 3 changed files with 20 additions and 24 deletions
				
			
		|  | @ -31,10 +31,10 @@ | |||
| 
 | ||||
| @color-url-font: #29314d; | ||||
| @color-url-visited-font: #684898; | ||||
| @results-width: 40em; | ||||
| @results-offset: 8rem; | ||||
| @results-width: 35em; | ||||
| @results-offset: 10rem; | ||||
| @results-tablet-offset: 0.5rem; | ||||
| @results-gap: 4em; | ||||
| @results-gap: 6em; | ||||
| @search-width: 40em; | ||||
| 
 | ||||
| // | ||||
|  |  | |||
|  | @ -104,7 +104,7 @@ | |||
|   vertical-align: middle; | ||||
| } | ||||
| 
 | ||||
| @media screen and (max-width: 1250px) { | ||||
| @media screen and (max-width: 80em) { | ||||
|   #search { | ||||
|     padding: 0 @results-tablet-offset; | ||||
|   } | ||||
|  | @ -146,7 +146,7 @@ | |||
|   } | ||||
| } | ||||
| 
 | ||||
| @media screen and (max-width: @results-width) { | ||||
| @media screen and (max-width: 50em) { | ||||
|   #search { | ||||
|     width: 100%; | ||||
|     margin: 0; | ||||
|  |  | |||
|  | @ -598,7 +598,7 @@ article.result-images[data-vim-selected]::before { | |||
|   } | ||||
| } | ||||
| 
 | ||||
| @media screen and (max-width: 1250px) { | ||||
| @media screen and (max-width: 80em) { | ||||
|   #main_preferences, | ||||
|   #main_about, | ||||
|   #main_stats { | ||||
|  | @ -695,6 +695,20 @@ article.result-images[data-vim-selected]::before { | |||
|   #backToTop { | ||||
|     left: @results-width; | ||||
|   } | ||||
| 
 | ||||
|   #main_results div#results { | ||||
|     margin: 2rem @results-tablet-offset 0 @results-tablet-offset; | ||||
|     display: grid; | ||||
|     grid-template-columns: 50em; | ||||
|     grid-template-rows: min-content min-content min-content 1fr min-content min-content; | ||||
|     gap: 0; | ||||
|     grid-template-areas: | ||||
|       "answers" | ||||
|       "suggestions" | ||||
|       "sidebar" | ||||
|       "urls" | ||||
|       "pagination"; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| #main_results div#results.only_template_images { | ||||
|  | @ -721,29 +735,11 @@ article.result-images[data-vim-selected]::before { | |||
|   } | ||||
| } | ||||
| 
 | ||||
| @media screen and (max-width: 1250px) { | ||||
|   #main_results div#results { | ||||
|     margin: 2rem @results-tablet-offset 0 @results-tablet-offset; | ||||
|     display: grid; | ||||
|     grid-template-columns: 50em; | ||||
|     grid-template-rows: min-content min-content min-content 1fr min-content min-content; | ||||
|     gap: 0; | ||||
|     grid-template-areas: | ||||
|       "answers" | ||||
|       "suggestions" | ||||
|       "sidebar" | ||||
|       "urls" | ||||
|       "pagination"; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| @media screen and (max-width: 50em) { | ||||
|   #main_results div#results { | ||||
|     grid-template-columns: 100%; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| @media screen and (max-width: @results-width) { | ||||
|   article[data-vim-selected]::before { | ||||
|     display: none; | ||||
|     content: ""; | ||||
|  |  | |||
		Loading…
	
	Add table
		
		Reference in a new issue