projects are now a grid
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user