From 78805736351ccf9556927c50098c58fbbb74b2f2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Sat, 9 May 2020 00:42:55 +0200 Subject: [PATCH 1/2] Make the admin menu fill the screen vertically On high-resolution screens where neither the menu nor the main content were filling the screen, there was a blank space at the bottom which looked weird. --- app/assets/stylesheets/admin.scss | 1 + app/assets/stylesheets/dashboard.scss | 4 ++++ app/assets/stylesheets/mixins.scss | 13 +++++++++++++ 3 files changed, 18 insertions(+) diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss index 8dc11daae..a5976750d 100644 --- a/app/assets/stylesheets/admin.scss +++ b/app/assets/stylesheets/admin.scss @@ -22,6 +22,7 @@ $sidebar-hover: #25597c; $sidebar-active: #f4fcd0; .admin { + @include admin-layout; h2 { font-weight: 100; diff --git a/app/assets/stylesheets/dashboard.scss b/app/assets/stylesheets/dashboard.scss index cfa1985b4..30f59e6bb 100644 --- a/app/assets/stylesheets/dashboard.scss +++ b/app/assets/stylesheets/dashboard.scss @@ -16,6 +16,10 @@ // 01. Dashboard global // -------------------- +.proposal-dashboard { + @include admin-layout; +} + .proposal-title { display: inline-block; diff --git a/app/assets/stylesheets/mixins.scss b/app/assets/stylesheets/mixins.scss index faef06d3f..669ff6db9 100644 --- a/app/assets/stylesheets/mixins.scss +++ b/app/assets/stylesheets/mixins.scss @@ -3,6 +3,7 @@ // 01. Logo // 02. Orbit bullets // 03. Direct uploads +// 04. Admin layout // ------------------ // 01. Logo @@ -126,6 +127,18 @@ } } +// 04. Admin layout +// ---------------- + +@mixin admin-layout { + display: flex; + flex-direction: column; + + > .menu-and-content { + flex: 1; + } +} + @mixin has-fa-icon($icon, $style) { @extend .fa-#{$icon}; From c362e1190f79ba143949799897c327e71d0bfc3f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Sat, 9 May 2020 00:47:55 +0200 Subject: [PATCH 2/2] Simplify main admin header margin rules Instead of having a header with a bottom margin followed by an element with a negative margin, it makes more sense to have no margin on either element. --- app/assets/stylesheets/mixins.scss | 4 ++++ app/views/layouts/admin.html.erb | 2 +- app/views/layouts/dashboard.html.erb | 2 +- app/views/layouts/management.html.erb | 2 +- 4 files changed, 7 insertions(+), 3 deletions(-) diff --git a/app/assets/stylesheets/mixins.scss b/app/assets/stylesheets/mixins.scss index 669ff6db9..db2678c55 100644 --- a/app/assets/stylesheets/mixins.scss +++ b/app/assets/stylesheets/mixins.scss @@ -134,6 +134,10 @@ display: flex; flex-direction: column; + > header { + margin-bottom: 0; + } + > .menu-and-content { flex: 1; } diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb index d25288dc2..32dd1c045 100644 --- a/app/views/layouts/admin.html.erb +++ b/app/views/layouts/admin.html.erb @@ -9,7 +9,7 @@ <%= render "layouts/admin_header" %> -