chore: styles
This commit is contained in:
parent
bfbeba9916
commit
04622dbce7
7 changed files with 50 additions and 48 deletions
|
@ -48,6 +48,7 @@ body::-webkit-scrollbar {
|
|||
|
||||
p {
|
||||
margin: var(--margin-vertical-base-horizontal-zero);
|
||||
overflow: visible;
|
||||
|
||||
&.books,
|
||||
&.collected,
|
||||
|
@ -173,18 +174,13 @@ a {
|
|||
|
||||
a:focus,
|
||||
a:focus-within
|
||||
a:focus > svg,
|
||||
a:focus-within > svg {
|
||||
a:has(svg):focus svg,
|
||||
a:has(svg):focus-within svg {
|
||||
outline: var(--outline-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:has(svg):focus,
|
||||
a:has(svg):focus-within {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
a.icon-link:focus,
|
||||
a.icon-link:focus-within {
|
||||
outline: var(--outline-default);
|
||||
|
|
|
@ -39,6 +39,16 @@
|
|||
}
|
||||
}
|
||||
|
||||
& a:has(img) {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
& a:focus img,
|
||||
& a:focus-within img {
|
||||
outline: var(----outline-default);
|
||||
border: 0;
|
||||
}
|
||||
|
||||
& img {
|
||||
border: var(--border-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
|
|
|
@ -51,10 +51,6 @@
|
|||
|
||||
& p {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
max-width: 100%;
|
||||
text-overflow: ellipsis;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
& .description {
|
||||
|
@ -87,25 +83,23 @@
|
|||
flex-direction: column;
|
||||
gap: var(--spacing-sm);
|
||||
|
||||
& p {
|
||||
&.title {
|
||||
font-size: var(--font-size-xl);
|
||||
line-height: var(--line-height-md);
|
||||
}
|
||||
& p.title {
|
||||
font-size: var(--font-size-xl);
|
||||
line-height: var(--line-height-md);
|
||||
}
|
||||
|
||||
&.sub-meta {
|
||||
font-size: var(--font-size-sm);
|
||||
& p.sub-meta {
|
||||
font-size: var(--font-size-sm);
|
||||
|
||||
& svg {
|
||||
width: var(--sizing-svg-sm);
|
||||
height: var(--sizing-svg-sm);
|
||||
}
|
||||
& svg {
|
||||
width: var(--sizing-svg-sm);
|
||||
height: var(--sizing-svg-sm);
|
||||
}
|
||||
}
|
||||
|
||||
&.title,
|
||||
&.sub-meta {
|
||||
margin: 0;
|
||||
}
|
||||
& p.title,
|
||||
& p.sub-meta {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,19 +3,21 @@
|
|||
{%- capture alt -%}{{ item.title | escape }} by {{ item.artist }}{%- endcapture -%}
|
||||
<div class="item">
|
||||
<div class="meta">
|
||||
<img
|
||||
srcset="
|
||||
https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp 50w,
|
||||
https://cdn.coryd.dev{{ item.image }}?class=w100&type=webp 100w
|
||||
"
|
||||
sizes="(max-width: 450px) 50px, 100px"
|
||||
src="https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp"
|
||||
alt="{{ alt }}"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
width="64"
|
||||
height="64"
|
||||
/>
|
||||
<a href="{{ item.url }}">
|
||||
<img
|
||||
srcset="
|
||||
https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp 50w,
|
||||
https://cdn.coryd.dev{{ item.image }}?class=w100&type=webp 100w
|
||||
"
|
||||
sizes="(max-width: 450px) 50px, 100px"
|
||||
src="https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp"
|
||||
alt="{{ alt }}"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
width="64"
|
||||
height="64"
|
||||
/>
|
||||
</a>
|
||||
<div class="meta-text">
|
||||
<div class="title">
|
||||
<a href="{{ item.url }}">{{ item.title }}</a>
|
||||
|
|
|
@ -11,9 +11,9 @@ permalink: "/posts/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}
|
|||
{% for post in pagination.items %}
|
||||
<article>
|
||||
<time datetime="{{ post.date }}">{{ post.date | date: "%B %e, %Y" }}</time>
|
||||
<a href="{{ post.slug }}">
|
||||
<h3>{{ post.title }}</h3>
|
||||
</a>
|
||||
<h3>
|
||||
<a href="{{ post.slug }}">{{ post.title }}</a>
|
||||
</h3>
|
||||
<p>{{ post.description }}</p>
|
||||
</article>
|
||||
{% endfor %}
|
||||
|
|
Reference in a new issue