mirror of
				https://github.com/superseriousbusiness/gotosocial.git
				synced 2025-10-30 23:32:25 -05:00 
			
		
		
		
	[chore] Webkit frontend fixes (#1492)
* fix webkit profile preview layout * general page layout
This commit is contained in:
		
					parent
					
						
							
								6c6f042290
							
						
					
				
			
			
				commit
				
					
						700ed7769f
					
				
			
		
					 3 changed files with 19 additions and 25 deletions
				
			
		|  | @ -47,7 +47,6 @@ html, body { | ||||||
| 
 | 
 | ||||||
| body { | body { | ||||||
| 	line-height: 1.5em; | 	line-height: 1.5em; | ||||||
| 	min-height: 100vh; |  | ||||||
| 	position: relative; | 	position: relative; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
|  | @ -56,11 +55,8 @@ body { | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| .page { | .page { | ||||||
| 	position: absolute; |  | ||||||
| 	display: grid; | 	display: grid; | ||||||
| 	min-height: 100%; | 	min-height: 100vh; | ||||||
| 	min-width: 100%; |  | ||||||
| 	width: 100%; |  | ||||||
| 
 | 
 | ||||||
| 	grid-template-columns: auto minmax(auto, 50rem) auto; | 	grid-template-columns: auto minmax(auto, 50rem) auto; | ||||||
| 	grid-template-columns: auto min(92%, 50rem) auto; | 	grid-template-columns: auto min(92%, 50rem) auto; | ||||||
|  |  | ||||||
|  | @ -30,7 +30,6 @@ main { | ||||||
| .profile { | .profile { | ||||||
| 	background: $bg-accent; | 	background: $bg-accent; | ||||||
| 	display: grid; | 	display: grid; | ||||||
| 	grid-template-rows: auto auto auto; |  | ||||||
| 	grid-template-columns: 100%; | 	grid-template-columns: 100%; | ||||||
| 	gap: 0.5rem; | 	gap: 0.5rem; | ||||||
| 	margin-bottom: 0.2rem; | 	margin-bottom: 0.2rem; | ||||||
|  |  | ||||||
|  | @ -35,9 +35,9 @@ section { | ||||||
| 
 | 
 | ||||||
| #root { | #root { | ||||||
| 	display: grid; | 	display: grid; | ||||||
| 	grid-template-columns: 1fr 90ch 1fr; | 	/* keep in sync with base.css .page {} */ | ||||||
| 	width: 100vw; | 	grid-template-columns: auto minmax(auto, 50rem) auto; | ||||||
| 	max-width: 100vw; | 	grid-template-columns: auto min(92%, 50rem) auto; | ||||||
| 	box-sizing: border-box; | 	box-sizing: border-box; | ||||||
| 
 | 
 | ||||||
| 	section.with-sidebar { | 	section.with-sidebar { | ||||||
|  | @ -319,22 +319,25 @@ section.with-sidebar > div, section.with-sidebar > form { | ||||||
| 		display: grid; | 		display: grid; | ||||||
| 		grid-template-columns: 70% 30%; | 		grid-template-columns: 70% 30%; | ||||||
| 		grid-template-rows: 100%; | 		grid-template-rows: 100%; | ||||||
|  | 		gap: 1rem; | ||||||
|  | 
 | ||||||
|  | 		.profile { | ||||||
|  | 			.basic { | ||||||
|  | 				margin-bottom: 0.5rem; | ||||||
|  | 				/* margin-top: 0; */ | ||||||
|  | 			} | ||||||
|  | 		} | ||||||
| 
 | 
 | ||||||
| 		.files { | 		.files { | ||||||
| 			width: 100%; | 			width: 100%; | ||||||
| 			margin: 1rem; |  | ||||||
| 			margin-right: 0; |  | ||||||
| 			display: flex; | 			display: flex; | ||||||
| 			flex-direction: column; | 			flex-direction: column; | ||||||
| 			justify-content: center; | 			justify-content: center; | ||||||
|  | 			gap: 1rem; | ||||||
| 
 | 
 | ||||||
| 			h3 { | 			h3 { | ||||||
| 				margin-top: 0; | 				margin: 0; | ||||||
| 				margin-bottom: 0.5rem; | 				margin-bottom: 0.3rem; | ||||||
| 			} |  | ||||||
| 
 |  | ||||||
| 			div:first-child { |  | ||||||
| 				margin-bottom: 1rem; |  | ||||||
| 			} | 			} | ||||||
| 
 | 
 | ||||||
| 			span { | 			span { | ||||||
|  | @ -456,7 +459,8 @@ span.form-info { | ||||||
| 	} | 	} | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| @media screen and (max-width: 100ch) { | @media screen and (max-width: 60rem) { | ||||||
|  | 	/* vertical layout */ | ||||||
| 	#root { | 	#root { | ||||||
| 		padding: 1rem; | 		padding: 1rem; | ||||||
| 		grid-template-columns: 100%; | 		grid-template-columns: 100%; | ||||||
|  | @ -484,13 +488,8 @@ span.form-info { | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
| 	.user-profile .overview { | 	.user-profile .overview { | ||||||
| 		grid-template-columns: 100%; | 		grid-template-columns: auto; | ||||||
| 		grid-template-rows: auto auto; | 		grid-template-rows: auto 1fr; | ||||||
| 
 |  | ||||||
| 		.files { |  | ||||||
| 			margin: 0; |  | ||||||
| 			margin-top: 1rem; |  | ||||||
| 		} |  | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
| 	main section { | 	main section { | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue