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);
}
main.photos.list {
.photos.list {
display: inline-block;
max-width: none;
margin: var(--body-item-spacing) 0;
@ -30,7 +30,7 @@ main.photos.list {
width: 100%;
}
main.photos.list ul.grid {
.photos.list > .grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 0.8rem;
@ -38,20 +38,25 @@ main.photos.list ul.grid {
padding: 0;
}
@media (max-width: 415px) {
.photos ul.grid {
.photos > .grid {
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;
list-style: none;
}
.photos .grid li a {
.photos > .grid > li > a {
display: block;
}
.photos .grid li img {
.photos > .grid > li img {
border-radius: 3px;
}