Wrap tags list in a .taxonomies <div>

Put two <ul.tags> elements inside so there's not an <li> with a triangle in it.
This commit is contained in:
Eryn Wells 2023-08-20 09:52:05 -07:00
parent ea9fb02aaa
commit 8aed72a94d
2 changed files with 40 additions and 33 deletions

View file

@ -1,5 +1,15 @@
.taxonomies {
align-items: first baseline;
display: flex;
grid-column: content-start / content-end;
height: min-content;
position: relative;
}
ul.tags {
display: flex;
flex-wrap: wrap;
gap: 1rem 1rem;
height: min-content;
margin-inline-start: 0;
padding-inline-start: 0;
@ -12,10 +22,7 @@ ul.tags > li {
display: inline-block;
font-size: 75%;
letter-spacing: 1px;
}
ul.tags > li:first-child {
margin-inline-start: 0;
margin: 0;
}
ul.tags > li:hover {
@ -28,6 +35,7 @@ ul.tags > li > a {
height: 100%;
width: 100%;
padding: 0.6rem 1rem;
text-decoration: none;
}
ul.tags > li > a:hover {
@ -35,10 +43,9 @@ ul.tags > li > a:hover {
text-decoration: none;
}
ul.tags > li + li { margin-inline-start: 1rem; }
ul.tags > li.chevron + li { margin-inline-start: 0 }
ul.tags > li + li { margin-inline-start: 0; }
ul.tags > .chevron {
.taxonomies > .chevron {
align-items: center;
border: 0;
border-radius: 0;
@ -47,11 +54,7 @@ ul.tags > .chevron {
display: flex;
justify-content: center;
margin-inline-start: 0;
padding-inline-start: 1px;
position: relative;
top: 2px;
width: 2rem;
}
ul.tags > .chevron:hover {
color: var(--tag-spacer-foreground-color);
background-color: inherit;
}