mirror of
				https://github.com/go-gitea/gitea
				synced 2025-10-31 19:38:23 +00:00 
			
		
		
		
	Use flex-container for dashboard layout (#30214)
				
					
				
			Added new class `flex-container-sidebar` to cover the dashboard sidebar. Previously this was 37.5% with more padding. Now there is less empty space between the two columns and this matches other pages like repo or admin settings page. Desktop: <img width="1345" alt="Screenshot 2024-03-31 at 15 11 36" src="https://github.com/go-gitea/gitea/assets/115237/717389d9-d42c-466e-a8fe-e968f79447fd"> Mobile: <img width="444" alt="Screenshot 2024-03-31 at 15 11 44" src="https://github.com/go-gitea/gitea/assets/115237/7faa840b-513a-411b-bf2d-26d52b9b71a0"> --------- Co-authored-by: Giteabot <teabot@gitea.io>
This commit is contained in:
		| @@ -6,10 +6,16 @@ | ||||
|   margin-top: var(--page-spacing); | ||||
| } | ||||
|  | ||||
| /* small options menu on the left, used in settings/admin pages */ | ||||
| .flex-container-nav { | ||||
|   width: 240px; | ||||
| } | ||||
|  | ||||
| /* wide sidebar on the right, used in frontpage */ | ||||
| .flex-container-sidebar { | ||||
|   width: 35%; | ||||
| } | ||||
|  | ||||
| .flex-container-main { | ||||
|   flex: 1; | ||||
|   min-width: 0; /* make the "text truncate" work, otherwise the flex axis is not limited and the text just overflows */ | ||||
| @@ -19,7 +25,9 @@ | ||||
|   .flex-container { | ||||
|     flex-direction: column; | ||||
|   } | ||||
|   .flex-container-nav { | ||||
|   .flex-container-nav, | ||||
|   .flex-container-sidebar { | ||||
|     order: -1; | ||||
|     width: auto; | ||||
|   } | ||||
| } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user