feat: add hx- prefix to Hextra Tailwind CSS classes (#300)

* feat: add prefix to tailwind css classes

* fix: remove unnecessary prefixes

* fix: add missing prefix in other places

* chore: regenerate hugo_stats.json

* chore: run `npm run build:css`

* chore: add `hx-` prefix to _index.fa.md

* fix: lang switcher display issue

* fix: add `hx-` prefix to showcase/index.fa.md

* fix: lang switch param mistake
This commit is contained in:
Xin
2024-02-20 17:59:31 -05:00
committed by GitHub
parent 0e312d3476
commit 5c7303bee7
63 changed files with 1335 additions and 1340 deletions

View File

@ -8,29 +8,29 @@
{{/* Also allow using "icon" */}}
{{ $icon := .Get "icon" }}
{{ $defaultClass := "border-orange-100 bg-orange-50 text-orange-800 dark:border-orange-400/30 dark:bg-orange-400/20 dark:text-orange-300" }}
{{ $infoClass := "border-blue-200 bg-blue-100 text-blue-900 dark:border-blue-200/30 dark:bg-blue-900/30 dark:text-blue-200" }}
{{ $warningClass := "border-yellow-100 bg-yellow-50 text-yellow-900 dark:border-yellow-200/30 dark:bg-yellow-700/30 dark:text-yellow-200" }}
{{ $errorClass := "border-red-200 bg-red-100 text-red-900 dark:border-red-200/30 dark:bg-red-900/30 dark:text-red-200" }}
{{ $defaultClass := "hx-border-orange-100 hx-bg-orange-50 hx-text-orange-800 dark:hx-border-orange-400/30 dark:hx-bg-orange-400/20 dark:hx-text-orange-300" }}
{{ $infoClass := "hx-border-blue-200 hx-bg-blue-100 hx-text-blue-900 dark:hx-border-blue-200/30 dark:hx-bg-blue-900/30 dark:hx-text-blue-200" }}
{{ $warningClass := "hx-border-yellow-100 hx-bg-yellow-50 hx-text-yellow-900 dark:hx-border-yellow-200/30 dark:hx-bg-yellow-700/30 dark:hx-text-yellow-200" }}
{{ $errorClass := "hx-border-red-200 hx-bg-red-100 hx-text-red-900 dark:hx-border-red-200/30 dark:hx-bg-red-900/30 dark:hx-text-red-200" }}
{{ $class := cond (eq $type "info") $infoClass (cond (eq $type "warning") $warningClass (cond (eq $type "error") $errorClass $defaultClass)) }}
<div class="overflow-x-auto mt-6 flex rounded-lg border py-2 ltr:pr-4 rtl:pl-4 contrast-more:border-current contrast-more:dark:border-current {{ $class }}">
<div class="ltr:pl-3 ltr:pr-2 rtl:pr-3 rtl:pl-2">
<div class="hx-overflow-x-auto hx-mt-6 hx-flex hx-rounded-lg hx-border hx-py-2 ltr:hx-pr-4 rtl:hx-pl-4 contrast-more:hx-border-current contrast-more:dark:hx-border-current {{ $class }}">
<div class="ltr:hx-pl-3 ltr:hx-pr-2 rtl:hx-pr-3 rtl:hx-pl-2">
{{- with $emoji -}}
<div class="select-none text-xl" style="font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';">
<div class="hx-select-none hx-text-xl" style="font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';">
{{ . }}
</div>
{{- else -}}
{{- with $icon }}
{{ partial "utils/icon.html" (dict "name" . "attributes" `height=1.2em class="inline-block align-middle"`) -}}
{{ partial "utils/icon.html" (dict "name" . "attributes" `height=1.2em class="hx-inline-block hx-align-middle"`) -}}
{{- end -}}
{{- end -}}
</div>
<div class="w-full min-w-0 leading-7">
<div class="mt-6 leading-7 first:mt-0">
<div class="hx-w-full hx-min-w-0 hx-leading-7">
<div class="hx-mt-6 hx-leading-7 first:hx-mt-0">
{{ .Inner | markdownify }}
</div>
</div>