From 165182a92d0657883e4ce28d63352b79a6416241 Mon Sep 17 00:00:00 2001 From: silverwind Date: Wed, 20 Mar 2024 12:21:18 +0100 Subject: [PATCH] Remove the negative margin from `.page-content` (#29922) The negative margin was suboptimal and presents a few unnecessary challenges while styling the page. Remove it and add custom margin values, which slightly changes the height a few things near the top of the page as well: 15px less height of explore and login navbar: Screenshot 2024-03-20 at 00 52 34 15px reduced padding-top height of "user bar" and equal 4px padding added: Screenshot 2024-03-20 at 00 52 50 3px less padding on top of repo: Screenshot 2024-03-20 at 00 53 49 (cherry picked from commit 8cad44f4109b6f87e565d43e137e99ab23b54349) --- templates/user/dashboard/navbar.tmpl | 2 +- web_src/css/base.css | 15 +++++---------- web_src/css/dashboard.css | 3 +-- web_src/css/repo/header.css | 1 + web_src/css/user.css | 4 ++++ 5 files changed, 12 insertions(+), 13 deletions(-) diff --git a/templates/user/dashboard/navbar.tmpl b/templates/user/dashboard/navbar.tmpl index 3e9442d6fc..480c39e8bf 100644 --- a/templates/user/dashboard/navbar.tmpl +++ b/templates/user/dashboard/navbar.tmpl @@ -105,4 +105,4 @@ {{end}} -
+
diff --git a/web_src/css/base.css b/web_src/css/base.css index b4f8be607b..ab20b64394 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -238,16 +238,6 @@ a.label, border-bottom-color: var(--color-secondary); } -.page-content { - margin-top: 15px; -} - -.page-content .header-wrapper, -.page-content overflow-menu { - margin-top: -15px !important; - padding-top: 15px !important; -} - /* fix Fomantic's line-height cutting off "g" on Windows Chrome with Segoe UI */ .ui.input > input { line-height: var(--line-height-default); @@ -689,6 +679,11 @@ img.ui.avatar, padding-bottom: 80px; } +.page-content.new:is(.repo,.migrate,.org), +.page-content.profile:is(.user,.organization) { + padding-top: 15px; +} + /* overwrite semantic width of containers inside the main page content div (div with class "page-content") */ .page-content .ui.ui.ui.container:not(.fluid) { width: 1280px; diff --git a/web_src/css/dashboard.css b/web_src/css/dashboard.css index 57ddb80bc6..6271a99c29 100644 --- a/web_src/css/dashboard.css +++ b/web_src/css/dashboard.css @@ -78,8 +78,7 @@ } .dashboard .dashboard-navbar { - padding-left: 0.5rem; - padding-right: 0.5rem; + padding: 4px 12px; } .dashboard .dashboard-navbar .right.menu { diff --git a/web_src/css/repo/header.css b/web_src/css/repo/header.css index a262b5b3e9..482608a1a6 100644 --- a/web_src/css/repo/header.css +++ b/web_src/css/repo/header.css @@ -71,6 +71,7 @@ } .repository .header-wrapper { + padding-top: 12px; background-color: var(--color-header-wrapper); } diff --git a/web_src/css/user.css b/web_src/css/user.css index 9157a53e7c..ece7d9b2cc 100644 --- a/web_src/css/user.css +++ b/web_src/css/user.css @@ -125,6 +125,10 @@ border: 1px solid var(--color-secondary); } +#notification_div { + padding-top: 15px; +} + #notification_table { background: var(--color-box-body); border: 1px solid var(--color-secondary);