marin.gerard/moniks_bot
1
0
Fork 0
forked from julien.oculi/fork_mon_premier_robot
Code Pull requests Activity

fix(client): 💄 css grid overflow on small devices

Browse source
This commit is contained in:
Julien Oculi 2024-06-25 16:12:13 +02:00
parent 49e32d5bf1
commit 05e3b607a2
1 changed files with 3 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
client/style.css
View file

@ -4,6 +4,7 @@
--padding: 0.5rem; --padding: 0.5rem;
--padding-half: calc(var(--padding) / 2); --padding-half: calc(var(--padding) / 2);
--border-size: 0.2rem; --border-size: 0.2rem;
--max-width: min(calc(100dvw - 1rem), 700px);
} }
* { * {
@ -80,14 +81,14 @@ button {
.inputs { .inputs {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(700px, 1fr)); grid-template-columns: repeat(auto-fill, minmax(var(--max-width), 1fr));
gap: var(--padding); gap: var(--padding);
width: 100%; width: 100%;
} }
.infos { .infos {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(800px, 1fr)); grid-template-columns: repeat(auto-fill, minmax(var(--max-width), 1fr));
flex-wrap: wrap; flex-wrap: wrap;
gap: var(--padding); gap: var(--padding);
justify-content: space-between; justify-content: space-between;