diff options
| author | Giteabot <teabot@gitea.io> | 2023-03-17 09:01:47 -0400 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-03-17 21:01:47 +0800 |
| commit | cab704477251d0940d91462e4f93e4563532c9f3 (patch) | |
| tree | b71365999637a8343b90c9505413e9f22dc7bd65 /web_src | |
| parent | 68c9f1abd80b3e7f60ffc43d3a102ec2a7692d1f (diff) | |
| download | gitea-cab704477251d0940d91462e4f93e4563532c9f3.tar.gz gitea-cab704477251d0940d91462e4f93e4563532c9f3.zip | |
Increase horizontal page padding (#23507) (#23537)
Backport #23507 by @silverwind
Add a bit more empty space on left and right side of page content for a
more pleasant viewing experience. Also tweaked the mobile navbar to
match.
Before:
<img width="1276" alt="Screenshot 2023-03-16 at 00 58 23"
src="https://user-images.githubusercontent.com/115237/225473942-f544106f-1b61-456a-99fb-3ba136cabc8d.png">
After:
<img width="1270" alt="Screenshot 2023-03-16 at 00 58 37"
src="https://user-images.githubusercontent.com/115237/225473959-8b555359-a08d-48e1-9476-2710aabb1166.png">
Mobile Navbar:
<img width="673" alt="Screenshot 2023-03-16 at 01 05 12"
src="https://user-images.githubusercontent.com/115237/225473966-adccef2b-4d34-44ed-8c75-d4ca46d96cf3.png">
Co-authored-by: silverwind <me@silverwind.io>
Diffstat (limited to 'web_src')
| -rw-r--r-- | web_src/css/base.css | 13 |
1 files changed, 10 insertions, 3 deletions
diff --git a/web_src/css/base.css b/web_src/css/base.css index 2e6281391f..275cd1cce4 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -1231,7 +1231,7 @@ a.ui.card:hover, /* enable fluid page widths for medium size viewports */ @media (min-width: 768px) and (max-width: 1200px) { .ui.ui.ui.container:not(.fluid) { - width: calc(100vw - 3em); + width: calc(100vw - 64px); } } @@ -1285,7 +1285,14 @@ a.ui.card:hover, .following.bar #navbar { width: 100vw; min-height: 52px; - padding: 0 0.5rem; + padding: 0 16px; +} + +@media (max-width: 767px) { + .following.bar #navbar { + padding-left: 4px; + padding-right: 0; + } } .following.bar #navbar .brand { @@ -1491,7 +1498,7 @@ a.ui.card:hover, } .ui.container.fluid.padded { - padding: 0 10px; + padding: 0 32px; } .ui.form .ui.button { |