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

Progress on fixing shitty groups code?

Browse source
This commit is contained in:
Michał Gdula 2022-09-24 16:47:34 +00:00
parent be80166795
commit 89bab971f3
8 changed files with 252 additions and 122 deletions
Download patch file Download diff file Expand all files Collapse all files

109
css/scss/_body.scss
View file

@ -431,6 +431,89 @@
}
}
}
.group-make {
margin: 0.25rem;
padding: 0;
height: auto;
max-width: calc(20% - 0.5rem);
min-width: calc(20% - 0.5rem);
border-radius: calc($rad - 0.5rem);
position: relative;
overflow: hidden;
flex: 1 0 150px;
transition: outline 0.1s cubic-bezier(.19, 1, .22, 1);
&:hover {
outline: $white 0.2rem solid;
}
&:after {
content: "";
display: block;
padding-bottom: 100%;
}
button {
@include flexDown(center);
align-items: center;
width: 100%;
height: 100%;
padding: 0;
background-color: $black;
border-radius: calc($rad - 0.5rem);
border: none;
top: 0;
bottom: 0;
left: 0;
right: 0;
position: absolute;
z-index: 5;
text-decoration: none;
font-family: $font-body;
&:hover {
color: $fg;
cursor: pointer;
}
span {
text-align: center;
}
img {
margin: 0.25rem;
width: 2.5rem;
height: 2.5rem;
}
}
}
@media (max-width: 800px) {
.group-make {
max-width: calc(25% - 0.5rem);
min-width: calc(25% - 0.5rem);
}
}
@media (max-width: 550px) {
.group-make {
max-width: calc(33.33% - 0.5rem);
min-width: calc(33.33% - 0.5rem);
}
}
/*
|-------------------------------------------------------------
| profile
@ -509,18 +592,16 @@
| UPLOAD
|-------------------------------------------------------------
*/
.upload-root {
& > img {
margin: 0 auto;
.upload-root > img {
margin: 0 auto;
max-width: 100%;
max-height: 15rem;
max-width: 100%;
max-height: 15rem;
border-radius: calc($rad - 0.7rem);
border-radius: calc($rad - 0.7rem);
display: flex;
flex-direction: column;
}
display: flex;
flex-direction: column;
}
/*
@ -750,14 +831,4 @@
background-color: $bg;
position: sticky;
top: 0;
}
/*
|-------------------------------------------------------------
| PASSWORD RESET
|-------------------------------------------------------------
*/
.password-reset-root {
@include defaultDecoration($red);
@include defaultFont();
}