From 669072d99663127b178c6091608bcfb0f370884a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Maurice=20Preu=C3=9F=20=28envoyr=29?= Date: Wed, 21 Dec 2022 20:23:54 +0100 Subject: [PATCH] update navigation for better mobile handling MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Maurice Preuß (envoyr) --- lib/Froxlor/UI/Panel/UI.php | 2 +- .../Froxlor/src/scss/components/_navbar.scss | 19 +++++++++- .../Froxlor/src/scss/variables/_dark.scss | 1 + .../Froxlor/src/scss/variables/_main.scss | 1 + templates/Froxlor/userarea.html.twig | 38 ++++++++++--------- 5 files changed, 40 insertions(+), 21 deletions(-) diff --git a/lib/Froxlor/UI/Panel/UI.php b/lib/Froxlor/UI/Panel/UI.php index 51028033..7f4886ea 100644 --- a/lib/Froxlor/UI/Panel/UI.php +++ b/lib/Froxlor/UI/Panel/UI.php @@ -93,7 +93,7 @@ class UI public static function sendHeaders() { session_set_cookie_params([ - 'lifetime' => 600, // will be renewed based on settings in lib/init.php + 'lifetime' => self::$install_mode ? 7200 : 600, // will be renewed based on settings in lib/init.php 'path' => '/', 'domain' => $_SERVER['HTTP_HOST'], 'secure' => self::requestIsHttps(), diff --git a/templates/Froxlor/src/scss/components/_navbar.scss b/templates/Froxlor/src/scss/components/_navbar.scss index 93325295..b6642aed 100644 --- a/templates/Froxlor/src/scss/components/_navbar.scss +++ b/templates/Froxlor/src/scss/components/_navbar.scss @@ -3,7 +3,7 @@ } .navbar-brand { - padding: 1rem; + padding: 1rem 0; } @include media-breakpoint-up(md) { @@ -21,9 +21,12 @@ @include media-breakpoint-down(md) { .navbar { - background: darken($navbar-bg, 90); + background: $navbar-bg-mobile; .navbar-nav { + flex-direction: row; + gap: .75rem; + .nav-link { color: $white; @@ -31,6 +34,18 @@ color: rgba(255,255,255,.45); } } + + .dropdown-menu { + position: absolute; + } + } + + #collapseSearch { + border-top: solid 1px $dark; + + #search { + margin-bottom: 1.125rem; + } } } diff --git a/templates/Froxlor/src/scss/variables/_dark.scss b/templates/Froxlor/src/scss/variables/_dark.scss index 0d303415..8e209813 100644 --- a/templates/Froxlor/src/scss/variables/_dark.scss +++ b/templates/Froxlor/src/scss/variables/_dark.scss @@ -25,6 +25,7 @@ $list-group-action-color: $body-color; // Navbar $navbar-bg: $gray-800; +$navbar-bg-mobile: $navbar-bg; $navbar-light-color: $gray-200; $navbar-light-hover-color: $gray-500; $navbar-light-active-color: $gray-500; diff --git a/templates/Froxlor/src/scss/variables/_main.scss b/templates/Froxlor/src/scss/variables/_main.scss index 667acfe0..b47d9d13 100644 --- a/templates/Froxlor/src/scss/variables/_main.scss +++ b/templates/Froxlor/src/scss/variables/_main.scss @@ -67,6 +67,7 @@ $link-color: $froxlor-800; // Navbar $navbar-bg: $white; +$navbar-bg-mobile: $gray-900; // Sidebar $sidebar-width: 256px; diff --git a/templates/Froxlor/userarea.html.twig b/templates/Froxlor/userarea.html.twig index 791f9349..cf646b63 100644 --- a/templates/Froxlor/userarea.html.twig +++ b/templates/Froxlor/userarea.html.twig @@ -19,28 +19,19 @@ {% endblock %}