mirror of
https://github.com/Fluffy-Bean/Fluffys-website.git
synced 2025-05-25 04:44:56 +00:00
H
This commit is contained in:
parent
b1d8d36704
commit
6e2f592d83
4 changed files with 86 additions and 46 deletions
|
@ -9,7 +9,7 @@ footer {
|
|||
display: flex; flex-direction: row; flex-wrap: wrap;
|
||||
justify-content: space-around; align-items: center;
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
background-color: var(--bg-dark); color: var(--fg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
|
||||
|
@ -24,3 +24,6 @@ footer div {
|
|||
justify-content: center; align-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
footer div h3 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
|
62
css/main.css
62
css/main.css
|
@ -46,10 +46,13 @@ main section img {
|
|||
Gallery
|
||||
*/
|
||||
.gallery-image {
|
||||
padding: 0;
|
||||
width: 100%; height: 30rem;
|
||||
object-fit: contain;
|
||||
|
||||
background-color: #000;
|
||||
display: block;
|
||||
|
||||
background-color: var(--bg-dark);
|
||||
}
|
||||
|
||||
.gallery {
|
||||
|
@ -70,27 +73,6 @@ main section img {
|
|||
display: none;
|
||||
}
|
||||
|
||||
/*
|
||||
#gallery::before,#gallery::after {
|
||||
content: "";
|
||||
|
||||
width: 5rem; height: 10rem;
|
||||
display: block;
|
||||
|
||||
position: absolute; bottom: 1rem;
|
||||
}
|
||||
#gallery::before {
|
||||
left: 1rem;
|
||||
|
||||
background: linear-gradient(to right, var(--bg) 0%, transparent 100%);
|
||||
}
|
||||
#gallery::after {
|
||||
right: 1rem;
|
||||
|
||||
background: linear-gradient(to left, var(--bg) 0%, transparent 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
.gallery img {
|
||||
margin: 0 0.5rem;
|
||||
|
||||
|
@ -114,3 +96,39 @@ main section img {
|
|||
.gallery img:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
Filter
|
||||
*/
|
||||
.filter-list {
|
||||
margin: 0 0 1rem 0; padding: 0;
|
||||
width: 100%;
|
||||
display: flex; flex-direction: row;
|
||||
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.filter-list div {
|
||||
margin: 0 1rem 0 0; padding: 0.5rem;
|
||||
width: 15rem; min-width: 8rem;
|
||||
height: 1.5rem;
|
||||
|
||||
display: flex;
|
||||
justify-content: center; align-items: center;
|
||||
|
||||
text-align: center;
|
||||
|
||||
background-color: var(--bg-dark);
|
||||
}
|
||||
@media (max-width:750px) {
|
||||
.filter-list {
|
||||
flex-direction: column;
|
||||
}
|
||||
.filter-list div {
|
||||
margin: 0 0 1rem 0;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
.filter-list div:last-child {
|
||||
margin: 0;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue