add css for dl; minor adjustments to book layouts

This commit is contained in:
loikein 2023-04-25 18:14:27 +01:00
parent fa6bda5448
commit 7595e2e6b9
5 changed files with 120 additions and 61 deletions

View file

@ -197,11 +197,11 @@ mjx-container[jax="CHTML"][display="true"],
grid-auto-flow: column;
/* above 2 lines are equivalent as below 1 line */
/* grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); */
gap: 1.3rem;
margin: 0 0 1rem 0;
gap: 1.4rem;
margin: 0 0 1.4rem 0;
}
.row .column {
margin-left: 0;
margin-left: 0 !important;
}
}
@ -250,8 +250,8 @@ mjx-container[jax="CHTML"][display="true"],
/* reduce zh & ja font-size to match en */
p:lang(zh),
p:lang(ja) {
p:lang(zh), span:lang(zh),
p:lang(ja), span:lang(ja), {
font-size: 1.2rem;
}

View file

@ -140,7 +140,8 @@ section {
p,
ol,
ul {
ul,
dl {
font-size: 1.4rem;
}
@ -196,7 +197,8 @@ blockquote footer {
}
ol,
ul {
ul,
dl {
width: 45%;
-webkit-padding-start: 5%;
-webkit-padding-end: 5%;
@ -206,10 +208,37 @@ li ul {
width: 100%;
}
li {
li,
dt, dd {
padding: 0.5rem 0;
}
dl {
display: grid;
gap: 0 1rem;
}
dt {
font-weight: 700;
grid-column: 1;
}
dd {
margin-bottom: 0;
margin-left: 1rem;
}
@media (min-width: 760px) {
dl {
grid-template-columns: fit-content(50%) auto;
}
dd {
grid-column: 2;
margin-left: 0;
}
}
figure {
padding: 0;
border: 0;
@ -323,7 +352,9 @@ div.table-wrapper {
footer {
width: 90%;
}
ul {
ul,
ol,
dl {
width: 85%;
}
figure {

View file

@ -13,6 +13,18 @@
{{ end }}
<section class="list-page">
<!-- preambles -->
<ul>
{{ range .Pages.ByTitle }}
{{ if .IsPage }}
<li><a href="{{ .RelPermalink }}">{{ .Title }}{{- if .Draft -}} :: Draft {{- end -}}</a></li>
{{ end }}
{{ end }}
</ul>
<!-- sub categories & pages -->
{{ $indexScratch := .Scratch }}
{{ range .Sections }}
{{ $indexScratch.Add "sections" (slice . ) }}

View file

@ -14,6 +14,19 @@
{{ end }}
<section class="list-page">
<!-- preambles -->
<ul>
{{ range .Pages.ByTitle }}
{{ if .IsPage }}
<li><a href="{{ .RelPermalink }}">{{ .Title }}{{- if .Draft -}} :: Draft {{- end -}}</a></li>
{{ end }}
{{ end }}
</ul>
<!-- sub categories -->
<ul>
{{ range .Pages.ByTitle }}
{{ if .IsSection }}

View file

@ -1,57 +1,60 @@
{{- $context := .context }}
{{- $color := .color | default "" }}
{{- $content := .content }}
{{- $href := (trim .href " ") | default "" }}
{{- $style := .style | default "default" }}
{{- if and (not $color) (eq (len $color) 0) }}
{{- $style = .style | default "transparent" }}
{{- $context := .context -}}
{{- $color := .color | default "" -}}
{{- $content := .content -}}
{{- $href := (trim .href " ") | default "" -}}
{{- $style := .style | default "default" -}}
{{- if and (not $color) (eq (len $color) 0) -}}
{{- $style = .style | default "transparent" -}}
{{- end -}}
{{- $target := .target | default "" -}}
{{- $type := .type | default "" -}}
{{- $isButton := false -}}
{{- if or (not $href) (strings.HasPrefix $href "javascript:") -}}
{{- $isButton = true -}}
{{- $href = substr $href (len "javascript:") -}}
{{- if not $type -}}
{{- $type = "button" -}}
{{- end -}}
{{- else if and (eq (len $target) 0) (or (strings.HasPrefix $href "http://") (strings.HasPrefix $href "https://") ) -}}
{{- $target = "_blank" -}}
{{- if isset $context.Site.Params "externallinktarget" -}}
{{- $target = $context.Site.Params.externalLinkTarget -}}
{{- end -}}
{{- end }}
{{- $target := .target | default "" }}
{{- $type := .type | default "" }}
{{- $isButton := false }}
{{- if or (not $href) (strings.HasPrefix $href "javascript:") }}
{{- $isButton = true }}
{{- $href = substr $href (len "javascript:") }}
{{- if not $type }}
{{- $type = "button" }}
{{- end }}
{{- else if and (eq (len $target) 0) (or (strings.HasPrefix $href "http://") (strings.HasPrefix $href "https://") ) }}
{{- $target = "_blank" }}
{{- if isset $context.Site.Params "externallinktarget" }}
{{- $target = $context.Site.Params.externalLinkTarget }}
{{- end }}
{{- end }}
{{- $title := .title | default ($content) | default ($style | T) }}
{{- $title = trim $title " " }}
{{- $icon := .icon | default "" }}
{{- if and (not $icon) (eq (len $icon) 0) }}
{{- if eq $style "info" }}{{ $icon = default "info-circle" }}{{ end }}
{{- if eq $style "warning" }}{{ $icon = default "exclamation-triangle" }}{{ end }}
{{- if eq $style "note" }}{{ $icon = default "exclamation-circle" }}{{ end }}
{{- if eq $style "tip" }}{{ $icon = default "lightbulb" }}{{ end }}
{{- end }}
{{- $icon = trim $icon " " }}
{{- $iconposition := .iconposition | default "left" }}
{{- with $context }}
{{- $title := .title | default ($content) | default ($style | T) -}}
{{- $title = trim $title " " -}}
{{- $icon := .icon | default "" -}}
{{- if and (not $icon) (eq (len $icon) 0) -}}
{{- if eq $style "info" -}}{{ $icon = default "info-circle" }}{{- end -}}
{{- if eq $style "warning" -}}{{ $icon = default "exclamation-triangle" }}{{- end -}}
{{- if eq $style "note" -}}{{ $icon = default "exclamation-circle" }}{{- end -}}
{{- if eq $style "tip" -}}{{ $icon = default "lightbulb" }}{{- end -}}
{{- end -}}
{{- $icon = trim $icon " " -}}
{{- $iconposition := .iconposition | default "left" -}}
{{- with $context -}}
<span class="btn {{ $style }}"{{ if $color }} style="--VARIABLE-BOX-color: {{ $color }};"{{ end }}>
{{- if $isButton }}
<button{{ if $href }} onclick="{{ $href | safeJS }}"{{ end }}{{ if gt (len $type) 0 }} type="{{ $type }}"{{ end }}>
{{- else }}
<a{{ if $href }} href="{{ $href }}"{{ if gt (len $target) 0 }} target="{{ $target }}"{{ end }}{{ end }}>
{{- end }}
{{- if and $icon (eq $iconposition "left") }}
<span class="icon">{{ $icon }}</span>
{{- end }}
{{ $title | safeHTML }}
{{- if and $icon (eq $iconposition "right") }}
<span class="icon">{{ $icon }}</span>
{{- end }}
{{- if $isButton }}
</button>
{{- else }}
</a>
{{- end }}
{{ if $isButton -}}
<button{{ if $href }} onclick="{{ $href | safeJS }}"{{ end }}{{ if gt (len $type) 0 }} type="{{ $type }}"{{ end }}>
{{ else -}}
<a{{ if $href }} href="{{ $href }}"{{ if gt (len $target) 0 }} target="{{ $target }}"{{ end }}{{ end }}>
{{- end -}}
{{ if and $icon (eq $iconposition "left") -}}
<span class="icon">{{- $icon -}}</span>
{{- end -}}
{{- $title | safeHTML -}}
{{ if and $icon (eq $iconposition "right") -}}
<span class="icon">{{- $icon -}}</span>
{{- end -}}
{{ if $isButton -}}
</button>
{{ else -}}
</a>
{{ end -}}
</span>
{{- end }}
{{- end -}}
{{/* https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/shortcodes/button.html */}}