Clean up some photos selectors -- use child selectors instead of descendant

This commit is contained in:
Eryn Wells 2022-10-21 11:08:16 -07:00
parent ff14784468
commit b8b614e68d

View file

@ -22,7 +22,7 @@
--rss-icon: url(/icons/rss-dark.svg); --rss-icon: url(/icons/rss-dark.svg);
} }
main.photos.list { .photos.list {
display: inline-block; display: inline-block;
max-width: none; max-width: none;
margin: var(--body-item-spacing) 0; margin: var(--body-item-spacing) 0;
@ -30,7 +30,7 @@ main.photos.list {
width: 100%; width: 100%;
} }
main.photos.list ul.grid { .photos.list > .grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 0.8rem; gap: 0.8rem;
@ -38,20 +38,25 @@ main.photos.list ul.grid {
padding: 0; padding: 0;
} }
@media (max-width: 415px) { @media (max-width: 415px) {
.photos ul.grid { .photos > .grid {
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
} }
} }
.photos .grid li { .photos.page > nav {
margin-block-end: var(--body-item-spacing);
}
.photos > .grid > li {
line-height: 0; line-height: 0;
list-style: none; list-style: none;
} }
.photos .grid li a { .photos > .grid > li > a {
display: block;
} }
.photos .grid li img { .photos > .grid > li img {
border-radius: 3px; border-radius: 3px;
} }