Reduce the depth of the DOM and simplify the CSS a bit

Remove the main intermediate container. It wasn't acutally serving a purpose.
Remove some of the BEM-style classes that also weren't really doing anything.
This commit is contained in:
Eryn Wells 2024-10-13 23:13:16 -07:00
parent d17ec7f48f
commit 4c689f0f5c
8 changed files with 31 additions and 43 deletions

View file

@ -61,7 +61,7 @@ p + p {
/* Figures */
{{- $elementsWithXLBlockMargins := "blockquote, .figure--code, .figure--image, .figure--youtube, .codeblock, .highlight, table" -}}
{{- $elementsWithXLBlockMargins := "blockquote, table, .codeblock, .figure--code, .figure--image, .figure--youtube, .highlight" -}}
p + :is({{ $elementsWithXLBlockMargins }}) {
margin-block-start: var(--space-xl);

View file

@ -83,14 +83,12 @@ body {
}
.main--list {
.page-header,
.main--list__page-list
{
.page-header {
grid-column: main-start / main-end;
}
.page-header,
.main--list__content
.main__content
{
margin-block-end: var(--space-xl);
}

View file

@ -1,18 +1,16 @@
<!DOCTYPE html>
<html lang="{{ or site.Language.LanguageCode }}" dir="{{ or site.Language.LanguageDirection `ltr` }}">
<head>
{{ partial "base/head.html" . }}
{{ block "head_css" . }}{{ end }}
{{- partial "base/head.html" . -}}
{{- block "head_css" . }}{{ end -}}
</head>
<body>
<header class="site-header">
{{ partial "site/header.html" . }}
</header>
<div class="body__container">
{{ block "main" . }}{{ end }}
<footer class="site-footer">
{{ partial "site/footer.html" . }}
</footer>
</div>
{{ block "main" . }}{{ end }}
<footer class="site-footer">
{{ partial "site/footer.html" . }}
</footer>
</body>
</html>

View file

@ -4,14 +4,10 @@
{{ partial "page_header.html" (dict "page" .) }}
</header>
{{ with .Content -}}
<div class="main--list__content content">{{ . }}</div>
{{- end }}
{{- .Content -}}
<div class="main--list__page-list">
{{ range .Pages.ByTitle }}
{{ .Render "page_summary" }}
{{ end }}
</div>
{{- range .Pages.ByTitle -}}
{{ .Render "page_summary" }}
{{- end -}}
</main>
{{ end }}

View file

@ -4,14 +4,14 @@
{{ partial "page_header.html" (dict "page" .) }}
</header>
{{ if .Params.renderTableofContents | default false }}
{{ if .Params.tableOfContents | default .Params.renderTableofContents | default false -}}
<details>
<summary>{{ i18n "tableOfContents" }}</summary>
{{ .TableOfContents }}
</details>
{{ end }}
{{- end }}
{{ .Content }}
{{- .Content -}}
<footer class="page-footer">
{{ partial "page/footer.html" . }}

View file

@ -1,14 +1,12 @@
{{ define "main" }}
<main class="main--list taxonomy" data-taxonomy-name="{{ .Data.Singular }}">
<main class="main--list taxonomy" data-taxonomy-name="{{ .Data.Singular }}">
<header class="page-header">
{{ partial "page_header.html" (dict "page" . "title" .Title) }}
</header>
{{ with .Content -}}
<div class="main--list__content">{{ . }}</div>
{{- end }}
{{- .Content -}}
<div class="main--list__page-list">
<div class="main__page-list">
{{ range .Pages.ByTitle }}
{{ .Render "page_summary" }}
{{ end }}

View file

@ -5,15 +5,13 @@
</header>
{{- with .Content }}
<div class="main--list__content">{{ . }}</div>
<div class="main__content">{{ . }}</div>
{{ end -}}
<div class="main--list__page-list">
{{ range .Pages.ByDate.Reverse -}}
{{ if or (not .Draft) hugo.IsDevelopment }}
{{ .Render "page_summary" }}
{{ end }}
{{- end }}
</div>
{{ range .Pages.ByDate.Reverse -}}
{{ if or (not .Draft) hugo.IsDevelopment }}
{{ .Render "page_summary" }}
{{ end }}
{{- end }}
</main>
{{ end }}

View file

@ -1,9 +1,9 @@
{{- with (partial .cssResource .page) }}
{{- if eq hugo.Environment "development" }}
{{- if eq hugo.Environment "development" -}}
<link rel="stylesheet" href="{{ .RelPermalink }}">
{{- else }}
{{- with . | minify | fingerprint }}
{{- else -}}
{{- with . | minify | fingerprint -}}
<link rel="stylesheet" href="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
{{- end }}
{{- end }}
{{- end }}
{{- end -}}
{{- end -}}
{{- end -}}