d8258482e2
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> (cherry picked from commit 044cc169e75dccbf1d846f8774ef2feccd0da1fd)
33 lines
703 B
CSS
33 lines
703 B
CSS
/* container for full-page content with sidebar on left */
|
|
|
|
.flex-container {
|
|
display: flex !important;
|
|
gap: var(--page-spacing);
|
|
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 */
|
|
}
|
|
|
|
@media (max-width: 767.98px) {
|
|
.flex-container {
|
|
flex-direction: column;
|
|
}
|
|
.flex-container-nav,
|
|
.flex-container-sidebar {
|
|
order: -1;
|
|
width: auto;
|
|
}
|
|
}
|