failed-galleries/php-gallery
1
0
Fork 0
mirror of https://github.com/Fluffy-Bean/image-gallery.git synced 2024-12-28 02:16:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixing up some CSS

Browse source
This commit is contained in:
Michał 2022-08-08 19:59:40 +01:00
parent d8b20c9b34
commit bf449271e6
6 changed files with 34 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
Flyout/flyout.css
View file

@ -1,13 +1,16 @@
.flyout-dim {
margin: 0; padding: 0;
width: 100vw; height: 100vh;
display: none;
position: fixed; z-index: 99;
top: 0; bottom: 0; left: 0; right: 0;
object-position: center;
position: fixed; z-index: 999;
background-color: #151515aa;
background-color: var(--bg);
backdrop-filter: blur(8px);
opacity: 0;
@ -20,18 +23,21 @@
max-width: 621px; width: calc(100% - 3.5rem);
max-height: 20rem; height: auto; min-height: 10rem;
position: fixed; z-index: 999999999;
position: fixed; z-index: 9999;
left: 50%; bottom: -15rem;
transform: translateX(-50%) scale(0.5);
background-color: #151515;
overflow-y: auto;
background-color: var(--bg);
backdrop-filter: blur(8px);
color: white;
transition: transform 1s cubic-bezier(.19,1,.22,1), bottom 1s cubic-bezier(.19,1,.22,1);
border-radius: var(--rad);
border: 0.2rem solid var(--green);
outline: 0.5rem solid var(--bg);
/*outline: 0.5rem solid var(--bg);*/
}
.flyout-header {

4
Flyout/flyout.js
View file

@ -8,6 +8,8 @@ $(document).ready(function() {
});
function flyoutShow(header, description, actionbox) {
// Hide overflow
document.querySelector("html").style.overflow = "hidden";
// Checking if actionbox is set
if (typeof actionbox === 'undefined') {
flyoutActionbox.style.display = "none";
@ -36,6 +38,8 @@ function flyoutShow(header, description, actionbox) {
};
function flyoutClose() {
// Show overflow
document.querySelector("html").style.overflow = "auto";
// Hide the flyout
flyoutRoot.style.transform = "translateX(-50%) scale(0.5)";
flyoutRoot.style.bottom = "-20rem";

2
Sniffle/sniffle.css
View file

@ -41,7 +41,7 @@
background-color: #151515;
box-shadow: 5px 5px 5px #151515aa;
box-shadow: var(--shadow);
transition: transform 1s cubic-bezier(.19,1,.22,1), opacity 0.2s cubic-bezier(.19,1,.22,1);

2
css/footer.css
View file

@ -10,7 +10,7 @@ footer {
backdrop-filter: blur(8px);
border: 0.2rem solid var(--green);
outline: 0.5rem solid var(--bg);
/*outline: 0.5rem solid var(--bg);*/
border-radius: var(--rad);
box-shadow: var(--shadow);

20
css/master.css
View file

@ -11,7 +11,7 @@
@import "footer.css";
:root {
--bg: #15151588;
--bg: #151515bb;
--bg-1: #242621;
--bg-2: #1D1E1C;
--bg-3: #151515;
@ -25,8 +25,8 @@
--black: #151515;
--white: #E8E3E3;
--shadow: 6px 6px 10px #15151588;
--rad: 5px;
--shadow: 6px 6px 2px #15151588;
--rad: 2px;
--square: 33.33%;
}
@ -62,6 +62,8 @@ body {
display: flex;
position: relative;
flex-direction: column;
justify-content: space-between;
}
@ -72,7 +74,7 @@ body {
#back-to-top {
margin: 0; padding: 0.5rem;
position: fixed; z-index: 9999999;
position: fixed; z-index: 99;
right: -2.5rem; bottom: 1rem;
object-position: center;
@ -109,7 +111,7 @@ body {
background-color: var(--bg);
backdrop-filter: blur(8px);
outline: 0.5rem solid var(--bg);
/*outline: 0.5rem solid var(--bg);*/
border-radius: var(--rad);
box-shadow: var(--shadow);
@ -152,7 +154,7 @@ body {
backdrop-filter: blur(8px);
border: 0.2rem solid var(--green);
outline: 0.5rem solid var(--bg);
/*outline: 0.5rem solid var(--bg);*/
border-radius: var(--rad);
box-shadow: var(--shadow);
@ -203,7 +205,7 @@ body {
-=-=-= IMAGE FULLSCREEN =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
*/
.image-container {
padding: 0.5rem;
/*padding: 0.5rem;*/
width: calc(100vw - var(--space-medium));
max-height: 69vh; height: auto;
@ -212,7 +214,7 @@ body {
background-color: var(--bg);
backdrop-filter: blur(8px);
outline: 0.5rem solid var(--bg);
/*outline: 0.5rem solid var(--bg);*/
border-radius: var(--rad);
@ -355,7 +357,7 @@ body {
display: block;
border-radius: var(--rad);
outline: 0.5rem solid var(--bg);
/*outline: 0.5rem solid var(--bg);*/
}
.alert {

6
css/nav.css
View file

@ -16,7 +16,7 @@ nav {
backdrop-filter: blur(8px);
border: 0.2rem solid var(--green);
outline: 0.5rem solid var(--bg);
/*outline: 0.5rem solid var(--bg);*/
border-radius: var(--rad);
box-shadow: var(--shadow);
@ -33,6 +33,10 @@ nav hr {
}
.nav-name p, .nav-name {
font-family: "Lexend Deca", sans-serif;
font-size: 22px;
display: block;
}
.nav-links {