Clean up page summary and update styles

This commit is contained in:
Eryn Wells 2024-07-23 09:04:22 -07:00
parent 234acb08b8
commit 0cfc91d26e
2 changed files with 32 additions and 18 deletions

View file

@ -3,7 +3,9 @@
**************************/
.page-summary {
&:not(:first-child) {
grid-column: main-start / main-end;
p + & {
margin-block-start: var(--space-xl);
}
@ -12,23 +14,38 @@
}
.page-summary__date {
font-weight: normal;
color: var(--text-color-secondary);
display: block;
font-size: var(--text-s);
line-height: 1;
}
.page-summary__title {
font-size: var(--text-l);
line-height: 1;
margin-block: 0;
a {
color: var(--text-color-body);
&:hover {
color: var(--text-color-link);
}
}
}
.page-summary__subtitle {
color: var(--text-color-secondary);
font-family: var(--font-family-heading);
font-weight: normal;
}
.page-summary__content {
margin-block-end: var(--space-m);
}
:is(.page-summary__title, .page-summary__subtitle, .page-summary__date):last-child {
:is(
.page-summary__heading,
.page-summary__subtitle,
.page-summary__content,
.page-summary__date
):not(:last-child) {
margin-block-end: var(--space-xs);
}
}

View file

@ -1,16 +1,13 @@
<article class="page-summary">
<header>
<h2 class="page-summary__title">{{ .Title }}</h2>
{{ with .Params.subtitle | default .Description | markdownify }}
<p class="page-summary__subtitle">{{ . }}</p>
{{ end }}
<header class="page-summary__heading">
<h2 class="page-summary__title"><a href="{{ .Permalink }}">{{ .LinkTitle }}</a></h2>
</header>
{{ if (.Params.rendersSummary | default true) -}}
<div class="page-summary__content">
{{ .Summary }}
</div>
{{ with .Description }}
<div class="page-summary__content">{{ . | markdownify }}</div>
{{ end }}
{{- end }}
<footer class="page-summary__footer">
<a href="{{ .RelPermalink }}">More →</a>
</footer>
{{ with .Date }}
<time class="page-summary__date" datetime="{{ . | time.Format "2006-01-02" }}">{{ . | time.Format ":date_medium" }}</time>
{{ end }}
</article>