Lucas/Pooru
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

site: make gallery, navbar, search and media align

Browse source
This commit is contained in:
Lucas Gabriel Vuotto 2025-04-28 07:18:02 +00:00
parent 4a2fb176d8
commit 41f759c566
1 changed files with 7 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

12
public/css/style.css
View file

@ -40,9 +40,11 @@
--tag-kind-r: var(--light-theme-tag-kind-r); --tag-kind-r: var(--light-theme-tag-kind-r);
--gap: 1.5rem; --gap: 1.5rem;
--viewport-width: 60rem; --viewport-width: 90rem;
--border-thin: 0.0625rem solid var(--accent); --border-thin: 0.0625rem solid var(--accent);
--gallery-column-gap: 1.2rem;
} }
*, *,
@ -151,9 +153,6 @@ form[name=search] {
gap: 1rem; gap: 1rem;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding-right: 0.5rem;
padding-left: 0.5rem;
} }
form[name=search] input[type=submit] { form[name=search] input[type=submit] {
@ -294,7 +293,7 @@ main {
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
gap: 1rem; gap: var(--gap) var(--gallery-column-gap);
margin-bottom: var(--gap); margin-bottom: var(--gap);
} }
@ -370,6 +369,7 @@ a.tag-kind-r:active {
@media screen and (max-width: 60rem) { @media screen and (max-width: 60rem) {
:root { :root {
--viewport-width: 100%; --viewport-width: 100%;
--gallery-column-gap: 1rem;
} }
body > header > nav, body > header > nav,
@ -387,6 +387,7 @@ a.tag-kind-r:active {
@media screen and (min-width: 60rem) { @media screen and (min-width: 60rem) {
:root { :root {
--viewport-width: 60rem; --viewport-width: 60rem;
--gallery-column-gap: 1.3125rem;
} }
body > header > nav, body > header > nav,
@ -404,6 +405,7 @@ a.tag-kind-r:active {
@media screen and (min-width: 90rem) { @media screen and (min-width: 90rem) {
:root { :root {
--viewport-width: 90rem; --viewport-width: 90rem;
--gallery-column-gap: 1.2rem;
} }
} }