inherentlee/beall-greenhouses
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rework artist in residence layout

Browse Source
This commit is contained in:
Lee Cattarin
2026-01-21 19:24:23 -08:00
parent fe37e74c4e
commit a0713755a2
2 changed files with 70 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
assets/styles/artist-resident.css
View File

@ -1,51 +1,91 @@
.resident {
margin: 2rem auto;
.topic {
margin: 4rem auto;
display: grid;
grid-template:
'img h1'
'img desc'
'img .';
grid-template-columns: 1fr 1fr;
}
@media (max-width: 1050px) {
.resident {
.topic:nth-child(odd) {
grid-template:
'img h'
'img desc'
'img .';
grid-template-columns: 45% auto;
}
.topic:nth-child(even) {
grid-template:
'h img'
'desc img'
'. img';
grid-template-columns: auto 45%;
}
@media (max-width: 950px) {
.topic:nth-child(odd),
.topic:nth-child(even) {
grid-template:
'img'
'h1'
'h'
'desc';
}
}
.resident h1 {
grid-area: h1;
font-size: 2rem;
margin: 0;
border-bottom: .25rem solid var(--color-accent);
}
.resident img {
.topic img {
grid-area: img;
border-radius: 1rem;
}
.resident #bio {
grid-area: desc;
margin-left: 1.75rem;
}
@media (max-width: 1050px) {
.resident img {
@media (max-width: 950px) {
.topic img {
border-radius: 1rem 1rem 0 0;
border-bottom: .25rem solid var(--color-accent);
}
}
.resident #bio {
.topic h1,
.topic h2 {
margin: 0;
grid-area: h;
border-bottom: .25rem solid var(--color-accent);
padding: .25rem;
}
.topic:nth-child(odd) h2 {
padding-left: .75rem;
}
.topic:nth-child(even) h2 {
text-align: right;
padding-right: .75rem;
}
@media (max-width: 950px) {
.topic:nth-child(odd) h2,
.topic:nth-child(even) h2 {
padding: .25rem 0;
}
}
.topic .desc {
grid-area: desc;
background-color: var(--color-bg-alt);
border-radius: 0 0 1rem 1rem;
}
.topic:nth-child(odd) .desc {
margin-left: 1.5rem;
}
.topic:nth-child(even) .desc {
margin-right: 1.5rem;
}
@media (max-width: 950px) {
.topic:nth-child(odd) .desc,
.topic:nth-child(even) .desc {
margin: 0;
}
}
.resident #bio,
.contact ul {
background-color: var(--color-bg-alt);
border-radius: 0 0 1rem 1rem;