Galleries/PHPGallery
1
0
Fork 0
mirror of https://github.com/Fluffy-Bean/image-gallery.git synced 2025-06-06 10:23:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Nav changes

Browse source
This commit is contained in:
Michał Gdula 2022-10-04 13:00:40 +00:00
parent 7f2e01a7f1
commit fbbc953ba6
5 changed files with 15 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

1
assets/ui/nav.php
View file

@ -69,7 +69,6 @@ $loggedin = new Account();
<div id='flyoutDim' class='flyout-dim'></div> <div id='flyoutDim' class='flyout-dim'></div>
<div id='flyoutRoot' class='flyout'> <div id='flyoutRoot' class='flyout'>
<p id='flyoutHeader' class='flyout-header'>Header</p> <p id='flyoutHeader' class='flyout-header'>Header</p>
<br>
<p id='flyoutDescription' class='flyout-description'>Description</p> <p id='flyoutDescription' class='flyout-description'>Description</p>
<br> <br>
<div id='flyoutActionbox' class='flyout-actionbox'></div> <div id='flyoutActionbox' class='flyout-actionbox'></div>

13
css/main.css
View file

@ -51,6 +51,9 @@ nav {
padding: 0.5rem; padding: 0.5rem;
width: calc(100% - 1.4rem); width: calc(100% - 1.4rem);
height: auto; 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: -webkit-sticky;
position: sticky; position: sticky;
z-index: 99; z-index: 99;
@ -117,9 +120,6 @@ nav .btn {
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
background-color: rgba(21, 21, 21, 0.7333333333);
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
border: none; border: none;
border-top: #8C977D 0.2rem solid; border-top: #8C977D 0.2rem solid;
border-radius: 0; border-radius: 0;
@ -410,8 +410,8 @@ nav .btn {
min-height: 30vh; min-height: 30vh;
display: flex; display: flex;
background-color: rgba(21, 21, 21, 0.7333333333); background-color: rgba(21, 21, 21, 0.7333333333);
-webkit-backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(20px);
backdrop-filter: blur(8px); backdrop-filter: blur(20px);
border-radius: 0.4rem; border-radius: 0.4rem;
transition: max-height 0.15s cubic-bezier(0.19, 1, 0.22, 1); transition: max-height 0.15s cubic-bezier(0.19, 1, 0.22, 1);
} }
@ -1075,16 +1075,19 @@ a.btn {
.btn-bad { .btn-bad {
background-color: #B66467; background-color: #B66467;
background-image: linear-gradient(to top, #ae5356, #B66467);
/*color: darken($warning, 40%);*/ /*color: darken($warning, 40%);*/
} }
.btn-warning { .btn-warning {
background-color: #D8A657; background-color: #D8A657;
background-image: linear-gradient(to top, #d39b42, #D8A657);
/*color: darken($warning, 40%);*/ /*color: darken($warning, 40%);*/
} }
.btn-good { .btn-good {
background-color: #8C977D; background-color: #8C977D;
background-image: linear-gradient(to top, #7f8b6f, #8C977D);
/*color: darken($warning, 40%);*/ /*color: darken($warning, 40%);*/
} }

3
css/main.scss
View file

@ -121,14 +121,17 @@ a.btn {
.btn-bad { .btn-bad {
background-color: $warning; background-color: $warning;
background-image: linear-gradient(to top, darken($warning, 5%), $warning);
/*color: darken($warning, 40%);*/ /*color: darken($warning, 40%);*/
} }
.btn-warning { .btn-warning {
background-color: $alert; background-color: $alert;
background-image: linear-gradient(to top, darken($alert, 5%), $alert);
/*color: darken($warning, 40%);*/ /*color: darken($warning, 40%);*/
} }
.btn-good { .btn-good {
background-color: $page-accent; background-color: $page-accent;
background-image: linear-gradient(to top, darken($page-accent, 5%), $page-accent);
/*color: darken($warning, 40%);*/ /*color: darken($warning, 40%);*/
} }
.btn-neutral { .btn-neutral {

2
css/scss/_body.scss
View file

@ -275,7 +275,7 @@
display: flex; display: flex;
background-color: $bg-alt; background-color: $bg-alt;
backdrop-filter: blur(8px); backdrop-filter: blur(20px);
border-radius: $rad; border-radius: $rad;

6
css/scss/_navigation.scss
View file

@ -13,6 +13,9 @@ nav {
width: calc(100% - 1.4rem); width: calc(100% - 1.4rem);
height: auto; height: auto;
background-color: $bg-alt;
backdrop-filter: blur(69px) saturate(100%) brightness(100%);
position: sticky; position: sticky;
z-index: 99; z-index: 99;
top: 1rem; top: 1rem;
@ -89,9 +92,6 @@ nav {
left: 0; left: 0;
right: 0; right: 0;
background-color: $bg-alt;
backdrop-filter: blur(8px);
border: none; border: none;
border-top: $border; border-top: $border;
border-radius: 0; border-radius: 0;