diff --git a/exampleSite/hugo_stats.json b/exampleSite/hugo_stats.json index 2d498b3..788b37d 100644 --- a/exampleSite/hugo_stats.json +++ b/exampleSite/hugo_stats.json @@ -141,11 +141,14 @@ "dark:hover:hx-text-gray-50", "dark:hover:hx-text-neutral-50", "dark:hover:hx-text-white", + "dark:hx-bg-amber-900/30", "dark:hx-bg-black/60", "dark:hx-bg-blue-900/30", "dark:hx-bg-dark", "dark:hx-bg-dark/50", "dark:hx-bg-gray-50/10", + "dark:hx-bg-green-900/30", + "dark:hx-bg-indigo-900/30", "dark:hx-bg-neutral-800", "dark:hx-bg-neutral-900", "dark:hx-bg-orange-400/20", @@ -155,9 +158,12 @@ "dark:hx-bg-red-900/30", "dark:hx-bg-yellow-700/30", "dark:hx-block", + "dark:hx-border-amber-200/30", "dark:hx-border-blue-200/30", "dark:hx-border-gray-100/20", "dark:hx-border-gray-400", + "dark:hx-border-green-200/30", + "dark:hx-border-indigo-200/30", "dark:hx-border-neutral-700", "dark:hx-border-neutral-800", "dark:hx-border-orange-400/30", @@ -171,12 +177,15 @@ "dark:hx-shadow-[0_-12px_16px_#111]", "dark:hx-shadow-[0_-1px_0_rgba(255,255,255,.1)_inset]", "dark:hx-shadow-none", + "dark:hx-text-amber-200", "dark:hx-text-blue-200", "dark:hx-text-gray-100", "dark:hx-text-gray-200", "dark:hx-text-gray-300", "dark:hx-text-gray-400", "dark:hx-text-gray-50", + "dark:hx-text-green-200", + "dark:hx-text-indigo-200", "dark:hx-text-neutral-200", "dark:hx-text-neutral-400", "dark:hx-text-orange-300", @@ -256,15 +265,19 @@ "hover:hx-text-primary-600", "hx-absolute", "hx-align-[-2.5px]", + "hx-align-middle", "hx-align-text-bottom", "hx-appearance-none", "hx-aspect-auto", + "hx-bg-amber-100", "hx-bg-black/80", "hx-bg-black/[.05]", "hx-bg-blue-100", "hx-bg-clip-text", "hx-bg-gradient-to-r", "hx-bg-gray-100", + "hx-bg-green-100", + "hx-bg-indigo-100", "hx-bg-neutral-50", "hx-bg-orange-50", "hx-bg-primary-100", @@ -277,12 +290,15 @@ "hx-bg-yellow-50", "hx-block", "hx-border", + "hx-border-amber-200", "hx-border-b", "hx-border-b-2", "hx-border-black/5", "hx-border-blue-200", "hx-border-gray-200", "hx-border-gray-500", + "hx-border-green-200", + "hx-border-indigo-200", "hx-border-orange-100", "hx-border-red-200", "hx-border-t", @@ -468,6 +484,7 @@ "hx-text-[.65rem]", "hx-text-[10px]", "hx-text-[color:hsl(var(--primary-hue),100%,50%)]", + "hx-text-amber-900", "hx-text-base", "hx-text-blue-900", "hx-text-center", @@ -479,6 +496,8 @@ "hx-text-gray-700", "hx-text-gray-800", "hx-text-gray-900", + "hx-text-green-900", + "hx-text-indigo-900", "hx-text-left", "hx-text-lg", "hx-text-orange-800", diff --git a/layouts/_default/_markup/render-blockquote-alert.html b/layouts/_default/_markup/render-blockquote-alert.html index b8dc8a4..66518fc 100644 --- a/layouts/_default/_markup/render-blockquote-alert.html +++ b/layouts/_default/_markup/render-blockquote-alert.html @@ -1,20 +1,9 @@ -{{- $supportedAlertTypes := slice "note" "tip" "important" "warning" "caution" -}} -{{- $emojis := dict - "note" ":memo:" - "tip" ":bulb:" - "important" ":information_source:" - "warning" ":warning:" - "caution" ":exclamation:" --}} - -{{- if not (in $supportedAlertTypes .AlertType) -}} -
- {{- .Text -}} -
-{{- else -}} - {{- $emoji := emojify (index $emojis .AlertType) -}} - {{- $content := .Text -}} - {{- $icon := "" -}} - {{- $class := "" -}} - {{- partial "shortcodes/callout.html" (dict "content" $content "emoji" $emoji "icon" $icon "class" $class) -}} +{{- if not (in (slice "note" "tip" "important" "warning" "caution") .AlertType) -}} + {{- warnf "Alert type %s is not supported" .AlertType -}} {{- end -}} + +{{- $content := .Text -}} +{{- $alertType := .AlertType -}} +{{- $alertTitle := .AlertTitle -}} + +{{- partial "components/github-style-alert.html" (dict "content" $content "alertType" $alertType "alertTitle" $alertTitle) -}} diff --git a/layouts/partials/components/github-style-alert.html b/layouts/partials/components/github-style-alert.html new file mode 100644 index 0000000..9b8e71c --- /dev/null +++ b/layouts/partials/components/github-style-alert.html @@ -0,0 +1,42 @@ +{{- $content := .content -}} +{{- $alertType := .alertType -}} +{{- $alertTitle := .alertTitle -}} + +{{- $icons := dict + "note" "information-circle" + "tip" "light-bulb" + "important" "information-circle" + "warning" "exclamation" + "caution" "exclamation-circle" +-}} + +{{- $icon := index $icons $alertType -}} +{{- $title := or $alertTitle (or (i18n $alertType) (title $alertType)) -}} + +{{- $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" }} + +{{- $alertClasses := dict + "note" "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" + "tip" "hx-border-green-200 hx-bg-green-100 hx-text-green-900 dark:hx-border-green-200/30 dark:hx-bg-green-900/30 dark:hx-text-green-200" + "important" "hx-border-indigo-200 hx-bg-indigo-100 hx-text-indigo-900 dark:hx-border-indigo-200/30 dark:hx-bg-indigo-900/30 dark:hx-text-indigo-200" + "warning" "hx-border-amber-200 hx-bg-amber-100 hx-text-amber-900 dark:hx-border-amber-200/30 dark:hx-bg-amber-900/30 dark:hx-text-amber-200" + "caution" "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 := index $alertClasses $alertType | default $defaultClass -}} + + +
+

+ {{- with $icon -}} + {{- partial "utils/icon.html" (dict "name" . "attributes" `height=16px class="hx-inline-block hx-align-middle hx-mr-2"`) -}} + {{- end -}} + {{- $title -}} +

+ +
+
+ {{- $content -}} +
+
+
diff --git a/tailwind.config.js b/tailwind.config.js index 0eee071..0331f72 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -61,8 +61,11 @@ module.exports = { neutral: colors.neutral, red: colors.red, orange: colors.orange, + green: colors.green, + indigo: colors.indigo, blue: colors.blue, yellow: colors.yellow, + amber: colors.amber, primary: { 50: makePrimaryColor(97), 100: makePrimaryColor(94),