projects are now a grid

This commit is contained in:
asus
2024-05-26 13:34:59 +02:00
parent 9ba7801d03
commit 86869399fb
2 changed files with 31 additions and 37 deletions

View File

@@ -5,42 +5,16 @@
.projects_grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, auto));
grid-template-columns: repeat(2, minmax(100px, auto));
grid-template-columns: repeat(2, minmax(100px, 500px));
grid-gap: 20px;
figure {
figcaption {
text-align: left;
margin-bottom: 100px;
}
}
}
article {
display: grid;
grid-gap: 20px;
margin-top: 100px;
/*
* trying to create a responsive design, but still some bugs
* so for now stick to mobile first
*
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
*/
grid-template-columns: auto;
p {
grid-column: 1 / span 2;
grid-column: 1;
}
img:first-of-type {
grid-column: 1;
}
img {
width: 600px;
/*
min-width: 300px;
width: 100%;
max-height: 500px;
max-width: 500px;
margin: 0px auto;
*/
}
}
.mouse {
margin-top: 100px;
}