From fbbc953ba646cd50c930e253bb72219fea8da699 Mon Sep 17 00:00:00 2001 From: Fluffy-Bean Date: Tue, 4 Oct 2022 13:00:40 +0000 Subject: [PATCH] Nav changes --- assets/ui/nav.php | 1 - css/main.css | 13 ++++++++----- css/main.scss | 3 +++ css/scss/_body.scss | 2 +- css/scss/_navigation.scss | 6 +++--- 5 files changed, 15 insertions(+), 10 deletions(-) diff --git a/assets/ui/nav.php b/assets/ui/nav.php index 1a0b108..321159a 100644 --- a/assets/ui/nav.php +++ b/assets/ui/nav.php @@ -69,7 +69,6 @@ $loggedin = new Account();

Header

-

Description


diff --git a/css/main.css b/css/main.css index 187c962..f9f6f43 100644 --- a/css/main.css +++ b/css/main.css @@ -51,6 +51,9 @@ nav { padding: 0.5rem; width: calc(100% - 1.4rem); height: auto; + background-color: rgba(21, 21, 21, 0.7333333333); + -webkit-backdrop-filter: blur(69px) saturate(100%) brightness(100%); + backdrop-filter: blur(69px) saturate(100%) brightness(100%); position: -webkit-sticky; position: sticky; z-index: 99; @@ -117,9 +120,6 @@ nav .btn { bottom: 0; left: 0; right: 0; - background-color: rgba(21, 21, 21, 0.7333333333); - -webkit-backdrop-filter: blur(8px); - backdrop-filter: blur(8px); border: none; border-top: #8C977D 0.2rem solid; border-radius: 0; @@ -410,8 +410,8 @@ nav .btn { min-height: 30vh; display: flex; background-color: rgba(21, 21, 21, 0.7333333333); - -webkit-backdrop-filter: blur(8px); - backdrop-filter: blur(8px); + -webkit-backdrop-filter: blur(20px); + backdrop-filter: blur(20px); border-radius: 0.4rem; transition: max-height 0.15s cubic-bezier(0.19, 1, 0.22, 1); } @@ -1075,16 +1075,19 @@ a.btn { .btn-bad { background-color: #B66467; + background-image: linear-gradient(to top, #ae5356, #B66467); /*color: darken($warning, 40%);*/ } .btn-warning { background-color: #D8A657; + background-image: linear-gradient(to top, #d39b42, #D8A657); /*color: darken($warning, 40%);*/ } .btn-good { background-color: #8C977D; + background-image: linear-gradient(to top, #7f8b6f, #8C977D); /*color: darken($warning, 40%);*/ } diff --git a/css/main.scss b/css/main.scss index 4e31171..2cda3fd 100644 --- a/css/main.scss +++ b/css/main.scss @@ -121,14 +121,17 @@ a.btn { .btn-bad { background-color: $warning; + background-image: linear-gradient(to top, darken($warning, 5%), $warning); /*color: darken($warning, 40%);*/ } .btn-warning { background-color: $alert; + background-image: linear-gradient(to top, darken($alert, 5%), $alert); /*color: darken($warning, 40%);*/ } .btn-good { background-color: $page-accent; + background-image: linear-gradient(to top, darken($page-accent, 5%), $page-accent); /*color: darken($warning, 40%);*/ } .btn-neutral { diff --git a/css/scss/_body.scss b/css/scss/_body.scss index 93061be..b25d652 100644 --- a/css/scss/_body.scss +++ b/css/scss/_body.scss @@ -275,7 +275,7 @@ display: flex; background-color: $bg-alt; - backdrop-filter: blur(8px); + backdrop-filter: blur(20px); border-radius: $rad; diff --git a/css/scss/_navigation.scss b/css/scss/_navigation.scss index f31608a..cbbb7af 100644 --- a/css/scss/_navigation.scss +++ b/css/scss/_navigation.scss @@ -13,6 +13,9 @@ nav { width: calc(100% - 1.4rem); height: auto; + background-color: $bg-alt; + backdrop-filter: blur(69px) saturate(100%) brightness(100%); + position: sticky; z-index: 99; top: 1rem; @@ -89,9 +92,6 @@ nav { left: 0; right: 0; - background-color: $bg-alt; - backdrop-filter: blur(8px); - border: none; border-top: $border; border-radius: 0;