mirror of
https://github.com/nunocoracao/blowfish.git
synced 2026-01-30 16:31:52 +01:00
17906e63e2
Replace complex title processing (9 lines) with single-line title filter approach. Changes: - Simplify $admonitionTitle definition from 5 variables to 1 line - Remove $titleClass conditional logic (4 lines) - Replace dynamic CSS class with static "grow" class - Use Hugo title filter instead of CSS capitalize - Remove TrimSpace processing per author feedback This maintains the same visual behavior while significantly reducing code complexity. Related: PR #2704 feedback from ZhenShuo2021
94 lines
3.2 KiB
HTML
94 lines
3.2 KiB
HTML
{{- /* To customize your own admonitions, you can do the following:
|
|
|
|
1. Change colors
|
|
|
|
Define your colors in `assets/css/custom.css` using the variables from:
|
|
https://github.com/nunocoracao/blowfish/blob/main/assets/css/components/admonition.css
|
|
|
|
Example:
|
|
```
|
|
:root {
|
|
--adm-note-bg: red;
|
|
}
|
|
html.dark {
|
|
--adm-note-bg: green;
|
|
}
|
|
```
|
|
|
|
This will update the background color for light and dark mode.
|
|
|
|
2. Change icons and type settings
|
|
|
|
You can override the default type and icon mappings by creating your own
|
|
`impls/hooks/admonition-maps.html` in your `layouts` folder.
|
|
This allows you to assign different icons or styles for each admonition type.
|
|
*/ -}}
|
|
|
|
{{- if eq .Type "alert" -}}
|
|
{{- $maps := partialCached "impls/hooks/admonition-maps.html" . -}}
|
|
{{- $typeMap := $maps.typeMap -}}
|
|
{{- $iconMap := $maps.iconMap -}}
|
|
|
|
{{- $rawType := .AlertType | lower -}}
|
|
{{- $normalizedType := index $typeMap $rawType | default $rawType -}}
|
|
{{- $iconName := .Attributes.icon | default (index $iconMap $normalizedType) | default "circle-info" -}}
|
|
|
|
{{- $admonitionTitle := .AlertTitle | default ((i18n (printf "admonition.%s" $normalizedType) | default $normalizedType) | title) -}}
|
|
|
|
{{- $containerClass := "admonition relative overflow-hidden rounded-lg border-l-4 my-3 px-4 py-3 shadow-sm" -}}
|
|
{{- $headerClass := "flex items-center gap-2 font-semibold text-inherit" -}}
|
|
{{- $contentClass := "admonition-content mt-3 text-base leading-relaxed text-inherit" -}}
|
|
|
|
{{- $isCollapsible := in (slice "+" "-") .AlertSign -}}
|
|
{{- if $isCollapsible -}}
|
|
<details
|
|
class="{{ $containerClass }} group"
|
|
data-type="{{ $normalizedType }}"
|
|
{{ if eq .AlertSign "+" }}open{{ end }}>
|
|
<summary class="{{ $headerClass }} cursor-pointer">
|
|
<div class="flex shrink-0 h-5 w-5 items-center justify-center text-lg">
|
|
{{- partial "icon.html" $iconName -}}
|
|
</div>
|
|
<div class="grow">
|
|
{{ $admonitionTitle }}
|
|
</div>
|
|
<div
|
|
class="ms-auto flex h-5 w-5 items-center justify-center transition-transform ease-in-out -rotate-90 group-open:rotate-0 print:hidden">
|
|
{{- partial "icon.html" "chevron-down" -}}
|
|
</div>
|
|
</summary>
|
|
{{- if .Text -}}
|
|
<div class="{{ $contentClass }}">
|
|
{{- .Text | safeHTML -}}
|
|
</div>
|
|
{{- end -}}
|
|
</details>
|
|
{{- else -}}
|
|
<div class="{{ $containerClass }}" data-type="{{ $normalizedType }}">
|
|
<div class="{{ $headerClass }}">
|
|
<div class="flex shrink-0 h-5 w-5 items-center justify-center text-lg">
|
|
{{- partial "icon.html" $iconName -}}
|
|
</div>
|
|
<div class="grow">
|
|
{{ $admonitionTitle }}
|
|
</div>
|
|
</div>
|
|
{{- if .Text -}}
|
|
<div class="{{ $contentClass }}">
|
|
{{- .Text | safeHTML -}}
|
|
</div>
|
|
{{- end -}}
|
|
</div>
|
|
{{- end -}}
|
|
|
|
{{- else -}}
|
|
<blockquote
|
|
{{- range $k, $v := .Attributes -}}
|
|
{{- if $v -}}
|
|
{{- printf " %s=%q" $k ($v | transform.HTMLEscape) | safeHTMLAttr -}}
|
|
{{- end -}}
|
|
{{- end -}}>
|
|
{{- .Text | safeHTML -}}
|
|
</blockquote>
|
|
{{- end -}}
|