diff --git a/assets/css/compiled/main.css b/assets/css/compiled/main.css index 48aef6db..13d4db61 100644 --- a/assets/css/compiled/main.css +++ b/assets/css/compiled/main.css @@ -485,7 +485,7 @@ video { --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; } -.sr-only { +.hx-sr-only { position: absolute; width: 1px; height: 1px; @@ -496,923 +496,917 @@ video { white-space: nowrap; border-width: 0; } -.pointer-events-none { +.hx-pointer-events-none { pointer-events: none; } -.fixed { +.hx-fixed { position: fixed; } -.absolute { +.hx-absolute { position: absolute; } -.relative { +.hx-relative { position: relative; } -.sticky { +.hx-sticky { position: sticky; } -.inset-0 { +.hx-inset-0 { inset: 0px; } -.inset-x-0 { +.hx-inset-x-0 { left: 0px; right: 0px; } -.inset-y-0 { +.hx-inset-y-0 { top: 0px; bottom: 0px; } -.bottom-0 { +.hx-bottom-0 { bottom: 0px; } -.left-\[24px\] { +.hx-left-\[24px\] { left: 24px; } -.left-\[36px\] { +.hx-left-\[36px\] { left: 36px; } -.right-0 { +.hx-right-0 { right: 0px; } -.top-0 { +.hx-top-0 { top: 0px; } -.top-16 { +.hx-top-16 { top: 4rem; } -.top-8 { +.hx-top-8 { top: 2rem; } -.top-\[40\%\] { +.hx-top-\[40\%\] { top: 40%; } -.top-full { +.hx-top-full { top: 100%; } -.z-10 { +.hx-z-10 { z-index: 10; } -.z-20 { +.hx-z-20 { z-index: 20; } -.z-\[-1\] { +.hx-z-\[-1\] { z-index: -1; } -.order-last { +.hx-order-last { order: 9999; } -.m-\[11px\] { +.hx-m-\[11px\] { margin: 11px; } -.mx-1 { +.hx-mx-1 { margin-left: 0.25rem; margin-right: 0.25rem; } -.mx-2 { +.hx-mx-2 { margin-left: 0.5rem; margin-right: 0.5rem; } -.mx-4 { +.hx-mx-4 { margin-left: 1rem; margin-right: 1rem; } -.mx-auto { +.hx-mx-auto { margin-left: auto; margin-right: auto; } -.my-1 { +.hx-my-1 { margin-top: 0.25rem; margin-bottom: 0.25rem; } -.my-1\.5 { +.hx-my-1\.5 { margin-top: 0.375rem; margin-bottom: 0.375rem; } -.my-2 { +.hx-my-2 { margin-top: 0.5rem; margin-bottom: 0.5rem; } -.-mb-0 { +.-hx-mb-0 { margin-bottom: -0px; } -.-mb-0\.5 { +.-hx-mb-0\.5 { margin-bottom: -0.125rem; } -.-ml-2 { +.-hx-ml-2 { margin-left: -0.5rem; } -.-mr-2 { +.-hx-mr-2 { margin-right: -0.5rem; } -.-mt-20 { +.-hx-mt-20 { margin-top: -5rem; } -.mb-10 { +.hx-mb-10 { margin-bottom: 2.5rem; } -.mb-12 { +.hx-mb-12 { margin-bottom: 3rem; } -.mb-16 { +.hx-mb-16 { margin-bottom: 4rem; } -.mb-2 { +.hx-mb-2 { margin-bottom: 0.5rem; } -.mb-4 { +.hx-mb-4 { margin-bottom: 1rem; } -.mb-6 { +.hx-mb-6 { margin-bottom: 1.5rem; } -.mb-8 { +.hx-mb-8 { margin-bottom: 2rem; } -.ml-1 { +.hx-ml-1 { margin-left: 0.25rem; } -.ml-4 { +.hx-ml-4 { margin-left: 1rem; } -.mr-1 { +.hx-mr-1 { margin-right: 0.25rem; } -.mr-2 { +.hx-mr-2 { margin-right: 0.5rem; } -.mt-1 { +.hx-mt-1 { margin-top: 0.25rem; } -.mt-1\.5 { +.hx-mt-1\.5 { margin-top: 0.375rem; } -.mt-12 { +.hx-mt-12 { margin-top: 3rem; } -.mt-16 { +.hx-mt-16 { margin-top: 4rem; } -.mt-2 { +.hx-mt-2 { margin-top: 0.5rem; } -.mt-4 { +.hx-mt-4 { margin-top: 1rem; } -.mt-5 { +.hx-mt-5 { margin-top: 1.25rem; } -.mt-6 { +.hx-mt-6 { margin-top: 1.5rem; } -.mt-8 { +.hx-mt-8 { margin-top: 2rem; } -.line-clamp-3 { +.hx-line-clamp-3 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } -.block { +.hx-block { display: block; } -.inline-block { +.hx-inline-block { display: inline-block; } -.inline { +.hx-inline { display: inline; } -.flex { +.hx-flex { display: flex; } -.inline-flex { +.hx-inline-flex { display: inline-flex; } -.table { - display: table; -} -.grid { +.hx-grid { display: grid; } -.hidden { +.hx-hidden { display: none; } -.aspect-auto { +.hx-aspect-auto { aspect-ratio: auto; } -.h-0 { +.hx-h-0 { height: 0px; } -.h-16 { +.hx-h-16 { height: 4rem; } -.h-2 { +.hx-h-2 { height: 0.5rem; } -.h-3 { +.hx-h-3 { height: 0.75rem; } -.h-3\.5 { +.hx-h-3\.5 { height: 0.875rem; } -.h-4 { +.hx-h-4 { height: 1rem; } -.h-5 { +.hx-h-5 { height: 1.25rem; } -.h-7 { +.hx-h-7 { height: 1.75rem; } -.h-\[18px\] { +.hx-h-\[18px\] { height: 18px; } -.h-full { +.hx-h-full { height: 100%; } -.max-h-64 { +.hx-max-h-64 { max-height: 16rem; } -.max-h-\[calc\(100vh-var\(--navbar-height\)-env\(safe-area-inset-bottom\)\)\] { +.hx-max-h-\[calc\(100vh-var\(--navbar-height\)-env\(safe-area-inset-bottom\)\)\] { max-height: calc(100vh - var(--navbar-height) - env(safe-area-inset-bottom)); } -.max-h-\[min\(calc\(50vh-11rem-env\(safe-area-inset-bottom\)\)\2c 400px\)\] { +.hx-max-h-\[min\(calc\(50vh-11rem-env\(safe-area-inset-bottom\)\)\,400px\)\] { max-height: min(calc(50vh - 11rem - env(safe-area-inset-bottom)),400px); } -.min-h-\[100px\] { +.hx-min-h-\[100px\] { min-height: 100px; } -.min-h-\[calc\(100vh-var\(--navbar-height\)\)\] { +.hx-min-h-\[calc\(100vh-var\(--navbar-height\)\)\] { min-height: calc(100vh - var(--navbar-height)); } -.w-2 { +.hx-w-2 { width: 0.5rem; } -.w-3 { +.hx-w-3 { width: 0.75rem; } -.w-3\.5 { +.hx-w-3\.5 { width: 0.875rem; } -.w-4 { +.hx-w-4 { width: 1rem; } -.w-64 { +.hx-w-64 { width: 16rem; } -.w-\[110\%\] { +.hx-w-\[110\%\] { width: 110%; } -.w-\[180\%\] { +.hx-w-\[180\%\] { width: 180%; } -.w-full { +.hx-w-full { width: 100%; } -.w-max { +.hx-w-max { width: -moz-max-content; width: max-content; } -.w-screen { +.hx-w-screen { width: 100vw; } -.min-w-0 { +.hx-min-w-0 { min-width: 0px; } -.min-w-\[18px\] { +.hx-min-w-\[18px\] { min-width: 18px; } -.min-w-\[24px\] { +.hx-min-w-\[24px\] { min-width: 24px; } -.min-w-full { +.hx-min-w-full { min-width: 100%; } -.max-w-6xl { +.hx-max-w-6xl { max-width: 72rem; } -.max-w-\[50\%\] { +.hx-max-w-\[50\%\] { max-width: 50%; } -.max-w-\[90rem\] { +.hx-max-w-\[90rem\] { max-width: 90rem; } -.max-w-\[min\(calc\(100vw-2rem\)\2c calc\(100\%\+20rem\)\)\] { +.hx-max-w-\[min\(calc\(100vw-2rem\)\,calc\(100\%\+20rem\)\)\] { max-width: min(calc(100vw - 2rem),calc(100% + 20rem)); } -.max-w-full { - max-width: 100%; -} -.max-w-none { +.hx-max-w-none { max-width: none; } -.max-w-screen-xl { +.hx-max-w-screen-xl { max-width: 1280px; } -.shrink-0 { +.hx-shrink-0 { flex-shrink: 0; } -.grow { +.hx-grow { flex-grow: 1; } -.origin-center { +.hx-origin-center { transform-origin: center; } -.cursor-default { +.hx-cursor-default { cursor: default; } -.cursor-pointer { +.hx-cursor-pointer { cursor: pointer; } -.select-none { +.hx-select-none { -webkit-user-select: none; -moz-user-select: none; user-select: none; } -.scroll-my-6 { +.hx-scroll-my-6 { scroll-margin-top: 1.5rem; scroll-margin-bottom: 1.5rem; } -.scroll-py-6 { +.hx-scroll-py-6 { scroll-padding-top: 1.5rem; scroll-padding-bottom: 1.5rem; } -.list-none { +.hx-list-none { list-style-type: none; } -.appearance-none { +.hx-appearance-none { -webkit-appearance: none; -moz-appearance: none; appearance: none; } -.grid-cols-1 { +.hx-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } -.flex-col { +.hx-flex-col { flex-direction: column; } -.flex-wrap { +.hx-flex-wrap { flex-wrap: wrap; } -.items-start { +.hx-items-start { align-items: flex-start; } -.items-center { +.hx-items-center { align-items: center; } -.justify-start { +.hx-justify-start { justify-content: flex-start; } -.justify-end { +.hx-justify-end { justify-content: flex-end; } -.justify-center { +.hx-justify-center { justify-content: center; } -.justify-between { +.hx-justify-between { justify-content: space-between; } -.justify-items-start { +.hx-justify-items-start { justify-items: start; } -.gap-1 { +.hx-gap-1 { gap: 0.25rem; } -.gap-2 { +.hx-gap-2 { gap: 0.5rem; } -.gap-4 { +.hx-gap-4 { gap: 1rem; } -.gap-x-1 { +.hx-gap-x-1 { -moz-column-gap: 0.25rem; column-gap: 0.25rem; } -.gap-x-1\.5 { +.hx-gap-x-1\.5 { -moz-column-gap: 0.375rem; column-gap: 0.375rem; } -.gap-y-2 { +.hx-gap-y-2 { row-gap: 0.5rem; } -.overflow-auto { +.hx-overflow-auto { overflow: auto; } -.overflow-hidden { +.hx-overflow-hidden { overflow: hidden; } -.overflow-x-auto { +.hx-overflow-x-auto { overflow-x: auto; } -.overflow-y-auto { +.hx-overflow-y-auto { overflow-y: auto; } -.overflow-x-hidden { +.hx-overflow-x-hidden { overflow-x: hidden; } -.overscroll-contain { +.hx-overscroll-contain { overscroll-behavior: contain; } -.text-ellipsis { +.hx-text-ellipsis { text-overflow: ellipsis; } -.whitespace-nowrap { +.hx-whitespace-nowrap { white-space: nowrap; } -.break-words { +.hx-break-words { overflow-wrap: break-word; } -.rounded { +.hx-rounded { border-radius: 0.25rem; } -.rounded-3xl { +.hx-rounded-3xl { border-radius: 1.5rem; } -.rounded-full { +.hx-rounded-full { border-radius: 9999px; } -.rounded-lg { +.hx-rounded-lg { border-radius: 0.5rem; } -.rounded-md { +.hx-rounded-md { border-radius: 0.375rem; } -.rounded-sm { +.hx-rounded-sm { border-radius: 0.125rem; } -.rounded-xl { +.hx-rounded-xl { border-radius: 0.75rem; } -.rounded-t { +.hx-rounded-t { border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem; } -.border { +.hx-border { border-width: 1px; } -.border-b { +.hx-border-b { border-bottom-width: 1px; } -.border-b-2 { +.hx-border-b-2 { border-bottom-width: 2px; } -.border-l { +.hx-border-l { border-left-width: 1px; } -.border-t { +.hx-border-t { border-top-width: 1px; } -.border-black\/5 { +.hx-border-black\/5 { border-color: rgb(0 0 0 / 0.05); } -.border-blue-200 { +.hx-border-blue-200 { --tw-border-opacity: 1; border-color: rgb(191 219 254 / var(--tw-border-opacity)); } -.border-gray-200 { +.hx-border-gray-200 { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity)); } -.border-gray-500 { +.hx-border-gray-500 { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity)); } -.border-orange-100 { +.hx-border-orange-100 { --tw-border-opacity: 1; border-color: rgb(255 237 213 / var(--tw-border-opacity)); } -.border-red-200 { +.hx-border-red-200 { --tw-border-opacity: 1; border-color: rgb(254 202 202 / var(--tw-border-opacity)); } -.border-transparent { +.hx-border-transparent { border-color: transparent; } -.border-yellow-100 { +.hx-border-yellow-100 { --tw-border-opacity: 1; border-color: rgb(254 249 195 / var(--tw-border-opacity)); } -.bg-black\/80 { +.hx-bg-black\/80 { background-color: rgb(0 0 0 / 0.8); } -.bg-black\/\[\.05\] { +.hx-bg-black\/\[\.05\] { background-color: rgb(0 0 0 / .05); } -.bg-blue-100 { +.hx-bg-blue-100 { --tw-bg-opacity: 1; background-color: rgb(219 234 254 / var(--tw-bg-opacity)); } -.bg-gray-100 { +.hx-bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity)); } -.bg-neutral-50 { +.hx-bg-neutral-50 { --tw-bg-opacity: 1; background-color: rgb(250 250 250 / var(--tw-bg-opacity)); } -.bg-orange-50 { +.hx-bg-orange-50 { --tw-bg-opacity: 1; background-color: rgb(255 247 237 / var(--tw-bg-opacity)); } -.bg-primary-100 { +.hx-bg-primary-100 { --tw-bg-opacity: 1; background-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / var(--tw-bg-opacity)); } -.bg-primary-400 { +.hx-bg-primary-400 { --tw-bg-opacity: 1; background-color: hsl(var(--primary-hue) var(--primary-saturation) 66% / var(--tw-bg-opacity)); } -.bg-primary-600 { +.hx-bg-primary-600 { --tw-bg-opacity: 1; background-color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-bg-opacity)); } -.bg-primary-700\/5 { +.hx-bg-primary-700\/5 { background-color: hsl(var(--primary-hue) var(--primary-saturation) 39% / 0.05); } -.bg-red-100 { +.hx-bg-red-100 { --tw-bg-opacity: 1; background-color: rgb(254 226 226 / var(--tw-bg-opacity)); } -.bg-transparent { +.hx-bg-transparent { background-color: transparent; } -.bg-white { +.hx-bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } -.bg-yellow-50 { +.hx-bg-yellow-50 { --tw-bg-opacity: 1; background-color: rgb(254 252 232 / var(--tw-bg-opacity)); } -.bg-gradient-to-r { +.hx-bg-gradient-to-r { background-image: linear-gradient(to right, var(--tw-gradient-stops)); } -.from-gray-900 { +.hx-from-gray-900 { --tw-gradient-from: #111827 var(--tw-gradient-from-position); --tw-gradient-to: rgb(17 24 39 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } -.to-gray-600 { +.hx-to-gray-600 { --tw-gradient-to: #4b5563 var(--tw-gradient-to-position); } -.bg-clip-text { +.hx-bg-clip-text { -webkit-background-clip: text; background-clip: text; } -.p-0 { +.hx-p-0 { padding: 0px; } -.p-0\.5 { +.hx-p-0\.5 { padding: 0.125rem; } -.p-1 { +.hx-p-1 { padding: 0.25rem; } -.p-1\.5 { +.hx-p-1\.5 { padding: 0.375rem; } -.p-2 { +.hx-p-2 { padding: 0.5rem; } -.p-4 { +.hx-p-4 { padding: 1rem; } -.p-6 { +.hx-p-6 { padding: 1.5rem; } -.px-1 { +.hx-px-1 { padding-left: 0.25rem; padding-right: 0.25rem; } -.px-1\.5 { +.hx-px-1\.5 { padding-left: 0.375rem; padding-right: 0.375rem; } -.px-2 { +.hx-px-2 { padding-left: 0.5rem; padding-right: 0.5rem; } -.px-3 { +.hx-px-3 { padding-left: 0.75rem; padding-right: 0.75rem; } -.px-4 { +.hx-px-4 { padding-left: 1rem; padding-right: 1rem; } -.px-6 { +.hx-px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } -.py-1 { +.hx-py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; } -.py-1\.5 { +.hx-py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; } -.py-12 { +.hx-py-12 { padding-top: 3rem; padding-bottom: 3rem; } -.py-2 { +.hx-py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; } -.py-2\.5 { +.hx-py-2\.5 { padding-top: 0.625rem; padding-bottom: 0.625rem; } -.py-3 { +.hx-py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; } -.py-4 { +.hx-py-4 { padding-top: 1rem; padding-bottom: 1rem; } -.pb-8 { +.hx-pb-8 { padding-bottom: 2rem; } -.pb-\[env\(safe-area-inset-bottom\)\] { +.hx-pb-\[env\(safe-area-inset-bottom\)\] { padding-bottom: env(safe-area-inset-bottom); } -.pb-px { +.hx-pb-px { padding-bottom: 1px; } -.pl-5 { +.hx-pl-5 { padding-left: 1.25rem; } -.pl-6 { +.hx-pl-6 { padding-left: 1.5rem; } -.pl-\[max\(env\(safe-area-inset-left\)\2c 1\.5rem\)\] { +.hx-pl-\[max\(env\(safe-area-inset-left\)\,1\.5rem\)\] { padding-left: max(env(safe-area-inset-left),1.5rem); } -.pr-2 { +.hx-pr-2 { padding-right: 0.5rem; } -.pr-4 { +.hx-pr-4 { padding-right: 1rem; } -.pr-\[calc\(env\(safe-area-inset-right\)-1\.5rem\)\] { +.hx-pr-\[calc\(env\(safe-area-inset-right\)-1\.5rem\)\] { padding-right: calc(env(safe-area-inset-right) - 1.5rem); } -.pr-\[max\(env\(safe-area-inset-left\)\2c 1\.5rem\)\] { +.hx-pr-\[max\(env\(safe-area-inset-left\)\,1\.5rem\)\] { padding-right: max(env(safe-area-inset-left),1.5rem); } -.pr-\[max\(env\(safe-area-inset-right\)\2c 1\.5rem\)\] { +.hx-pr-\[max\(env\(safe-area-inset-right\)\,1\.5rem\)\] { padding-right: max(env(safe-area-inset-right),1.5rem); } -.pt-4 { +.hx-pt-4 { padding-top: 1rem; } -.pt-6 { +.hx-pt-6 { padding-top: 1.5rem; } -.pt-8 { +.hx-pt-8 { padding-top: 2rem; } -.text-left { +.hx-text-left { text-align: left; } -.text-center { +.hx-text-center { text-align: center; } -.align-text-bottom { +.hx-align-text-bottom { vertical-align: text-bottom; } -.align-\[-2\.5px\] { +.hx-align-\[-2\.5px\] { vertical-align: -2.5px; } -.font-mono { +.hx-font-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; } -.text-2xl { +.hx-text-2xl { font-size: 1.5rem; } -.text-4xl { +.hx-text-4xl { font-size: 2.25rem; } -.text-\[10px\] { +.hx-text-\[10px\] { font-size: 10px; } -.text-base { +.hx-text-base { font-size: 1rem; } -.text-lg { +.hx-text-lg { font-size: 1.125rem; } -.text-sm { +.hx-text-sm { font-size: .875rem; } -.text-xl { +.hx-text-xl { font-size: 1.25rem; } -.text-xs { +.hx-text-xs { font-size: .75rem; } -.font-bold { +.hx-font-bold { font-weight: 700; } -.font-extrabold { +.hx-font-extrabold { font-weight: 800; } -.font-medium { +.hx-font-medium { font-weight: 500; } -.font-normal { +.hx-font-normal { font-weight: 400; } -.font-semibold { +.hx-font-semibold { font-weight: 600; } -.capitalize { +.hx-capitalize { text-transform: capitalize; } -.leading-5 { +.hx-leading-5 { line-height: 1.25rem; } -.leading-6 { +.hx-leading-6 { line-height: 1.5rem; } -.leading-7 { +.hx-leading-7 { line-height: 1.75rem; } -.leading-none { +.hx-leading-none { line-height: 1; } -.leading-tight { +.hx-leading-tight { line-height: 1.25; } -.tracking-tight { +.hx-tracking-tight { letter-spacing: -0.015em; } -.text-\[color\:hsl\(var\(--primary-hue\)\2c 100\%\2c 50\%\)\] { +.hx-text-\[color\:hsl\(var\(--primary-hue\)\,100\%\,50\%\)\] { --tw-text-opacity: 1; color: hsl(var(--primary-hue) 100% 50% / var(--tw-text-opacity)); } -.text-blue-900 { +.hx-text-blue-900 { --tw-text-opacity: 1; color: rgb(30 58 138 / var(--tw-text-opacity)); } -.text-current { +.hx-text-current { color: currentColor; } -.text-gray-100 { +.hx-text-gray-100 { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity)); } -.text-gray-500 { +.hx-text-gray-500 { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity)); } -.text-gray-600 { +.hx-text-gray-600 { --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity)); } -.text-gray-700 { +.hx-text-gray-700 { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity)); } -.text-gray-800 { +.hx-text-gray-800 { --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity)); } -.text-gray-900 { +.hx-text-gray-900 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity)); } -.text-orange-800 { +.hx-text-orange-800 { --tw-text-opacity: 1; color: rgb(154 52 18 / var(--tw-text-opacity)); } -.text-primary-800 { +.hx-text-primary-800 { --tw-text-opacity: 1; color: hsl(var(--primary-hue) var(--primary-saturation) 32% / var(--tw-text-opacity)); } -.text-red-900 { +.hx-text-red-900 { --tw-text-opacity: 1; color: rgb(127 29 29 / var(--tw-text-opacity)); } -.text-slate-900 { +.hx-text-slate-900 { --tw-text-opacity: 1; color: rgb(15 23 42 / var(--tw-text-opacity)); } -.text-transparent { +.hx-text-transparent { color: transparent; } -.text-white { +.hx-text-white { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } -.text-yellow-900 { +.hx-text-yellow-900 { --tw-text-opacity: 1; color: rgb(113 63 18 / var(--tw-text-opacity)); } -.underline { +.hx-underline { text-decoration-line: underline; } -.no-underline { +.hx-no-underline { text-decoration-line: none; } -.decoration-from-font { +.hx-decoration-from-font { text-decoration-thickness: from-font; } -.underline-offset-2 { +.hx-underline-offset-2 { text-underline-offset: 2px; } -.opacity-0 { +.hx-opacity-0 { opacity: 0; } -.opacity-50 { +.hx-opacity-50 { opacity: 0.5; } -.opacity-80 { +.hx-opacity-80 { opacity: 0.8; } -.shadow { +.hx-shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.shadow-\[0_-12px_16px_\#fff\] { +.hx-shadow-\[0_-12px_16px_\#fff\] { --tw-shadow: 0 -12px 16px #fff; --tw-shadow-colored: 0 -12px 16px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.shadow-\[0_-12px_16px_white\] { +.hx-shadow-\[0_-12px_16px_white\] { --tw-shadow: 0 -12px 16px white; --tw-shadow-colored: 0 -12px 16px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.shadow-\[0_2px_4px_rgba\(0\2c 0\2c 0\2c \.02\)\2c 0_1px_0_rgba\(0\2c 0\2c 0\2c \.06\)\] { +.hx-shadow-\[0_2px_4px_rgba\(0\,0\,0\,\.02\)\,0_1px_0_rgba\(0\,0\,0\,\.06\)\] { --tw-shadow: 0 2px 4px rgba(0,0,0,.02),0 1px 0 rgba(0,0,0,.06); --tw-shadow-colored: 0 2px 4px var(--tw-shadow-color), 0 1px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.shadow-lg { +.hx-shadow-lg { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.shadow-sm { +.hx-shadow-sm { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.shadow-xl { +.hx-shadow-xl { --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.shadow-gray-100 { +.hx-shadow-gray-100 { --tw-shadow-color: #f3f4f6; --tw-shadow: var(--tw-shadow-colored); } -.ring-1 { +.hx-ring-1 { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); } -.ring-black\/5 { +.hx-ring-black\/5 { --tw-ring-color: rgb(0 0 0 / 0.05); } -.transition { +.hx-transition { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } -.transition-all { +.hx-transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } -.transition-colors { +.hx-transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } -.transition-opacity { +.hx-transition-opacity { transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } -.transition-transform { +.hx-transition-transform { transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } -.duration-200 { +.hx-duration-200 { transition-duration: 200ms; } -.duration-75 { +.hx-duration-75 { transition-duration: 75ms; } -.ease-in { +.hx-ease-in { transition-timing-function: cubic-bezier(0.4, 0, 1, 1); } .\[-webkit-tap-highlight-color\:transparent\] { @@ -1701,8 +1695,8 @@ video { margin-top: 0.5rem; margin-bottom: 0.5rem; } -/* This CSS rule targets the first nested unordered (ul) or ordered (ol) list - inside the list item (li) of any parent ul or ol. +/* This CSS rule targets the first nested unordered (ul) or ordered (ol) list + inside the list item (li) of any parent ul or ol. The rule sets the top margin of the selected list to zero. */ .content :where(ul, ol) > li > :where(ul, ol):not(:where([class~=not-prose],[class~=not-prose] *)) { margin-top: 0px; @@ -1800,7 +1794,7 @@ article details > summary::-webkit-details-marker { display: none; } article details > summary::before { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-5 w-5' viewBox='0 0 20 20' fill='currentColor'%3E%3Cpath fill-rule='evenodd' d='M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z' clip-rule='evenodd' /%3E%3C/svg%3E"); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='hx-h-5 hx-w-5' viewBox='0 0 20 20' fill='currentColor'%3E%3Cpath fill-rule='evenodd' d='M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z' clip-rule='evenodd' /%3E%3C/svg%3E"); height: 1.2em; width: 1.2em; vertical-align: -4px; @@ -2585,776 +2579,776 @@ body { --primary-hue: 204deg; --primary-saturation: 100%; } -.placeholder\:text-gray-500::-moz-placeholder { +.placeholder\:hx-text-gray-500::-moz-placeholder { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity)); } -.placeholder\:text-gray-500::placeholder { +.placeholder\:hx-text-gray-500::placeholder { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity)); } -.before\:pointer-events-none::before { +.before\:hx-pointer-events-none::before { content: var(--tw-content); pointer-events: none; } -.before\:absolute::before { +.before\:hx-absolute::before { content: var(--tw-content); position: absolute; } -.before\:inset-0::before { +.before\:hx-inset-0::before { content: var(--tw-content); inset: 0px; } -.before\:inset-y-1::before { +.before\:hx-inset-y-1::before { content: var(--tw-content); top: 0.25rem; bottom: 0.25rem; } -.before\:mr-1::before { +.before\:hx-mr-1::before { content: var(--tw-content); margin-right: 0.25rem; } -.before\:inline-block::before { +.before\:hx-inline-block::before { content: var(--tw-content); display: inline-block; } -.before\:w-px::before { +.before\:hx-w-px::before { content: var(--tw-content); width: 1px; } -.before\:bg-gray-200::before { +.before\:hx-bg-gray-200::before { content: var(--tw-content); --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity)); } -.before\:opacity-25::before { +.before\:hx-opacity-25::before { content: var(--tw-content); opacity: 0.25; } -.before\:transition-transform::before { +.before\:hx-transition-transform::before { content: var(--tw-content); transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } -.before\:content-\[\'\#\'\]::before { +.before\:hx-content-\[\'\#\'\]::before { --tw-content: '#'; content: var(--tw-content); } -.before\:content-\[\'\'\]::before { +.before\:hx-content-\[\'\'\]::before { --tw-content: ''; content: var(--tw-content); } -.before\:content-\[\\\"\\\"\]::before { +.before\:hx-content-\[\\\"\\\"\]::before { --tw-content: \"\"; content: var(--tw-content); } -.first\:mt-0:first-child { +.first\:hx-mt-0:first-child { margin-top: 0px; } -.last-of-type\:mb-0:last-of-type { +.last-of-type\:hx-mb-0:last-of-type { margin-bottom: 0px; } -.hover\:border-gray-200:hover { +.hover\:hx-border-gray-200:hover { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity)); } -.hover\:border-gray-300:hover { +.hover\:hx-border-gray-300:hover { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity)); } -.hover\:border-gray-400:hover { +.hover\:hx-border-gray-400:hover { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity)); } -.hover\:border-gray-900:hover { +.hover\:hx-border-gray-900:hover { --tw-border-opacity: 1; border-color: rgb(17 24 39 / var(--tw-border-opacity)); } -.hover\:bg-gray-100:hover { +.hover\:hx-bg-gray-100:hover { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity)); } -.hover\:bg-gray-800\/5:hover { +.hover\:hx-bg-gray-800\/5:hover { background-color: rgb(31 41 55 / 0.05); } -.hover\:bg-primary-50:hover { +.hover\:hx-bg-primary-50:hover { --tw-bg-opacity: 1; background-color: hsl(var(--primary-hue) var(--primary-saturation) 97% / var(--tw-bg-opacity)); } -.hover\:bg-primary-700:hover { +.hover\:hx-bg-primary-700:hover { --tw-bg-opacity: 1; background-color: hsl(var(--primary-hue) var(--primary-saturation) 39% / var(--tw-bg-opacity)); } -.hover\:bg-slate-50:hover { +.hover\:hx-bg-slate-50:hover { --tw-bg-opacity: 1; background-color: rgb(248 250 252 / var(--tw-bg-opacity)); } -.hover\:text-black:hover { +.hover\:hx-text-black:hover { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); } -.hover\:text-gray-800:hover { +.hover\:hx-text-gray-800:hover { --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity)); } -.hover\:text-gray-900:hover { +.hover\:hx-text-gray-900:hover { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity)); } -.hover\:text-primary-600:hover { +.hover\:hx-text-primary-600:hover { --tw-text-opacity: 1; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity)); } -.hover\:opacity-60:hover { +.hover\:hx-opacity-60:hover { opacity: 0.6; } -.hover\:opacity-75:hover { +.hover\:hx-opacity-75:hover { opacity: 0.75; } -.hover\:shadow-lg:hover { +.hover\:hx-shadow-lg:hover { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.hover\:shadow-md:hover { +.hover\:hx-shadow-md:hover { --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.hover\:shadow-gray-100:hover { +.hover\:hx-shadow-gray-100:hover { --tw-shadow-color: #f3f4f6; --tw-shadow: var(--tw-shadow-colored); } -.focus\:bg-white:focus { +.focus\:hx-bg-white:focus { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } -.focus\:outline-none:focus { +.focus\:hx-outline-none:focus { outline: 2px solid transparent; outline-offset: 2px; } -.focus\:ring-4:focus { +.focus\:hx-ring-4:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); } -.focus\:ring-primary-300:focus { +.focus\:hx-ring-primary-300:focus { --tw-ring-opacity: 1; --tw-ring-color: hsl(var(--primary-hue) var(--primary-saturation) 77% / var(--tw-ring-opacity)); } -.active\:bg-gray-400\/20:active { +.active\:hx-bg-gray-400\/20:active { background-color: rgb(156 163 175 / 0.2); } -.active\:opacity-50:active { +.active\:hx-opacity-50:active { opacity: 0.5; } -.active\:shadow-sm:active { +.active\:hx-shadow-sm:active { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.active\:shadow-gray-200:active { +.active\:hx-shadow-gray-200:active { --tw-shadow-color: #e5e7eb; --tw-shadow: var(--tw-shadow-colored); } -.group[open] .group-open\:before\:rotate-90::before { +.hx-group[open] .group-open\:before\:hx-rotate-90::before { content: var(--tw-content); --tw-rotate: 90deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } -.group:hover .group-hover\:underline { +.hx-group:hover .group-hover\:hx-underline { text-decoration-line: underline; } -.group\/code:hover .group-hover\/code\:opacity-100 { +.hx-group\/code:hover .group-hover\/code\:hx-opacity-100 { opacity: 1; } -.group\/copybtn.copied .group-\[\.copied\]\/copybtn\:block { +.hx-group\/copybtn.copied .group-\[\.copied\]\/copybtn\:hx-block { display: block; } -.group\/copybtn.copied .group-\[\.copied\]\/copybtn\:hidden { +.hx-group\/copybtn.copied .group-\[\.copied\]\/copybtn\:hx-hidden { display: none; } -.data-\[state\=selected\]\:block[data-state=selected] { +.data-\[state\=selected\]\:hx-block[data-state=selected] { display: block; } -.data-\[state\=closed\]\:hidden[data-state=closed] { +.data-\[state\=closed\]\:hx-hidden[data-state=closed] { display: none; } -.data-\[state\=open\]\:hidden[data-state=open] { +.data-\[state\=open\]\:hx-hidden[data-state=open] { display: none; } -.data-\[state\=selected\]\:border-primary-500[data-state=selected] { +.data-\[state\=selected\]\:hx-border-primary-500[data-state=selected] { --tw-border-opacity: 1; border-color: hsl(var(--primary-hue) var(--primary-saturation) 50% / var(--tw-border-opacity)); } -.data-\[state\=selected\]\:text-primary-600[data-state=selected] { +.data-\[state\=selected\]\:hx-text-primary-600[data-state=selected] { --tw-text-opacity: 1; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity)); } -.group[data-theme=dark] .group-data-\[theme\=dark\]\:hidden { +.hx-group[data-theme=dark] .group-data-\[theme\=dark\]\:hx-hidden { display: none; } -.group[data-theme=light] .group-data-\[theme\=light\]\:hidden { +.hx-group[data-theme=light] .group-data-\[theme\=light\]\:hx-hidden { display: none; } -:is([dir="ltr"] .ltr\:right-1) { +:is([dir="ltr"] .ltr\:hx-right-1) { right: 0.25rem; } -:is([dir="ltr"] .ltr\:right-1\.5) { +:is([dir="ltr"] .ltr\:hx-right-1\.5) { right: 0.375rem; } -:is([dir="ltr"] .ltr\:right-3) { +:is([dir="ltr"] .ltr\:hx-right-3) { right: 0.75rem; } -:is([dir="ltr"] .ltr\:-mr-4) { +:is([dir="ltr"] .ltr\:hx--mr-4) { margin-right: -1rem; } -:is([dir="ltr"] .ltr\:ml-3) { +:is([dir="ltr"] .ltr\:hx-ml-3) { margin-left: 0.75rem; } -:is([dir="ltr"] .ltr\:ml-auto) { +:is([dir="ltr"] .ltr\:hx-ml-auto) { margin-left: auto; } -:is([dir="ltr"] .ltr\:mr-auto) { +:is([dir="ltr"] .ltr\:hx-mr-auto) { margin-right: auto; } -:is([dir="ltr"] .ltr\:rotate-180) { +:is([dir="ltr"] .ltr\:hx-rotate-180) { --tw-rotate: 180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } -:is([dir="ltr"] .ltr\:pl-12) { +:is([dir="ltr"] .ltr\:hx-pl-12) { padding-left: 3rem; } -:is([dir="ltr"] .ltr\:pl-16) { +:is([dir="ltr"] .ltr\:hx-pl-16) { padding-left: 4rem; } -:is([dir="ltr"] .ltr\:pl-3) { +:is([dir="ltr"] .ltr\:hx-pl-3) { padding-left: 0.75rem; } -:is([dir="ltr"] .ltr\:pl-4) { +:is([dir="ltr"] .ltr\:hx-pl-4) { padding-left: 1rem; } -:is([dir="ltr"] .ltr\:pl-8) { +:is([dir="ltr"] .ltr\:hx-pl-8) { padding-left: 2rem; } -:is([dir="ltr"] .ltr\:pr-0) { +:is([dir="ltr"] .ltr\:hx-pr-0) { padding-right: 0px; } -:is([dir="ltr"] .ltr\:pr-2) { +:is([dir="ltr"] .ltr\:hx-pr-2) { padding-right: 0.5rem; } -:is([dir="ltr"] .ltr\:pr-4) { +:is([dir="ltr"] .ltr\:hx-pr-4) { padding-right: 1rem; } -:is([dir="ltr"] .ltr\:pr-9) { +:is([dir="ltr"] .ltr\:hx-pr-9) { padding-right: 2.25rem; } -:is([dir="ltr"] .ltr\:text-right) { +:is([dir="ltr"] .ltr\:hx-text-right) { text-align: right; } -:is([dir="ltr"] .ltr\:before\:left-0)::before { +:is([dir="ltr"] .ltr\:before\:hx-left-0)::before { content: var(--tw-content); left: 0px; } -:is([dir="rtl"] .rtl\:left-1) { +:is([dir="rtl"] .rtl\:hx-left-1) { left: 0.25rem; } -:is([dir="rtl"] .rtl\:left-1\.5) { +:is([dir="rtl"] .rtl\:hx-left-1\.5) { left: 0.375rem; } -:is([dir="rtl"] .rtl\:left-3) { +:is([dir="rtl"] .rtl\:hx-left-3) { left: 0.75rem; } -:is([dir="rtl"] .rtl\:-ml-4) { +:is([dir="rtl"] .rtl\:hx--ml-4) { margin-left: -1rem; } -:is([dir="rtl"] .rtl\:ml-auto) { +:is([dir="rtl"] .rtl\:hx-ml-auto) { margin-left: auto; } -:is([dir="rtl"] .rtl\:mr-3) { +:is([dir="rtl"] .rtl\:hx-mr-3) { margin-right: 0.75rem; } -:is([dir="rtl"] .rtl\:mr-auto) { +:is([dir="rtl"] .rtl\:hx-mr-auto) { margin-right: auto; } -:is([dir="rtl"] .rtl\:-rotate-180) { +:is([dir="rtl"] .rtl\:-hx-rotate-180) { --tw-rotate: -180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } -:is([dir="rtl"] .rtl\:pl-2) { +:is([dir="rtl"] .rtl\:hx-pl-2) { padding-left: 0.5rem; } -:is([dir="rtl"] .rtl\:pl-4) { +:is([dir="rtl"] .rtl\:hx-pl-4) { padding-left: 1rem; } -:is([dir="rtl"] .rtl\:pl-9) { +:is([dir="rtl"] .rtl\:hx-pl-9) { padding-left: 2.25rem; } -:is([dir="rtl"] .rtl\:pr-12) { +:is([dir="rtl"] .rtl\:hx-pr-12) { padding-right: 3rem; } -:is([dir="rtl"] .rtl\:pr-16) { +:is([dir="rtl"] .rtl\:hx-pr-16) { padding-right: 4rem; } -:is([dir="rtl"] .rtl\:pr-3) { +:is([dir="rtl"] .rtl\:hx-pr-3) { padding-right: 0.75rem; } -:is([dir="rtl"] .rtl\:pr-4) { +:is([dir="rtl"] .rtl\:hx-pr-4) { padding-right: 1rem; } -:is([dir="rtl"] .rtl\:pr-8) { +:is([dir="rtl"] .rtl\:hx-pr-8) { padding-right: 2rem; } -:is([dir="rtl"] .rtl\:text-left) { +:is([dir="rtl"] .rtl\:hx-text-left) { text-align: left; } -:is([dir="rtl"] .rtl\:before\:right-0)::before { +:is([dir="rtl"] .rtl\:before\:hx-right-0)::before { content: var(--tw-content); right: 0px; } -:is([dir="rtl"] .rtl\:before\:rotate-180)::before { +:is([dir="rtl"] .rtl\:before\:hx-rotate-180)::before { content: var(--tw-content); --tw-rotate: 180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } @media (prefers-contrast: more) { - .contrast-more\:border { + .contrast-more\:hx-border { border-width: 1px; } - .contrast-more\:border-t { + .contrast-more\:hx-border-t { border-top-width: 1px; } - .contrast-more\:border-current { + .contrast-more\:hx-border-current { border-color: currentColor; } - .contrast-more\:border-gray-800 { + .contrast-more\:hx-border-gray-800 { --tw-border-opacity: 1; border-color: rgb(31 41 55 / var(--tw-border-opacity)); } - .contrast-more\:border-gray-900 { + .contrast-more\:hx-border-gray-900 { --tw-border-opacity: 1; border-color: rgb(17 24 39 / var(--tw-border-opacity)); } - .contrast-more\:border-neutral-400 { + .contrast-more\:hx-border-neutral-400 { --tw-border-opacity: 1; border-color: rgb(163 163 163 / var(--tw-border-opacity)); } - .contrast-more\:border-primary-500 { + .contrast-more\:hx-border-primary-500 { --tw-border-opacity: 1; border-color: hsl(var(--primary-hue) var(--primary-saturation) 50% / var(--tw-border-opacity)); } - .contrast-more\:border-transparent { + .contrast-more\:hx-border-transparent { border-color: transparent; } - .contrast-more\:font-bold { + .contrast-more\:hx-font-bold { font-weight: 700; } - .contrast-more\:text-current { + .contrast-more\:hx-text-current { color: currentColor; } - .contrast-more\:text-gray-700 { + .contrast-more\:hx-text-gray-700 { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity)); } - .contrast-more\:text-gray-800 { + .contrast-more\:hx-text-gray-800 { --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity)); } - .contrast-more\:text-gray-900 { + .contrast-more\:hx-text-gray-900 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity)); } - .contrast-more\:underline { + .contrast-more\:hx-underline { text-decoration-line: underline; } - .contrast-more\:shadow-\[0_0_0_1px_\#000\] { + .contrast-more\:hx-shadow-\[0_0_0_1px_\#000\] { --tw-shadow: 0 0 0 1px #000; --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } - .contrast-more\:shadow-none { + .contrast-more\:hx-shadow-none { --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } - .contrast-more\:hover\:border-gray-900:hover { + .contrast-more\:hover\:hx-border-gray-900:hover { --tw-border-opacity: 1; border-color: rgb(17 24 39 / var(--tw-border-opacity)); } } -:is(html[class~="dark"] .dark\:block) { +:is(html[class~="dark"] .dark\:hx-block) { display: block; } -:is(html[class~="dark"] .dark\:hidden) { +:is(html[class~="dark"] .dark\:hx-hidden) { display: none; } -:is(html[class~="dark"] .dark\:border-blue-200\/30) { +:is(html[class~="dark"] .dark\:hx-border-blue-200\/30) { border-color: rgb(191 219 254 / 0.3); } -:is(html[class~="dark"] .dark\:border-gray-100\/20) { +:is(html[class~="dark"] .dark\:hx-border-gray-100\/20) { border-color: rgb(243 244 246 / 0.2); } -:is(html[class~="dark"] .dark\:border-gray-400) { +:is(html[class~="dark"] .dark\:hx-border-gray-400) { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity)); } -:is(html[class~="dark"] .dark\:border-neutral-700) { +:is(html[class~="dark"] .dark\:hx-border-neutral-700) { --tw-border-opacity: 1; border-color: rgb(64 64 64 / var(--tw-border-opacity)); } -:is(html[class~="dark"] .dark\:border-neutral-800) { +:is(html[class~="dark"] .dark\:hx-border-neutral-800) { --tw-border-opacity: 1; border-color: rgb(38 38 38 / var(--tw-border-opacity)); } -:is(html[class~="dark"] .dark\:border-orange-400\/30) { +:is(html[class~="dark"] .dark\:hx-border-orange-400\/30) { border-color: rgb(251 146 60 / 0.3); } -:is(html[class~="dark"] .dark\:border-red-200\/30) { +:is(html[class~="dark"] .dark\:hx-border-red-200\/30) { border-color: rgb(254 202 202 / 0.3); } -:is(html[class~="dark"] .dark\:border-white\/10) { +:is(html[class~="dark"] .dark\:hx-border-white\/10) { border-color: rgb(255 255 255 / 0.1); } -:is(html[class~="dark"] .dark\:border-yellow-200\/30) { +:is(html[class~="dark"] .dark\:hx-border-yellow-200\/30) { border-color: rgb(254 240 138 / 0.3); } -:is(html[class~="dark"] .dark\:bg-black\/60) { +:is(html[class~="dark"] .dark\:hx-bg-black\/60) { background-color: rgb(0 0 0 / 0.6); } -:is(html[class~="dark"] .dark\:bg-blue-900\/30) { +:is(html[class~="dark"] .dark\:hx-bg-blue-900\/30) { background-color: rgb(30 58 138 / 0.3); } -:is(html[class~="dark"] .dark\:bg-dark) { +:is(html[class~="dark"] .dark\:hx-bg-dark) { --tw-bg-opacity: 1; background-color: rgb(17 17 17 / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:bg-dark\/50) { +:is(html[class~="dark"] .dark\:hx-bg-dark\/50) { background-color: rgb(17 17 17 / 0.5); } -:is(html[class~="dark"] .dark\:bg-gray-50\/10) { +:is(html[class~="dark"] .dark\:hx-bg-gray-50\/10) { background-color: rgb(249 250 251 / 0.1); } -:is(html[class~="dark"] .dark\:bg-neutral-800) { +:is(html[class~="dark"] .dark\:hx-bg-neutral-800) { --tw-bg-opacity: 1; background-color: rgb(38 38 38 / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:bg-neutral-900) { +:is(html[class~="dark"] .dark\:hx-bg-neutral-900) { --tw-bg-opacity: 1; background-color: rgb(23 23 23 / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:bg-orange-400\/20) { +:is(html[class~="dark"] .dark\:hx-bg-orange-400\/20) { background-color: rgb(251 146 60 / 0.2); } -:is(html[class~="dark"] .dark\:bg-primary-300\/10) { +:is(html[class~="dark"] .dark\:hx-bg-primary-300\/10) { background-color: hsl(var(--primary-hue) var(--primary-saturation) 77% / 0.1); } -:is(html[class~="dark"] .dark\:bg-primary-400\/10) { +:is(html[class~="dark"] .dark\:hx-bg-primary-400\/10) { background-color: hsl(var(--primary-hue) var(--primary-saturation) 66% / 0.1); } -:is(html[class~="dark"] .dark\:bg-primary-600) { +:is(html[class~="dark"] .dark\:hx-bg-primary-600) { --tw-bg-opacity: 1; background-color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:bg-red-900\/30) { +:is(html[class~="dark"] .dark\:hx-bg-red-900\/30) { background-color: rgb(127 29 29 / 0.3); } -:is(html[class~="dark"] .dark\:bg-yellow-700\/30) { +:is(html[class~="dark"] .dark\:hx-bg-yellow-700\/30) { background-color: rgb(161 98 7 / 0.3); } -:is(html[class~="dark"] .dark\:from-gray-100) { +:is(html[class~="dark"] .dark\:hx-from-gray-100) { --tw-gradient-from: #f3f4f6 var(--tw-gradient-from-position); --tw-gradient-to: rgb(243 244 246 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } -:is(html[class~="dark"] .dark\:to-gray-400) { +:is(html[class~="dark"] .dark\:hx-to-gray-400) { --tw-gradient-to: #9ca3af var(--tw-gradient-to-position); } -:is(html[class~="dark"] .dark\:text-blue-200) { +:is(html[class~="dark"] .dark\:hx-text-blue-200) { --tw-text-opacity: 1; color: rgb(191 219 254 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-gray-100) { +:is(html[class~="dark"] .dark\:hx-text-gray-100) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-gray-200) { +:is(html[class~="dark"] .dark\:hx-text-gray-200) { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-gray-300) { +:is(html[class~="dark"] .dark\:hx-text-gray-300) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-gray-400) { +:is(html[class~="dark"] .dark\:hx-text-gray-400) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-gray-50) { +:is(html[class~="dark"] .dark\:hx-text-gray-50) { --tw-text-opacity: 1; color: rgb(249 250 251 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-neutral-200) { +:is(html[class~="dark"] .dark\:hx-text-neutral-200) { --tw-text-opacity: 1; color: rgb(229 229 229 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-neutral-400) { +:is(html[class~="dark"] .dark\:hx-text-neutral-400) { --tw-text-opacity: 1; color: rgb(163 163 163 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-orange-300) { +:is(html[class~="dark"] .dark\:hx-text-orange-300) { --tw-text-opacity: 1; color: rgb(253 186 116 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-primary-600) { +:is(html[class~="dark"] .dark\:hx-text-primary-600) { --tw-text-opacity: 1; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-red-200) { +:is(html[class~="dark"] .dark\:hx-text-red-200) { --tw-text-opacity: 1; color: rgb(254 202 202 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-slate-100) { +:is(html[class~="dark"] .dark\:hx-text-slate-100) { --tw-text-opacity: 1; color: rgb(241 245 249 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:text-yellow-200) { +:is(html[class~="dark"] .dark\:hx-text-yellow-200) { --tw-text-opacity: 1; color: rgb(254 240 138 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:opacity-80) { +:is(html[class~="dark"] .dark\:hx-opacity-80) { opacity: 0.8; } -:is(html[class~="dark"] .dark\:shadow-\[0_-12px_16px_\#111\]) { +:is(html[class~="dark"] .dark\:hx-shadow-\[0_-12px_16px_\#111\]) { --tw-shadow: 0 -12px 16px #111; --tw-shadow-colored: 0 -12px 16px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -:is(html[class~="dark"] .dark\:shadow-\[0_-1px_0_rgba\(255\2c 255\2c 255\2c \.1\)_inset\]) { +:is(html[class~="dark"] .dark\:hx-shadow-\[0_-1px_0_rgba\(255\2c 255\2c 255\2c \.1\)_inset\]) { --tw-shadow: 0 -1px 0 rgba(255,255,255,.1) inset; --tw-shadow-colored: inset 0 -1px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -:is(html[class~="dark"] .dark\:shadow-none) { +:is(html[class~="dark"] .dark\:hx-shadow-none) { --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -:is(html[class~="dark"] .dark\:ring-white\/20) { +:is(html[class~="dark"] .dark\:hx-ring-white\/20) { --tw-ring-color: rgb(255 255 255 / 0.2); } -:is(html[class~="dark"] .dark\:placeholder\:text-gray-400)::-moz-placeholder { +:is(html[class~="dark"] .dark\:placeholder\:hx-text-gray-400)::-moz-placeholder { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:placeholder\:text-gray-400)::placeholder { +:is(html[class~="dark"] .dark\:placeholder\:hx-text-gray-400)::placeholder { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:before\:bg-neutral-800)::before { +:is(html[class~="dark"] .dark\:before\:hx-bg-neutral-800)::before { content: var(--tw-content); --tw-bg-opacity: 1; background-color: rgb(38 38 38 / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:before\:invert)::before { +:is(html[class~="dark"] .dark\:before\:hx-invert)::before { content: var(--tw-content); --tw-invert: invert(100%); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } -:is(html[class~="dark"] .dark\:hover\:border-gray-100:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-border-gray-100:hover) { --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity)); } -:is(html[class~="dark"] .dark\:hover\:border-gray-600:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-border-gray-600:hover) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity)); } -:is(html[class~="dark"] .dark\:hover\:border-neutral-500:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-border-neutral-500:hover) { --tw-border-opacity: 1; border-color: rgb(115 115 115 / var(--tw-border-opacity)); } -:is(html[class~="dark"] .dark\:hover\:border-neutral-700:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-border-neutral-700:hover) { --tw-border-opacity: 1; border-color: rgb(64 64 64 / var(--tw-border-opacity)); } -:is(html[class~="dark"] .dark\:hover\:border-neutral-800:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-border-neutral-800:hover) { --tw-border-opacity: 1; border-color: rgb(38 38 38 / var(--tw-border-opacity)); } -:is(html[class~="dark"] .dark\:hover\:bg-gray-100\/5:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-bg-gray-100\/5:hover) { background-color: rgb(243 244 246 / 0.05); } -:is(html[class~="dark"] .dark\:hover\:bg-neutral-700:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-bg-neutral-700:hover) { --tw-bg-opacity: 1; background-color: rgb(64 64 64 / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:hover\:bg-neutral-800:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-bg-neutral-800:hover) { --tw-bg-opacity: 1; background-color: rgb(38 38 38 / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:hover\:bg-neutral-900:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-bg-neutral-900:hover) { --tw-bg-opacity: 1; background-color: rgb(23 23 23 / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:hover\:bg-primary-100\/5:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-bg-primary-100\/5:hover) { background-color: hsl(var(--primary-hue) var(--primary-saturation) 94% / 0.05); } -:is(html[class~="dark"] .dark\:hover\:bg-primary-700:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-bg-primary-700:hover) { --tw-bg-opacity: 1; background-color: hsl(var(--primary-hue) var(--primary-saturation) 39% / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .hover\:dark\:bg-primary-500\/10):hover { +:is(html[class~="dark"] .hover\:dark\:hx-bg-primary-500\/10):hover { background-color: hsl(var(--primary-hue) var(--primary-saturation) 50% / 0.1); } -:is(html[class~="dark"] .dark\:hover\:text-gray-100:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-text-gray-100:hover) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:hover\:text-gray-200:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-text-gray-200:hover) { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:hover\:text-gray-300:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-text-gray-300:hover) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:hover\:text-gray-50:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-text-gray-50:hover) { --tw-text-opacity: 1; color: rgb(249 250 251 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:hover\:text-neutral-50:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-text-neutral-50:hover) { --tw-text-opacity: 1; color: rgb(250 250 250 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:hover\:text-white:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-text-white:hover) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } -:is(html[class~="dark"] .hover\:dark\:text-primary-600):hover { +:is(html[class~="dark"] .hover\:dark\:hx-text-primary-600):hover { --tw-text-opacity: 1; color: hsl(var(--primary-hue) var(--primary-saturation) 45% / var(--tw-text-opacity)); } -:is(html[class~="dark"] .dark\:hover\:shadow-none:hover) { +:is(html[class~="dark"] .dark\:hover\:hx-shadow-none:hover) { --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -:is(html[class~="dark"] .dark\:focus\:bg-dark:focus) { +:is(html[class~="dark"] .dark\:focus\:hx-bg-dark:focus) { --tw-bg-opacity: 1; background-color: rgb(17 17 17 / var(--tw-bg-opacity)); } -:is(html[class~="dark"] .dark\:focus\:ring-primary-800:focus) { +:is(html[class~="dark"] .dark\:focus\:hx-ring-primary-800:focus) { --tw-ring-opacity: 1; --tw-ring-color: hsl(var(--primary-hue) var(--primary-saturation) 32% / var(--tw-ring-opacity)); } @media (prefers-contrast: more) { - :is(html[class~="dark"] .contrast-more\:dark\:border-current) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-border-current) { border-color: currentColor; } - :is(html[class~="dark"] .contrast-more\:dark\:border-gray-50) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-border-gray-50) { --tw-border-opacity: 1; border-color: rgb(249 250 251 / var(--tw-border-opacity)); } - :is(html[class~="dark"] .contrast-more\:dark\:border-neutral-400) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-border-neutral-400) { --tw-border-opacity: 1; border-color: rgb(163 163 163 / var(--tw-border-opacity)); } - :is(html[class~="dark"] .contrast-more\:dark\:border-primary-500) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-border-primary-500) { --tw-border-opacity: 1; border-color: hsl(var(--primary-hue) var(--primary-saturation) 50% / var(--tw-border-opacity)); } - :is(html[class~="dark"] .dark\:contrast-more\:border-neutral-400) { + :is(html[class~="dark"] .dark\:contrast-more\:hx-border-neutral-400) { --tw-border-opacity: 1; border-color: rgb(163 163 163 / var(--tw-border-opacity)); } - :is(html[class~="dark"] .contrast-more\:dark\:text-current) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-text-current) { color: currentColor; } - :is(html[class~="dark"] .contrast-more\:dark\:text-gray-100) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-text-gray-100) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity)); } - :is(html[class~="dark"] .contrast-more\:dark\:text-gray-300) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-text-gray-300) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity)); } - :is(html[class~="dark"] .contrast-more\:dark\:text-gray-50) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-text-gray-50) { --tw-text-opacity: 1; color: rgb(249 250 251 / var(--tw-text-opacity)); } - :is(html[class~="dark"] .contrast-more\:dark\:shadow-\[0_0_0_1px_\#fff\]) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-shadow-\[0_0_0_1px_\#fff\]) { --tw-shadow: 0 0 0 1px #fff; --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } - :is(html[class~="dark"] .contrast-more\:dark\:shadow-none) { + :is(html[class~="dark"] .contrast-more\:dark\:hx-shadow-none) { --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } - :is(html[class~="dark"] .contrast-more\:dark\:hover\:border-gray-50:hover) { + :is(html[class~="dark"] .contrast-more\:dark\:hover\:hx-border-gray-50:hover) { --tw-border-opacity: 1; border-color: rgb(249 250 251 / var(--tw-border-opacity)); } } @media print { - .print\:hidden { + .print\:hx-hidden { display: none; } - .print\:bg-transparent { + .print\:hx-bg-transparent { background-color: transparent; } } @media not all and (min-width: 1280px) { - .max-xl\:hidden { + .max-xl\:hx-hidden { display: none; } } @media not all and (min-width: 1024px) { - .max-lg\:min-h-\[340px\] { + .max-lg\:hx-min-h-\[340px\] { min-height: 340px; } } @media not all and (min-width: 768px) { - .max-md\:hidden { + .max-md\:hx-hidden { display: none; } - .max-md\:min-h-\[340px\] { + .max-md\:hx-min-h-\[340px\] { min-height: 340px; } @@ -3364,114 +3358,114 @@ body { } @media (min-width: 640px) { - .sm\:block { + .sm\:hx-block { display: block; } - .sm\:flex { + .sm\:hx-flex { display: flex; } - .sm\:w-\[110\%\] { + .sm\:hx-w-\[110\%\] { width: 110%; } - .sm\:grid-cols-2 { + .sm\:hx-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } - .sm\:items-start { + .sm\:hx-items-start { align-items: flex-start; } - .sm\:text-xl { + .sm\:hx-text-xl { font-size: 1.25rem; } } @media (min-width: 768px) { - .md\:sticky { + .md\:hx-sticky { position: sticky; } - .md\:top-16 { + .md\:hx-top-16 { top: 4rem; } - .md\:inline-block { + .md\:hx-inline-block { display: inline-block; } - .md\:hidden { + .md\:hx-hidden { display: none; } - .md\:aspect-\[1\.1\/1\] { + .md\:hx-aspect-\[1\.1\/1\] { aspect-ratio: 1.1/1; } - .md\:h-\[calc\(100vh-var\(--navbar-height\)-var\(--menu-height\)\)\] { + .md\:hx-h-\[calc\(100vh-var\(--navbar-height\)-var\(--menu-height\)\)\] { height: calc(100vh - var(--navbar-height) - var(--menu-height)); } - .md\:max-h-\[min\(calc\(100vh-5rem-env\(safe-area-inset-bottom\)\)\2c 400px\)\] { + .md\:hx-max-h-\[min\(calc\(100vh-5rem-env\(safe-area-inset-bottom\)\)\2c 400px\)\] { max-height: min(calc(100vh - 5rem - env(safe-area-inset-bottom)),400px); } - .md\:w-64 { + .md\:hx-w-64 { width: 16rem; } - .md\:shrink-0 { + .md\:hx-shrink-0 { flex-shrink: 0; } - .md\:justify-start { + .md\:hx-justify-start { justify-content: flex-start; } - .md\:self-start { + .md\:hx-self-start { align-self: flex-start; } - .md\:px-12 { + .md\:hx-px-12 { padding-left: 3rem; padding-right: 3rem; } - .md\:pt-12 { + .md\:hx-pt-12 { padding-top: 3rem; } - .md\:text-5xl { + .md\:hx-text-5xl { font-size: 3rem; } - .md\:text-lg { + .md\:hx-text-lg { font-size: 1.125rem; } - .md\:text-sm { + .md\:hx-text-sm { font-size: .875rem; } - :is([dir="ltr"] .ltr\:md\:left-auto) { + :is([dir="ltr"] .ltr\:md\:hx-left-auto) { left: auto; } - :is([dir="rtl"] .rtl\:md\:right-auto) { + :is([dir="rtl"] .rtl\:md\:hx-right-auto) { right: auto; } } @media (min-width: 1024px) { - .lg\:grid-cols-3 { + .lg\:hx-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (min-width: 1280px) { - .xl\:block { + .xl\:hx-block { display: block; } } diff --git a/assets/css/components/code-copy.css b/assets/css/components/code-copy.css index 4547feaf..3c020d34 100644 --- a/assets/css/components/code-copy.css +++ b/assets/css/components/code-copy.css @@ -2,6 +2,6 @@ (-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px)) ) { .code-copy-btn { - @apply backdrop-blur-md bg-opacity-[.85] dark:bg-opacity-80; + @apply hx-backdrop-blur-md hx-bg-opacity-[.85] dark:hx-bg-opacity-80; } } diff --git a/assets/css/components/navbar.css b/assets/css/components/navbar.css index 8bca91de..4e9e3855 100644 --- a/assets/css/components/navbar.css +++ b/assets/css/components/navbar.css @@ -1,6 +1,6 @@ nav { .search-wrapper { - @apply hidden md:inline-block; + @apply hx-hidden md:hx-inline-block; } } @@ -8,13 +8,13 @@ nav { (-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px)) ) { .nav-container-blur { - @apply backdrop-blur-md bg-white/[.85] dark:!bg-dark/80; + @apply hx-backdrop-blur-md hx-bg-white/[.85] dark:!hx-bg-dark/80; } } .hamburger-menu svg { g { - @apply origin-center; + @apply hx-origin-center; transition: transform 0.2s cubic-bezier(0.25, 1, 0.5, 1); } path { @@ -37,16 +37,16 @@ nav { &.open > { path { - @apply opacity-0; + @apply hx-opacity-0; } g:nth-of-type(1) { - @apply rotate-45; + @apply hx-rotate-45; path { transform: translate3d(0, 4px, 0); } } g:nth-of-type(2) { - @apply -rotate-45; + @apply -hx-rotate-45; path { transform: translate3d(0, -4px, 0); } diff --git a/assets/css/components/scrollbar.css b/assets/css/components/scrollbar.css index e60c1d12..7dc75e90 100644 --- a/assets/css/components/scrollbar.css +++ b/assets/css/components/scrollbar.css @@ -4,18 +4,18 @@ scrollbar-gutter: stable; &::-webkit-scrollbar { - @apply w-3 h-3; + @apply hx-w-3 hx-h-3; } &::-webkit-scrollbar-track { - @apply bg-transparent; + @apply hx-bg-transparent; } &::-webkit-scrollbar-thumb { - @apply rounded-[10px]; + @apply hx-rounded-[10px]; } &:hover::-webkit-scrollbar-thumb { border: 3px solid transparent; background-color: var(--tw-shadow-color); background-clip: content-box; - @apply shadow-neutral-500/20 hover:shadow-neutral-500/40; + @apply hx-shadow-neutral-500/20 hover:hx-shadow-neutral-500/40; } } diff --git a/assets/css/components/search.css b/assets/css/components/search.css index 1994f84d..3d508bc3 100644 --- a/assets/css/components/search.css +++ b/assets/css/components/search.css @@ -1,31 +1,31 @@ .search-wrapper { li { - @apply mx-2.5 break-words rounded-md contrast-more:border text-gray-800 contrast-more:border-transparent dark:text-gray-300; + @apply hx-mx-2.5 hx-break-words hx-rounded-md contrast-more:hx-border hx-text-gray-800 contrast-more:hx-border-transparent dark:hx-text-gray-300; a { - @apply block scroll-m-12 px-2.5 py-2; + @apply hx-block hx-scroll-m-12 hx-px-2.5 hx-py-2; } .title { - @apply text-base font-semibold leading-5; + @apply hx-text-base hx-font-semibold hx-leading-5; } .active { - @apply rounded-md bg-primary-500/10 contrast-more:border-primary-500; + @apply hx-rounded-md hx-bg-primary-500/10 contrast-more:hx-border-primary-500; } } .no-result { - @apply block select-none p-8 text-center text-sm text-gray-400; + @apply hx-block hx-select-none hx-p-8 hx-text-center hx-text-sm hx-text-gray-400; } .prefix { - @apply mx-2.5 mb-2 mt-6 select-none border-b border-black/10 px-2.5 pb-1.5 text-xs font-semibold - uppercase text-gray-500 first:mt-0 dark:border-white/20 dark:text-gray-300 contrast-more:border-gray-600 - contrast-more:text-gray-900 contrast-more:dark:border-gray-50 contrast-more:dark:text-gray-50; + @apply hx-mx-2.5 hx-mb-2 hx-mt-6 hx-select-none hx-border-b hx-border-black/10 hx-px-2.5 hx-pb-1.5 hx-text-xs hx-font-semibold + hx-uppercase hx-text-gray-500 first:hx-mt-0 dark:hx-border-white/20 dark:hx-text-gray-300 contrast-more:hx-border-gray-600 + contrast-more:hx-text-gray-900 contrast-more:dark:hx-border-gray-50 contrast-more:dark:hx-text-gray-50; } .excerpt { - @apply overflow-hidden text-ellipsis mt-1 text-sm leading-[1.35rem] text-gray-600 dark:text-gray-400 contrast-more:dark:text-gray-50; + @apply hx-overflow-hidden hx-text-ellipsis hx-mt-1 hx-text-sm hx-leading-[1.35rem] hx-text-gray-600 dark:hx-text-gray-400 contrast-more:dark:hx-text-gray-50; display: -webkit-box; line-clamp: 1; -webkit-line-clamp: 1; @@ -33,6 +33,6 @@ } .match { - @apply text-primary-600; + @apply hx-text-primary-600; } } diff --git a/assets/css/components/sidebar.css b/assets/css/components/sidebar.css index 0ccbfb94..394c8d63 100644 --- a/assets/css/components/sidebar.css +++ b/assets/css/components/sidebar.css @@ -1,6 +1,6 @@ @media (max-width: 767px) { .sidebar-container { - @apply fixed pt-[calc(var(--navbar-height))] top-0 w-full bottom-0 z-[15] overscroll-contain bg-white dark:bg-dark; + @apply hx-fixed hx-pt-[calc(var(--navbar-height))] hx-top-0 hx-w-full hx-bottom-0 hx-z-[15] hx-overscroll-contain hx-bg-white dark:hx-bg-dark; transition: transform 0.8s cubic-bezier(0.52, 0.16, 0.04, 1); will-change: transform, opacity; contain: layout style; @@ -10,12 +10,12 @@ .sidebar-container { li > div { - @apply h-0; + @apply hx-h-0; } li.open > div { - @apply h-auto pt-1; + @apply hx-h-auto hx-pt-1; } li.open > a > span > svg > path { - @apply rotate-90; + @apply hx-rotate-90; } } diff --git a/assets/css/components/steps.css b/assets/css/components/steps.css index 680d02d2..278862d0 100644 --- a/assets/css/components/steps.css +++ b/assets/css/components/steps.css @@ -2,10 +2,10 @@ counter-increment: step; &:before { - @apply absolute w-[33px] h-[33px]; - @apply border-4 border-white bg-gray-100 dark:border-dark dark:bg-neutral-800; - @apply rounded-full text-neutral-400 text-base font-normal text-center -indent-px; - @apply mt-[3px] ml-[-41px]; + @apply hx-absolute hx-w-[33px] hx-h-[33px]; + @apply hx-border-4 hx-border-white hx-bg-gray-100 dark:hx-border-dark dark:hx-bg-neutral-800; + @apply hx-rounded-full hx-text-neutral-400 hx-text-base hx-font-normal hx-text-center -hx-indent-px; + @apply hx-mt-[3px] hx-ml-[-41px]; content: counter(step); } } diff --git a/assets/css/highlight.css b/assets/css/highlight.css index 089171bc..ee6fdb34 100644 --- a/assets/css/highlight.css +++ b/assets/css/highlight.css @@ -3,51 +3,51 @@ @import "chroma/dark.css"; .code-block { - @apply text-[.9em] leading-5; + @apply hx-text-[.9em] hx-leading-5; pre { - @apply text-[.9em] bg-primary-700/5 overflow-x-auto font-medium subpixel-antialiased dark:bg-primary-300/10 contrast-more:border contrast-more:border-primary-900/20 contrast-more:contrast-150 contrast-more:dark:border-primary-100/40; + @apply hx-text-[.9em] hx-bg-primary-700/5 hx-overflow-x-auto hx-font-medium hx-subpixel-antialiased dark:hx-bg-primary-300/10 contrast-more:hx-border contrast-more:hx-border-primary-900/20 contrast-more:hx-contrast-150 contrast-more:dark:hx-border-primary-100/40; } .filename { - @apply absolute top-0 z-[1] w-full truncate rounded-t-xl bg-primary-700/5 py-2 px-4 text-xs text-gray-700 dark:bg-primary-300/10 dark:text-gray-200; + @apply hx-absolute hx-top-0 hx-z-[1] hx-w-full hx-truncate hx-rounded-t-xl hx-bg-primary-700/5 hx-py-2 hx-px-4 hx-text-xs hx-text-gray-700 dark:hx-bg-primary-300/10 dark:hx-text-gray-200; } .filename + pre:not(.lntable pre) { /* Override padding for code blocks with filename but no highlight */ - @apply pt-12; + @apply hx-pt-12; } } .code-block pre:not(.lntable pre) { - @apply px-4 mb-4 py-4 rounded-xl; + @apply hx-px-4 hx-mb-4 hx-py-4 hx-rounded-xl; } .code-block div:nth-of-type(2) pre { - @apply pt-12 pb-4; + @apply hx-pt-12 hx-pb-4; } .chroma { .lntable { - @apply m-0 block w-auto overflow-auto rounded-xl; + @apply hx-m-0 hx-block hx-w-auto hx-overflow-auto hx-rounded-xl; pre { - @apply pt-4 pb-4; + @apply hx-pt-4 hx-pb-4; } } .ln, .lnt:not(.hl > .lnt), .hl:not(.line) { - @apply pl-4 pr-4 min-w-[2.6rem] text-neutral-600 dark:text-neutral-300; + @apply hx-pl-4 hx-pr-4 hx-min-w-[2.6rem] hx-text-neutral-600 dark:hx-text-neutral-300; } .lntd { - @apply p-0 align-top; + @apply hx-p-0 hx-align-top; } .lntd:last-of-type { - @apply w-full; + @apply hx-w-full; } /* LineHighlight */ .hl { - @apply block w-full bg-primary-800/10; + @apply hx-block hx-w-full hx-bg-primary-800/10; } } diff --git a/assets/css/styles.css b/assets/css/styles.css index 481a2acb..3ef02b86 100644 --- a/assets/css/styles.css +++ b/assets/css/styles.css @@ -11,13 +11,13 @@ @import "components/code-copy.css"; html { - @apply text-base antialiased; + @apply hx-text-base hx-antialiased; font-feature-settings: "rlig" 1, "calt" 1, "ss01" 1; -webkit-tap-highlight-color: transparent; } body { - @apply w-full bg-white dark:bg-dark dark:text-gray-100; + @apply hx-w-full hx-bg-white dark:hx-bg-dark dark:hx-text-gray-100; } :root { diff --git a/assets/css/typography.css b/assets/css/typography.css index bfd96adf..47ee352a 100644 --- a/assets/css/typography.css +++ b/assets/css/typography.css @@ -1,117 +1,117 @@ .content { :where(h1):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply mt-2 text-4xl font-bold tracking-tight text-slate-900 dark:text-slate-100; + @apply hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100; } :where(h2):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply font-semibold tracking-tight text-slate-900 dark:text-slate-100 mt-10 border-b pb-1 text-3xl border-neutral-200/70 contrast-more:border-neutral-400 dark:border-primary-100/10 contrast-more:dark:border-neutral-400; + @apply hx-font-semibold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100 hx-mt-10 hx-border-b hx-pb-1 hx-text-3xl hx-border-neutral-200/70 contrast-more:hx-border-neutral-400 dark:hx-border-primary-100/10 contrast-more:dark:hx-border-neutral-400; } :where(h3):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply font-semibold tracking-tight text-slate-900 dark:text-slate-100 mt-8 text-2xl; + @apply hx-font-semibold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100 hx-mt-8 hx-text-2xl; } :where(h4):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply font-semibold tracking-tight text-slate-900 dark:text-slate-100 mt-8 text-xl; + @apply hx-font-semibold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100 hx-mt-8 hx-text-xl; } :where(h5):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply font-semibold tracking-tight text-slate-900 dark:text-slate-100 mt-8 text-lg; + @apply hx-font-semibold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100 hx-mt-8 hx-text-lg; } :where(h6):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply font-semibold tracking-tight text-slate-900 dark:text-slate-100 mt-8 text-base; + @apply hx-font-semibold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100 hx-mt-8 hx-text-base; } :where(p):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply mt-6 leading-7 first:mt-0; + @apply hx-mt-6 hx-leading-7 first:hx-mt-0; } :where(a):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply text-primary-600 underline decoration-from-font [text-underline-position:from-font]; + @apply hx-text-primary-600 hx-underline hx-decoration-from-font [text-underline-position:from-font]; } :where(blockquote):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply mt-6 border-gray-300 italic text-gray-700 dark:border-gray-700 dark:text-gray-400 first:mt-0 ltr:border-l-2 ltr:pl-6 rtl:border-r-2 rtl:pr-6; + @apply hx-mt-6 hx-border-gray-300 hx-italic hx-text-gray-700 dark:hx-border-gray-700 dark:hx-text-gray-400 first:hx-mt-0 ltr:hx-border-l-2 ltr:hx-pl-6 rtl:hx-border-r-2 rtl:hx-pr-6; } :where(pre):not(:where(.code-block pre, [class~=not-prose],[class~=not-prose] *)) { - @apply bg-primary-700/5 mb-4 overflow-x-auto rounded-xl font-medium subpixel-antialiased dark:bg-primary-300/10 text-[.9em] contrast-more:border contrast-more:border-primary-900/20 contrast-more:contrast-150 contrast-more:dark:border-primary-100/40 py-4; + @apply hx-bg-primary-700/5 hx-mb-4 hx-overflow-x-auto hx-rounded-xl hx-font-medium hx-subpixel-antialiased dark:hx-bg-primary-300/10 hx-text-[.9em] contrast-more:hx-border contrast-more:hx-border-primary-900/20 contrast-more:hx-contrast-150 contrast-more:dark:hx-border-primary-100/40 hx-py-4; } :where(code):not(:where(.code-block code, [class~=not-prose],[class~=not-prose] *)) { - @apply border-black border-opacity-[0.04] bg-opacity-[0.03] bg-black break-words rounded-md border py-0.5 px-[.25em] text-[.9em] dark:border-white/10 dark:bg-white/10; + @apply hx-border-black hx-border-opacity-[0.04] hx-bg-opacity-[0.03] hx-bg-black hx-break-words hx-rounded-md hx-border hx-py-0.5 hx-px-[.25em] hx-text-[.9em] dark:hx-border-white/10 dark:hx-bg-white/10; } :where(table):not(:where(.code-block table, [class~=not-prose],[class~=not-prose] *)) { - @apply block overflow-x-auto mt-6 p-0 first:mt-0; + @apply hx-block hx-overflow-x-auto hx-mt-6 hx-p-0 first:hx-mt-0; tr { - @apply m-0 border-t border-gray-300 p-0 dark:border-gray-600 even:bg-gray-100 even:dark:bg-gray-600/20; + @apply hx-m-0 hx-border-t hx-border-gray-300 hx-p-0 dark:hx-border-gray-600 even:hx-bg-gray-100 even:dark:hx-bg-gray-600/20; } th { - @apply m-0 border border-gray-300 px-4 py-2 font-semibold dark:border-gray-600; + @apply hx-m-0 hx-border hx-border-gray-300 hx-px-4 hx-py-2 hx-font-semibold dark:hx-border-gray-600; } td { - @apply m-0 border border-gray-300 px-4 py-2 dark:border-gray-600; + @apply hx-m-0 hx-border hx-border-gray-300 hx-px-4 hx-py-2 dark:hx-border-gray-600; } } :where(ol):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply mt-6 list-decimal first:mt-0 ltr:ml-6 rtl:mr-6; + @apply hx-mt-6 hx-list-decimal first:hx-mt-0 ltr:hx-ml-6 rtl:hx-mr-6; li { - @apply my-2; + @apply hx-my-2; } } :where(ul):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply mt-6 list-disc first:mt-0 ltr:ml-6 rtl:mr-6; + @apply hx-mt-6 hx-list-disc first:hx-mt-0 ltr:hx-ml-6 rtl:hx-mr-6; li { - @apply my-2; + @apply hx-my-2; } } - /* This CSS rule targets the first nested unordered (ul) or ordered (ol) list - inside the list item (li) of any parent ul or ol. + /* This CSS rule targets the first nested unordered (ul) or ordered (ol) list + inside the list item (li) of any parent ul or ol. The rule sets the top margin of the selected list to zero. */ :where(ul, ol) > li > :where(ul, ol):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply mt-0; + @apply hx-mt-0; } :where(kbd):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply border-black border-opacity-[0.04] bg-opacity-[0.03] bg-black break-words rounded-md border py-0.5 px-[.25em] text-[.9em] dark:border-white/10 dark:bg-white/10; + @apply hx-border-black hx-border-opacity-[0.04] hx-bg-opacity-[0.03] hx-bg-black hx-break-words hx-rounded-md hx-border hx-py-0.5 hx-px-[.25em] hx-text-[.9em] dark:hx-border-white/10 dark:hx-bg-white/10; } :where(pre.mermaid):not(:where(.code-block pre, [class~=not-prose],[class~=not-prose] *)) { - @apply bg-transparent rounded-none dark:bg-transparent; + @apply hx-bg-transparent hx-rounded-none dark:hx-bg-transparent; } :where(img):not(:where([class~=not-prose],[class~=not-prose] *)) { - @apply mx-auto my-4 rounded-md; + @apply hx-mx-auto hx-my-4 hx-rounded-md; } :where(figure):not(:where([class~=not-prose],[class~=not-prose] *)) { figcaption { - @apply text-sm text-gray-500 dark:text-gray-400 mt-2 block text-center; + @apply hx-text-sm hx-text-gray-500 dark:hx-text-gray-400 hx-mt-2 hx-block hx-text-center; } } .footnotes { - @apply mt-12 text-sm; + @apply hx-mt-12 hx-text-sm; } } .subheading-anchor { - @apply opacity-0 transition-opacity ltr:ml-1 rtl:mr-1; + @apply hx-opacity-0 hx-transition-opacity ltr:hx-ml-1 rtl:hx-mr-1; span:target + &, :hover > &, &:focus { - @apply opacity-100; + @apply hx-opacity-100; } span + &, :hover > & { - @apply !no-underline; + @apply !hx-no-underline; } &:after { - @apply content-['#'] px-1; - @apply text-gray-300 dark:text-neutral-700; + @apply hx-content-['#'] hx-px-1; + @apply hx-text-gray-300 dark:hx-text-neutral-700; span:target + & { - @apply text-gray-400; - @apply dark:text-neutral-500; + @apply hx-text-gray-400; + @apply dark:hx-text-neutral-500; } } } article details > summary { &::-webkit-details-marker { - @apply hidden; + @apply hx-hidden; } &::before { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-5 w-5' viewBox='0 0 20 20' fill='currentColor'%3E%3Cpath fill-rule='evenodd' d='M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z' clip-rule='evenodd' /%3E%3C/svg%3E"); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='hx-h-5 hx-w-5' viewBox='0 0 20 20' fill='currentColor'%3E%3Cpath fill-rule='evenodd' d='M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z' clip-rule='evenodd' /%3E%3C/svg%3E"); height: 1.2em; width: 1.2em; vertical-align: -4px; diff --git a/assets/js/back-to-top.js b/assets/js/back-to-top.js index df6f1be1..8b7a64e7 100644 --- a/assets/js/back-to-top.js +++ b/assets/js/back-to-top.js @@ -5,9 +5,9 @@ document.addEventListener("DOMContentLoaded", function () { if (backToTop) { document.addEventListener("scroll", (e) => { if (window.scrollY > 300) { - backToTop.classList.remove("opacity-0"); + backToTop.classList.remove("hx-opacity-0"); } else { - backToTop.classList.add("opacity-0"); + backToTop.classList.add("hx-opacity-0"); } }); } diff --git a/assets/js/flexsearch.js b/assets/js/flexsearch.js index 99fdf680..15e5a1d2 100644 --- a/assets/js/flexsearch.js +++ b/assets/js/flexsearch.js @@ -6,7 +6,7 @@ document.addEventListener("DOMContentLoaded", function () { // select the kbd element under the .search-wrapper class const keys = document.querySelectorAll(".search-wrapper kbd"); keys.forEach(key => { - key.innerHTML = '⌘K'; + key.innerHTML = '⌘K'; }); } }); @@ -128,7 +128,7 @@ document.addEventListener("DOMContentLoaded", function () { function hideSearchResults() { const { resultsElement } = getActiveSearchElement(); if (!resultsElement) return; - resultsElement.classList.add('hidden'); + resultsElement.classList.add('hx-hidden'); } // Handle keyboard events. @@ -250,7 +250,7 @@ document.addEventListener("DOMContentLoaded", function () { while (resultsElement.firstChild) { resultsElement.removeChild(resultsElement.firstChild); } - resultsElement.classList.remove('hidden'); + resultsElement.classList.remove('hx-hidden'); const pageResults = window.pageIndex.search(query, 5, { enrich: true, suggest: true })[0]?.result || []; diff --git a/assets/js/lang.js b/assets/js/lang.js index b5bd45f8..159de3d0 100644 --- a/assets/js/lang.js +++ b/assets/js/lang.js @@ -5,7 +5,7 @@ e.preventDefault(); switcher.dataset.state = switcher.dataset.state === 'open' ? 'closed' : 'open'; const optionsElement = switcher.nextElementSibling; - optionsElement.classList.toggle('hidden'); + optionsElement.classList.toggle('hx-hidden'); // Calculate position of language options element const switcherRect = switcher.getBoundingClientRect(); @@ -21,7 +21,7 @@ languageSwitchers.forEach((switcher) => { switcher.dataset.state = 'closed'; const optionsElement = switcher.nextElementSibling; - optionsElement.classList.add('hidden'); + optionsElement.classList.add('hx-hidden'); }); } }); diff --git a/assets/js/menu.js b/assets/js/menu.js index 95c85ada..9191b057 100644 --- a/assets/js/menu.js +++ b/assets/js/menu.js @@ -6,9 +6,9 @@ document.addEventListener('DOMContentLoaded', function () { const sidebarContainer = document.querySelector('.sidebar-container'); // Initialize the overlay - const overlayClasses = ['fixed', 'inset-0', 'z-10', 'bg-black/80', 'dark:bg-black/60']; - overlay.classList.add('bg-transparent'); - overlay.classList.remove("hidden", ...overlayClasses); + const overlayClasses = ['hx-fixed', 'hx-inset-0', 'hx-z-10', 'hx-bg-black/80', 'dark:hx-bg-black/60']; + overlay.classList.add('hx-bg-transparent'); + overlay.classList.remove("hx-hidden", ...overlayClasses); function toggleMenu() { // Toggle the hamburger menu @@ -19,22 +19,22 @@ document.addEventListener('DOMContentLoaded', function () { sidebarContainer.classList.toggle('max-md:[transform:translate3d(0,0,0)]'); // When the menu is open, we want to prevent the body from scrolling - document.body.classList.toggle('overflow-hidden'); - document.body.classList.toggle('md:overflow-auto'); + document.body.classList.toggle('hx-overflow-hidden'); + document.body.classList.toggle('md:hx-overflow-auto'); } menu.addEventListener('click', (e) => { e.preventDefault(); toggleMenu(); - if (overlay.classList.contains('bg-transparent')) { + if (overlay.classList.contains('hx-bg-transparent')) { // Show the overlay overlay.classList.add(...overlayClasses); - overlay.classList.remove('bg-transparent'); + overlay.classList.remove('hx-bg-transparent'); } else { // Hide the overlay overlay.classList.remove(...overlayClasses); - overlay.classList.add('bg-transparent'); + overlay.classList.add('hx-bg-transparent'); } }); @@ -44,6 +44,6 @@ document.addEventListener('DOMContentLoaded', function () { // Hide the overlay overlay.classList.remove(...overlayClasses); - overlay.classList.add('bg-transparent'); + overlay.classList.add('hx-bg-transparent'); }); }); diff --git a/exampleSite/content/_index.fa.md b/exampleSite/content/_index.fa.md index de853d48..5c6da1df 100644 --- a/exampleSite/content/_index.fa.md +++ b/exampleSite/content/_index.fa.md @@ -4,52 +4,52 @@ layout: hextra-home --- {{< hextra/hero-badge >}} -
+
آزاد، متن‌باز {{< icon name="arrow-circle-left" attributes="height=14" >}} {{< /hextra/hero-badge >}} -
+
{{< hextra/hero-headline >}} - ساخت وب‌سایت‌های مدرن  با مارک‌داون و هیوگو + ساخت وب‌سایت‌های مدرن  
با مارک‌داون و هیوگو {{< /hextra/hero-headline >}}
-
+
{{< hextra/hero-subtitle >}} - تم هیوگو سریع و دارای امکانات کامل برای ایجاد وب‌سایت‌های استاتیک زیبا + تم هیوگو سریع و دارای امکانات کامل 
برای ایجاد وب‌سایت‌های استاتیک زیبا {{< /hextra/hero-subtitle >}}
-
+
{{< hextra/hero-button text="شروع کنید" link="docs" >}}
-
+
{{< hextra/feature-grid >}} {{< hextra/feature-card title="سریع و با امکانات کامل" subtitle="ساده و آسان برای استفاده، در عین حال قدرتمند و غنی از ویژگی‌ها متنوع." - class="aspect-auto md:aspect-[1.1/1] max-md:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]" image="/images/hextra-doc.webp" - imageClass="top-[40%] left-[24px] w-[180%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[24px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card title="مارک‌داون تنها چیزی است که شما نیاز دارید" subtitle="فقط با مارک‌داون بنویسید. تکمیل و کامل با کامپوننت‌های کد کوتاه." - class="aspect-auto md:aspect-[1.1/1] max-lg:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]" image="/images/hextra-markdown.webp" - imageClass="top-[40%] left-[36px] w-[180%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card title="جستجوی کامل متن" subtitle="جستجوی متن کامل داخلی با FlexSearch، بدون نیاز به نصب موارد اضافی." - class="aspect-auto md:aspect-[1.1/1] max-md:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]" image="/images/hextra-search.webp" - imageClass="top-[40%] left-[36px] w-[110%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[36px] hx-w-[110%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(221,210,59,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card diff --git a/exampleSite/content/_index.md b/exampleSite/content/_index.md index 11f1caaa..7c53d38f 100644 --- a/exampleSite/content/_index.md +++ b/exampleSite/content/_index.md @@ -4,52 +4,52 @@ layout: hextra-home --- {{< hextra/hero-badge >}} -
+
Free, open source {{< icon name="arrow-circle-right" attributes="height=14" >}} {{< /hextra/hero-badge >}} -
+
{{< hextra/hero-headline >}} - Build modern websites with Markdown and Hugo + Build modern websites 
with Markdown and Hugo {{< /hextra/hero-headline >}}
-
+
{{< hextra/hero-subtitle >}} - Fast, batteries-included Hugo theme for creating beautiful static websites + Fast, batteries-included Hugo theme 
for creating beautiful static websites {{< /hextra/hero-subtitle >}}
-
+
{{< hextra/hero-button text="Get Started" link="docs" >}}
-
+
{{< hextra/feature-grid >}} {{< hextra/feature-card title="Fast and Full-featured" subtitle="Simple and easy to use, yet powerful and feature-rich." - class="aspect-auto md:aspect-[1.1/1] max-md:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]" image="images/hextra-doc.webp" - imageClass="top-[40%] left-[24px] w-[180%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[24px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card title="Markdown is All You Need" subtitle="Compose with just Markdown. Enrich with Shortcode components." - class="aspect-auto md:aspect-[1.1/1] max-lg:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]" image="images/hextra-markdown.webp" - imageClass="top-[40%] left-[36px] w-[180%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card title="Full Text Search" subtitle="Built-in full text search with FlexSearch, no extra setup required." - class="aspect-auto md:aspect-[1.1/1] max-md:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]" image="images/hextra-search.webp" - imageClass="top-[40%] left-[36px] w-[110%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[36px] hx-w-[110%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(221,210,59,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card diff --git a/exampleSite/content/_index.zh-cn.md b/exampleSite/content/_index.zh-cn.md index 1dff4eaf..d825babd 100644 --- a/exampleSite/content/_index.zh-cn.md +++ b/exampleSite/content/_index.zh-cn.md @@ -4,52 +4,52 @@ layout: hextra-home --- {{< hextra/hero-badge >}} -
+
免费 开源 {{< icon name="arrow-circle-right" attributes="height=14" >}} {{< /hextra/hero-badge >}} -
+
{{< hextra/hero-headline >}} - 创建现代化网站 由 Markdown 和 Hugo 驱动 + 创建现代化网站 
由 Markdown 和 Hugo 驱动 {{< /hextra/hero-headline >}}
-
+
{{< hextra/hero-subtitle >}} - 极速且全能的 Hugo 主题框架 为构建现代化的静态网站而生 + 极速且全能的 Hugo 主题框架 
为构建现代化的静态网站而生 {{< /hextra/hero-subtitle >}}
-
+
{{< hextra/hero-button text="现在开始" link="docs" >}}
-
+
{{< hextra/feature-grid >}} {{< hextra/feature-card title="快速且功能全面" subtitle="简单易用，功能强大丰富。" - class="aspect-auto md:aspect-[1.1/1] max-md:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]" image="/images/hextra-doc.webp" - imageClass="top-[40%] left-[24px] w-[180%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[24px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card title="Markdown 写作" subtitle="只需使用 Markdown 进行编辑。多样的 Shortcode 组件开箱即用。" - class="aspect-auto md:aspect-[1.1/1] max-lg:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]" image="/images/hextra-markdown.webp" - imageClass="top-[40%] left-[36px] w-[180%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card title="全文搜索" subtitle="内置 FlexSearch 全文搜索，无需额外设置。" - class="aspect-auto md:aspect-[1.1/1] max-md:min-h-[340px]" + class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]" image="/images/hextra-search.webp" - imageClass="top-[40%] left-[36px] w-[110%] sm:w-[110%] dark:opacity-80" + imageClass="hx-top-[40%] hx-left-[36px] hx-w-[110%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(221,210,59,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card diff --git a/exampleSite/content/showcase/index.fa.md b/exampleSite/content/showcase/index.fa.md index 70eabb1b..11211803 100644 --- a/exampleSite/content/showcase/index.fa.md +++ b/exampleSite/content/showcase/index.fa.md @@ -5,9 +5,9 @@ toc: false layout: wide --- -
+
-

+

پروژه‌های متن‌باز که توسط هگزترا طراحی شده‌اند.

diff --git a/exampleSite/content/showcase/index.md b/exampleSite/content/showcase/index.md index b7de1fe8..5a799ed3 100644 --- a/exampleSite/content/showcase/index.md +++ b/exampleSite/content/showcase/index.md @@ -5,9 +5,9 @@ toc: false layout: wide --- -
+
-

+

Open source projects powered by Hextra.

diff --git a/exampleSite/content/showcase/index.zh-cn.md b/exampleSite/content/showcase/index.zh-cn.md index 99aabc1c..2959c8f2 100644 --- a/exampleSite/content/showcase/index.zh-cn.md +++ b/exampleSite/content/showcase/index.zh-cn.md @@ -5,9 +5,9 @@ toc: false layout: wide --- -
+
-

+

由 Hextra 驱动的开源网站和项目。

diff --git a/exampleSite/hugo_stats.json b/exampleSite/hugo_stats.json index 96fe6508..46e46a7d 100644 --- a/exampleSite/hugo_stats.json +++ b/exampleSite/hugo_stats.json @@ -58,231 +58,158 @@ "ul" ], "classes": [ - "-mb-0.5", - "-ml-2", - "-mr-2", - "-mt-20", + "-hx-mb-0.5", + "-hx-ml-2", + "-hx-mr-2", + "-hx-mt-20", "[-webkit-tap-highlight-color:transparent]", "[-webkit-touch-callout:none]", "[counter-reset:step]", "[hyphens:auto]", "[transition:background-color_1.5s_ease]", "[word-break:break-word]", - "absolute", - "active:bg-gray-400/20", - "active:opacity-50", - "active:shadow-gray-200", - "active:shadow-sm", - "align-[-2.5px]", - "align-text-bottom", - "appearance-none", - "aspect-auto", - "before:absolute", - "before:bg-glass-gradient", - "before:bg-gray-200", - "before:content-[\"\"]", - "before:content-['#']", - "before:content-['']", - "before:inline-block", - "before:inset-0", - "before:inset-y-1", - "before:mr-1", - "before:opacity-25", - "before:pointer-events-none", - "before:transition-transform", - "before:w-px", - "bg-black/80", - "bg-black/[.05]", - "bg-blue-100", - "bg-clip-text", - "bg-gradient-to-r", - "bg-gray-100", - "bg-neutral-50", - "bg-orange-50", - "bg-primary-100", - "bg-primary-400", - "bg-primary-600", - "bg-primary-700/5", - "bg-red-100", - "bg-transparent", - "bg-white", - "bg-yellow-50", - "block", - "border", - "border-b", - "border-b-2", - "border-black/5", - "border-blue-200", - "border-gray-200", - "border-gray-500", - "border-l", - "border-orange-100", - "border-red-200", - "border-t", - "border-transparent", - "border-yellow-100", - "bottom-0", - "break-words", - "capitalize", + "active:hx-bg-gray-400/20", + "active:hx-opacity-50", + "active:hx-shadow-gray-200", + "active:hx-shadow-sm", + "before:hx-absolute", + "before:hx-bg-glass-gradient", + "before:hx-bg-gray-200", + "before:hx-content-[\"\"]", + "before:hx-content-['#']", + "before:hx-content-['']", + "before:hx-inline-block", + "before:hx-inset-0", + "before:hx-inset-y-1", + "before:hx-mr-1", + "before:hx-opacity-25", + "before:hx-pointer-events-none", + "before:hx-transition-transform", + "before:hx-w-px", "chroma", "code-block", "code-copy-btn", "content", - "contrast-more:border", - "contrast-more:border-current", - "contrast-more:border-gray-800", - "contrast-more:border-gray-900", - "contrast-more:border-neutral-400", - "contrast-more:border-primary-500", - "contrast-more:border-t", - "contrast-more:border-transparent", - "contrast-more:dark:border-current", - "contrast-more:dark:border-gray-50", - "contrast-more:dark:border-neutral-400", - "contrast-more:dark:border-primary-500", - "contrast-more:dark:hover:border-gray-50", - "contrast-more:dark:shadow-[0_0_0_1px_#fff]", - "contrast-more:dark:shadow-none", - "contrast-more:dark:text-current", - "contrast-more:dark:text-gray-100", - "contrast-more:dark:text-gray-300", - "contrast-more:dark:text-gray-50", - "contrast-more:font-bold", - "contrast-more:hover:border-gray-900", - "contrast-more:shadow-[0_0_0_1px_#000]", - "contrast-more:shadow-none", - "contrast-more:text-current", - "contrast-more:text-gray-700", - "contrast-more:text-gray-800", - "contrast-more:text-gray-900", - "contrast-more:underline", + "contrast-more:dark:hover:hx-border-gray-50", + "contrast-more:dark:hx-border-current", + "contrast-more:dark:hx-border-gray-50", + "contrast-more:dark:hx-border-neutral-400", + "contrast-more:dark:hx-border-primary-500", + "contrast-more:dark:hx-shadow-[0_0_0_1px_#fff]", + "contrast-more:dark:hx-shadow-none", + "contrast-more:dark:hx-text-current", + "contrast-more:dark:hx-text-gray-100", + "contrast-more:dark:hx-text-gray-300", + "contrast-more:dark:hx-text-gray-50", + "contrast-more:hover:hx-border-gray-900", + "contrast-more:hx-border", + "contrast-more:hx-border-current", + "contrast-more:hx-border-gray-800", + "contrast-more:hx-border-gray-900", + "contrast-more:hx-border-neutral-400", + "contrast-more:hx-border-primary-500", + "contrast-more:hx-border-t", + "contrast-more:hx-border-transparent", + "contrast-more:hx-font-bold", + "contrast-more:hx-shadow-[0_0_0_1px_#000]", + "contrast-more:hx-shadow-none", + "contrast-more:hx-text-current", + "contrast-more:hx-text-gray-700", + "contrast-more:hx-text-gray-800", + "contrast-more:hx-text-gray-900", + "contrast-more:hx-underline", "copy-icon", - "cursor-default", - "cursor-pointer", - "dark:before:bg-neutral-800", - "dark:before:invert", - "dark:bg-black/60", - "dark:bg-blue-900/30", - "dark:bg-dark", - "dark:bg-dark/50", - "dark:bg-gray-50/10", - "dark:bg-neutral-800", - "dark:bg-neutral-900", - "dark:bg-orange-400/20", - "dark:bg-primary-300/10", - "dark:bg-primary-400/10", - "dark:bg-primary-600", - "dark:bg-red-900/30", - "dark:bg-yellow-700/30", - "dark:block", - "dark:border-blue-200/30", - "dark:border-gray-100/20", - "dark:border-gray-400", - "dark:border-neutral-700", - "dark:border-neutral-800", - "dark:border-orange-400/30", - "dark:border-red-200/30", - "dark:border-white/10", - "dark:border-yellow-200/30", - "dark:contrast-more:border-neutral-400", - "dark:focus:bg-dark", - "dark:focus:ring-primary-800", - "dark:from-gray-100", - "dark:hidden", - "dark:hover:bg-gray-100/5", - "dark:hover:bg-neutral-700", - "dark:hover:bg-neutral-800", - "dark:hover:bg-neutral-900", - "dark:hover:bg-primary-100/5", - "dark:hover:bg-primary-700", - "dark:hover:border-gray-100", - "dark:hover:border-gray-600", - "dark:hover:border-neutral-500", - "dark:hover:border-neutral-700", - "dark:hover:border-neutral-800", - "dark:hover:shadow-none", - "dark:hover:text-gray-100", - "dark:hover:text-gray-200", - "dark:hover:text-gray-300", - "dark:hover:text-gray-50", - "dark:hover:text-neutral-50", - "dark:hover:text-white", - "dark:opacity-80", - "dark:placeholder:text-gray-400", - "dark:ring-white/20", - "dark:shadow-[0_-12px_16px_#111]", - "dark:shadow-[0_-1px_0_rgba(255,255,255,.1)_inset]", - "dark:shadow-none", - "dark:text-blue-200", - "dark:text-gray-100", - "dark:text-gray-200", - "dark:text-gray-300", - "dark:text-gray-400", - "dark:text-gray-50", - "dark:text-neutral-200", - "dark:text-neutral-400", - "dark:text-orange-300", - "dark:text-primary-600", - "dark:text-red-200", - "dark:text-slate-100", - "dark:text-yellow-200", - "dark:to-gray-400", - "data-[state=closed]:hidden", - "data-[state=open]:hidden", - "data-[state=selected]:block", - "data-[state=selected]:border-primary-500", - "data-[state=selected]:text-primary-600", - "decoration-from-font", - "duration-200", - "duration-75", - "ease-in", + "dark:before:hx-bg-neutral-800", + "dark:before:hx-invert", + "dark:contrast-more:hx-border-neutral-400", + "dark:focus:hx-bg-dark", + "dark:focus:hx-ring-primary-800", + "dark:hover:hx-bg-gray-100/5", + "dark:hover:hx-bg-neutral-700", + "dark:hover:hx-bg-neutral-800", + "dark:hover:hx-bg-neutral-900", + "dark:hover:hx-bg-primary-100/5", + "dark:hover:hx-bg-primary-700", + "dark:hover:hx-border-gray-100", + "dark:hover:hx-border-gray-600", + "dark:hover:hx-border-neutral-500", + "dark:hover:hx-border-neutral-700", + "dark:hover:hx-border-neutral-800", + "dark:hover:hx-shadow-none", + "dark:hover:hx-text-gray-100", + "dark:hover:hx-text-gray-200", + "dark:hover:hx-text-gray-300", + "dark:hover:hx-text-gray-50", + "dark:hover:hx-text-neutral-50", + "dark:hover:hx-text-white", + "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-neutral-800", + "dark:hx-bg-neutral-900", + "dark:hx-bg-orange-400/20", + "dark:hx-bg-primary-300/10", + "dark:hx-bg-primary-400/10", + "dark:hx-bg-primary-600", + "dark:hx-bg-red-900/30", + "dark:hx-bg-yellow-700/30", + "dark:hx-block", + "dark:hx-border-blue-200/30", + "dark:hx-border-gray-100/20", + "dark:hx-border-gray-400", + "dark:hx-border-neutral-700", + "dark:hx-border-neutral-800", + "dark:hx-border-orange-400/30", + "dark:hx-border-red-200/30", + "dark:hx-border-white/10", + "dark:hx-border-yellow-200/30", + "dark:hx-from-gray-100", + "dark:hx-hidden", + "dark:hx-opacity-80", + "dark:hx-ring-white/20", + "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-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-neutral-200", + "dark:hx-text-neutral-400", + "dark:hx-text-orange-300", + "dark:hx-text-primary-600", + "dark:hx-text-red-200", + "dark:hx-text-slate-100", + "dark:hx-text-yellow-200", + "dark:hx-to-gray-400", + "dark:placeholder:hx-text-gray-400", + "data-[state=closed]:hx-hidden", + "data-[state=open]:hx-hidden", + "data-[state=selected]:hx-block", + "data-[state=selected]:hx-border-primary-500", + "data-[state=selected]:hx-text-primary-600", "filename", - "first:mt-0", - "fixed", - "flex", - "flex-col", - "flex-wrap", - "focus:bg-white", - "focus:outline-none", - "focus:ring-4", - "focus:ring-primary-300", - "font-bold", - "font-extrabold", - "font-medium", - "font-mono", - "font-normal", - "font-semibold", + "first:hx-mt-0", + "focus:hx-bg-white", + "focus:hx-outline-none", + "focus:hx-ring-4", + "focus:hx-ring-primary-300", "footnote-backref", "footnote-ref", "footnotes", - "from-gray-900", - "gap-1", - "gap-2", - "gap-4", - "gap-x-1.5", - "gap-y-2", - "grid", - "grid-cols-1", - "group", - "group-[.copied]/copybtn:block", - "group-[.copied]/copybtn:hidden", - "group-data-[theme=dark]:hidden", - "group-data-[theme=light]:hidden", - "group-hover/code:opacity-100", - "group-hover:underline", - "group-open:before:rotate-90", + "group-[.copied]/copybtn:hx-block", + "group-[.copied]/copybtn:hx-hidden", + "group-data-[theme=dark]:hx-hidden", + "group-data-[theme=light]:hx-hidden", + "group-hover/code:hx-opacity-100", + "group-hover:hx-underline", + "group-open:before:hx-rotate-90", "group/code", "group/copybtn", - "grow", - "h-0", - "h-16", - "h-2", - "h-3.5", - "h-4", - "h-5", - "h-7", - "h-[18px]", - "h-full", "hamburger-menu", "hextra-card", "hextra-cards", @@ -293,312 +220,385 @@ "hextra-scrollbar", "hextra-sidebar-collapsible-button", "hextra-toc", - "hidden", "highlight", - "hover:bg-gray-100", - "hover:bg-gray-800/5", - "hover:bg-primary-50", - "hover:bg-primary-700", - "hover:bg-slate-50", - "hover:border-gray-200", - "hover:border-gray-300", - "hover:border-gray-400", - "hover:border-gray-900", - "hover:dark:bg-primary-500/10", - "hover:dark:text-primary-600", - "hover:opacity-60", - "hover:opacity-75", - "hover:shadow-gray-100", - "hover:shadow-lg", - "hover:shadow-md", - "hover:text-black", - "hover:text-gray-800", - "hover:text-gray-900", - "hover:text-primary-600", + "hover:dark:hx-bg-primary-500/10", + "hover:dark:hx-text-primary-600", + "hover:hx-bg-gray-100", + "hover:hx-bg-gray-800/5", + "hover:hx-bg-primary-50", + "hover:hx-bg-primary-700", + "hover:hx-bg-slate-50", + "hover:hx-border-gray-200", + "hover:hx-border-gray-300", + "hover:hx-border-gray-400", + "hover:hx-border-gray-900", + "hover:hx-opacity-60", + "hover:hx-opacity-75", + "hover:hx-shadow-gray-100", + "hover:hx-shadow-lg", + "hover:hx-shadow-md", + "hover:hx-text-black", + "hover:hx-text-gray-800", + "hover:hx-text-gray-900", + "hover:hx-text-primary-600", + "hx-absolute", + "hx-align-[-2.5px]", + "hx-align-text-bottom", + "hx-appearance-none", + "hx-aspect-auto", + "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-neutral-50", + "hx-bg-orange-50", + "hx-bg-primary-100", + "hx-bg-primary-400", + "hx-bg-primary-600", + "hx-bg-primary-700/5", + "hx-bg-red-100", + "hx-bg-transparent", + "hx-bg-white", + "hx-bg-yellow-50", + "hx-block", + "hx-border", + "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-l", + "hx-border-orange-100", + "hx-border-red-200", + "hx-border-t", + "hx-border-transparent", + "hx-border-yellow-100", + "hx-bottom-0", + "hx-break-words", + "hx-capitalize", + "hx-cursor-default", + "hx-cursor-pointer", + "hx-decoration-from-font", + "hx-duration-200", + "hx-duration-75", + "hx-ease-in", + "hx-fixed", + "hx-flex", + "hx-flex-col", + "hx-flex-wrap", + "hx-font-bold", + "hx-font-extrabold", + "hx-font-medium", + "hx-font-mono", + "hx-font-normal", + "hx-font-semibold", + "hx-from-gray-900", + "hx-gap-1", + "hx-gap-2", + "hx-gap-4", + "hx-gap-x-1.5", + "hx-gap-y-2", + "hx-grid", + "hx-grid-cols-1", + "hx-group", + "hx-grow", + "hx-h-0", + "hx-h-16", + "hx-h-2", + "hx-h-3.5", + "hx-h-4", + "hx-h-5", + "hx-h-7", + "hx-h-[18px]", + "hx-h-full", + "hx-hidden", + "hx-inline", + "hx-inline-block", + "hx-inline-flex", + "hx-inset-0", + "hx-inset-x-0", + "hx-inset-y-0", + "hx-items-center", + "hx-items-start", + "hx-justify-between", + "hx-justify-center", + "hx-justify-end", + "hx-justify-items-start", + "hx-justify-start", + "hx-leading-5", + "hx-leading-6", + "hx-leading-7", + "hx-leading-none", + "hx-leading-tight", + "hx-left-[24px]", + "hx-left-[36px]", + "hx-line-clamp-3", + "hx-list-none", + "hx-m-[11px]", + "hx-max-h-64", + "hx-max-h-[calc(100vh-var(--navbar-height)-env(safe-area-inset-bottom))]", + "hx-max-h-[min(calc(50vh-11rem-env(safe-area-inset-bottom)),400px)]", + "hx-max-w-6xl", + "hx-max-w-[50%]", + "hx-max-w-[90rem]", + "hx-max-w-[min(calc(100vw-2rem),calc(100%+20rem))]", + "hx-max-w-none", + "hx-max-w-screen-xl", + "hx-mb-10", + "hx-mb-12", + "hx-mb-16", + "hx-mb-2", + "hx-mb-4", + "hx-mb-6", + "hx-mb-8", + "hx-min-h-[100px]", + "hx-min-h-[calc(100vh-var(--navbar-height))]", + "hx-min-w-0", + "hx-min-w-[18px]", + "hx-min-w-[24px]", + "hx-min-w-full", + "hx-ml-1", + "hx-ml-4", + "hx-mr-1", + "hx-mr-2", + "hx-mt-1", + "hx-mt-1.5", + "hx-mt-12", + "hx-mt-16", + "hx-mt-2", + "hx-mt-4", + "hx-mt-5", + "hx-mt-6", + "hx-mt-8", + "hx-mx-1", + "hx-mx-2", + "hx-mx-4", + "hx-mx-auto", + "hx-my-1.5", + "hx-my-2", + "hx-no-underline", + "hx-opacity-0", + "hx-opacity-50", + "hx-opacity-80", + "hx-order-last", + "hx-origin-center", + "hx-overflow-auto", + "hx-overflow-hidden", + "hx-overflow-x-auto", + "hx-overflow-x-hidden", + "hx-overflow-y-auto", + "hx-overscroll-contain", + "hx-p-0.5", + "hx-p-1", + "hx-p-1.5", + "hx-p-2", + "hx-p-4", + "hx-p-6", + "hx-pb-8", + "hx-pb-[env(safe-area-inset-bottom)]", + "hx-pb-px", + "hx-pl-5", + "hx-pl-6", + "hx-pl-[max(env(safe-area-inset-left),1.5rem)]", + "hx-pointer-events-none", + "hx-pr-2", + "hx-pr-4", + "hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]", + "hx-pr-[max(env(safe-area-inset-left),1.5rem)]", + "hx-pr-[max(env(safe-area-inset-right),1.5rem)]", + "hx-pt-4", + "hx-pt-6", + "hx-pt-8", + "hx-px-1.5", + "hx-px-2", + "hx-px-3", + "hx-px-4", + "hx-px-6", + "hx-py-1", + "hx-py-1.5", + "hx-py-12", + "hx-py-2", + "hx-py-2.5", + "hx-py-3", + "hx-py-4", + "hx-relative", + "hx-right-0", + "hx-ring-1", + "hx-ring-black/5", + "hx-rounded", + "hx-rounded-3xl", + "hx-rounded-full", + "hx-rounded-lg", + "hx-rounded-md", + "hx-rounded-sm", + "hx-rounded-t", + "hx-rounded-xl", + "hx-scroll-my-6", + "hx-scroll-py-6", + "hx-select-none", + "hx-shadow", + "hx-shadow-[0_-12px_16px_#fff]", + "hx-shadow-[0_-12px_16px_white]", + "hx-shadow-[0_2px_4px_rgba(0,0,0,.02),0_1px_0_rgba(0,0,0,.06)]", + "hx-shadow-gray-100", + "hx-shadow-lg", + "hx-shadow-sm", + "hx-shadow-xl", + "hx-shrink-0", + "hx-sr-only", + "hx-sticky", + "hx-text-2xl", + "hx-text-4xl", + "hx-text-[10px]", + "hx-text-[color:hsl(var(--primary-hue),100%,50%)]", + "hx-text-base", + "hx-text-blue-900", + "hx-text-center", + "hx-text-current", + "hx-text-ellipsis", + "hx-text-gray-100", + "hx-text-gray-500", + "hx-text-gray-600", + "hx-text-gray-700", + "hx-text-gray-800", + "hx-text-gray-900", + "hx-text-left", + "hx-text-lg", + "hx-text-orange-800", + "hx-text-primary-800", + "hx-text-red-900", + "hx-text-slate-900", + "hx-text-sm", + "hx-text-transparent", + "hx-text-white", + "hx-text-xl", + "hx-text-xs", + "hx-text-yellow-900", + "hx-to-gray-600", + "hx-top-0", + "hx-top-16", + "hx-top-8", + "hx-top-[40%]", + "hx-top-full", + "hx-tracking-tight", + "hx-tracking-tighter", + "hx-transition", + "hx-transition-all", + "hx-transition-colors", + "hx-transition-opacity", + "hx-transition-transform", + "hx-underline", + "hx-underline-offset-2", + "hx-w-2", + "hx-w-3.5", + "hx-w-4", + "hx-w-64", + "hx-w-[110%]", + "hx-w-[180%]", + "hx-w-full", + "hx-w-max", + "hx-w-screen", + "hx-whitespace-nowrap", + "hx-z-10", + "hx-z-20", + "hx-z-[-1]", "icon", - "inline", - "inline-block", - "inline-flex", - "inset-0", - "inset-x-0", - "inset-y-0", - "items-center", - "items-start", - "justify-between", - "justify-center", - "justify-end", - "justify-items-start", - "justify-start", "language-options", "language-switcher", - "last-of-type:mb-0", - "leading-5", - "leading-6", - "leading-7", - "leading-none", - "leading-tight", - "left-[24px]", - "left-[36px]", - "lg:grid-cols-3", - "line-clamp-3", - "list-none", + "last-of-type:hx-mb-0", + "lg:hx-grid-cols-3", "lntable", "lntd", - "ltr:-mr-4", - "ltr:before:left-0", - "ltr:md:left-auto", - "ltr:ml-3", - "ltr:ml-auto", - "ltr:mr-auto", - "ltr:pl-12", - "ltr:pl-16", - "ltr:pl-3", - "ltr:pl-4", - "ltr:pl-8", - "ltr:pr-0", - "ltr:pr-2", - "ltr:pr-4", - "ltr:pr-9", - "ltr:right-1.5", - "ltr:right-3", - "ltr:rotate-180", - "ltr:text-right", - "m-[11px]", - "max-h-64", - "max-h-[calc(100vh-var(--navbar-height)-env(safe-area-inset-bottom))]", - "max-h-[min(calc(50vh-11rem-env(safe-area-inset-bottom)),400px)]", - "max-lg:min-h-[340px]", + "ltr:before:hx-left-0", + "ltr:hx--mr-4", + "ltr:hx-ml-3", + "ltr:hx-ml-auto", + "ltr:hx-mr-auto", + "ltr:hx-pl-12", + "ltr:hx-pl-16", + "ltr:hx-pl-3", + "ltr:hx-pl-4", + "ltr:hx-pl-8", + "ltr:hx-pr-0", + "ltr:hx-pr-2", + "ltr:hx-pr-4", + "ltr:hx-pr-9", + "ltr:hx-right-1.5", + "ltr:hx-right-3", + "ltr:hx-rotate-180", + "ltr:hx-text-right", + "ltr:md:hx-left-auto", + "max-lg:hx-min-h-[340px]", "max-md:[transform:translate3d(0,-100%,0)]", - "max-md:hidden", - "max-md:min-h-[340px]", - "max-w-6xl", - "max-w-[50%]", - "max-w-[90rem]", - "max-w-[min(calc(100vw-2rem),calc(100%+20rem))]", - "max-w-none", - "max-w-screen-xl", - "max-xl:hidden", - "mb-10", - "mb-12", - "mb-16", - "mb-2", - "mb-4", - "mb-6", - "mb-8", - "md:aspect-[1.1/1]", - "md:h-[calc(100vh-var(--navbar-height)-var(--menu-height))]", - "md:hidden", - "md:inline-block", - "md:justify-start", - "md:max-h-[min(calc(100vh-5rem-env(safe-area-inset-bottom)),400px)]", - "md:pt-12", - "md:px-12", - "md:self-start", - "md:shrink-0", - "md:sticky", - "md:text-5xl", - "md:text-lg", - "md:text-sm", - "md:top-16", - "md:w-64", + "max-md:hx-hidden", + "max-md:hx-min-h-[340px]", + "max-xl:hx-hidden", + "md:hx-aspect-[1.1/1]", + "md:hx-h-[calc(100vh-var(--navbar-height)-var(--menu-height))]", + "md:hx-hidden", + "md:hx-inline-block", + "md:hx-justify-start", + "md:hx-max-h-[min(calc(100vh-5rem-env(safe-area-inset-bottom)),400px)]", + "md:hx-pt-12", + "md:hx-px-12", + "md:hx-self-start", + "md:hx-shrink-0", + "md:hx-sticky", + "md:hx-text-5xl", + "md:hx-text-lg", + "md:hx-text-sm", + "md:hx-top-16", + "md:hx-w-64", "mermaid", - "min-h-[100px]", - "min-h-[calc(100vh-var(--navbar-height))]", - "min-w-0", - "min-w-[18px]", - "min-w-[24px]", - "min-w-full", - "ml-1", - "ml-4", "mobile-menu-overlay", - "mr-1", - "mr-2", - "mt-1", - "mt-1.5", - "mt-12", - "mt-16", - "mt-2", - "mt-4", - "mt-5", - "mt-6", - "mt-8", - "mx-1", - "mx-2", - "mx-4", - "mx-auto", - "my-1.5", - "my-2", "nav-container", "nav-container-blur", "next-error-h1", - "no-underline", "not-prose", - "opacity-0", - "opacity-50", - "opacity-80", "open", - "order-last", - "origin-center", - "overflow-auto", - "overflow-hidden", - "overflow-x-auto", - "overflow-x-hidden", - "overflow-y-auto", - "overscroll-contain", - "p-0.5", - "p-1", - "p-1.5", - "p-2", - "p-4", - "p-6", - "pb-8", - "pb-[env(safe-area-inset-bottom)]", - "pb-px", - "pl-5", - "pl-6", - "pl-[max(env(safe-area-inset-left),1.5rem)]", - "placeholder:text-gray-500", - "pointer-events-none", - "pr-2", - "pr-4", - "pr-[calc(env(safe-area-inset-right)-1.5rem)]", - "pr-[max(env(safe-area-inset-left),1.5rem)]", - "pr-[max(env(safe-area-inset-right),1.5rem)]", - "print:bg-transparent", - "print:hidden", - "pt-4", - "pt-6", - "pt-8", - "px-1.5", - "px-2", - "px-3", - "px-4", - "px-6", - "py-1", - "py-1.5", - "py-12", - "py-2", - "py-2.5", - "py-3", - "py-4", - "relative", - "right-0", - "ring-1", - "ring-black/5", - "rounded", - "rounded-3xl", - "rounded-full", - "rounded-lg", - "rounded-md", - "rounded-sm", - "rounded-t", - "rounded-xl", - "rtl:-ml-4", - "rtl:-rotate-180", - "rtl:before:right-0", - "rtl:before:rotate-180", - "rtl:left-1.5", - "rtl:left-3", - "rtl:md:right-auto", - "rtl:ml-auto", - "rtl:mr-3", - "rtl:mr-auto", - "rtl:pl-2", - "rtl:pl-4", - "rtl:pl-9", - "rtl:pr-12", - "rtl:pr-16", - "rtl:pr-3", - "rtl:pr-4", - "rtl:pr-8", - "rtl:text-left", - "scroll-my-6", - "scroll-py-6", + "placeholder:hx-text-gray-500", + "print:hx-bg-transparent", + "print:hx-hidden", + "rtl:-hx-rotate-180", + "rtl:before:hx-right-0", + "rtl:before:hx-rotate-180", + "rtl:hx--ml-4", + "rtl:hx-left-1.5", + "rtl:hx-left-3", + "rtl:hx-ml-auto", + "rtl:hx-mr-3", + "rtl:hx-mr-auto", + "rtl:hx-pl-2", + "rtl:hx-pl-4", + "rtl:hx-pl-9", + "rtl:hx-pr-12", + "rtl:hx-pr-16", + "rtl:hx-pr-3", + "rtl:hx-pr-4", + "rtl:hx-pr-8", + "rtl:hx-text-left", + "rtl:md:hx-right-auto", "search-input", "search-results", "search-wrapper", - "select-none", - "shadow", - "shadow-[0_-12px_16px_#fff]", - "shadow-[0_-12px_16px_white]", - "shadow-[0_2px_4px_rgba(0,0,0,.02),0_1px_0_rgba(0,0,0,.06)]", - "shadow-gray-100", - "shadow-lg", - "shadow-sm", - "shadow-xl", - "shrink-0", "sidebar-active-item", "sidebar-container", - "sm:block", - "sm:flex", - "sm:grid-cols-2", - "sm:items-start", - "sm:text-xl", - "sm:w-[110%]", - "sr-only", + "sm:hx-block", + "sm:hx-flex", + "sm:hx-grid-cols-2", + "sm:hx-items-start", + "sm:hx-text-xl", + "sm:hx-w-[110%]", "steps", - "sticky", "subheading-anchor", "success-icon", "tabs-panel", "tabs-toggle", - "text-2xl", - "text-4xl", - "text-[10px]", - "text-[color:hsl(var(--primary-hue),100%,50%)]", - "text-base", - "text-blue-900", - "text-center", - "text-current", - "text-ellipsis", - "text-gray-100", - "text-gray-500", - "text-gray-600", - "text-gray-700", - "text-gray-800", - "text-gray-900", - "text-left", - "text-lg", - "text-orange-800", - "text-primary-800", - "text-red-900", - "text-slate-900", - "text-sm", - "text-transparent", - "text-white", - "text-xl", - "text-xs", - "text-yellow-900", "theme-toggle", - "to-gray-600", - "top-0", - "top-16", - "top-8", - "top-[40%]", - "top-full", - "tracking-tight", - "tracking-tighter", - "transition", - "transition-all", - "transition-colors", - "transition-opacity", - "transition-transform", - "underline", - "underline-offset-2", - "w-2", - "w-3.5", - "w-4", - "w-64", - "w-[110%]", - "w-[180%]", - "w-full", - "w-max", - "w-screen", - "whitespace-nowrap", - "xl:block", - "z-10", - "z-20", - "z-[-1]" + "xl:hx-block" ], "ids": null } diff --git a/layouts/_default/_markup/render-codeblock-mermaid.html b/layouts/_default/_markup/render-codeblock-mermaid.html index fc15febe..314d679f 100644 --- a/layouts/_default/_markup/render-codeblock-mermaid.html +++ b/layouts/_default/_markup/render-codeblock-mermaid.html @@ -1,4 +1,4 @@ -
+
   {{- .Inner | safeHTML -}}
 

 {{- .Page.Store.Set "hasMermaid" true -}}
diff --git a/layouts/_default/_markup/render-codeblock.html b/layouts/_default/_markup/render-codeblock.html
index 1e23bd91..46e9ed6d 100644
--- a/layouts/_default/_markup/render-codeblock.html
+++ b/layouts/_default/_markup/render-codeblock.html
@@ -4,7 +4,7 @@
 {{- $copyCode := (T "copyCode") | default "Copy code" -}}
 
 
-

+

   {{- if $filename -}}
     
{{ $filename }}

   {{- end -}}
@@ -13,13 +13,13 @@
   {{- else -}}
     
{{ .Inner }}

   {{- end -}}
-  

+  

     
   

 

diff --git a/layouts/_default/_markup/render-heading.html b/layouts/_default/_markup/render-heading.html
index a6f836a9..45c63a59 100644
--- a/layouts/_default/_markup/render-heading.html
+++ b/layouts/_default/_markup/render-heading.html
@@ -1,7 +1,7 @@
 
   {{- .Text | safeHTML -}}
   {{- if gt .Level 1 -}}
-    
+    
     
   {{- end -}}
 
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index c7559f70..222dfb6c 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -1,14 +1,14 @@
 {{ define "main" }}
-  

+  

     {{ partial "sidebar.html" (dict "context" .) }}
     {{ partial "toc.html" . }}
-    

-      

+    

+      

         

           
{{ .Title }}

           {{ .Content }}
         

-        

+        

         {{ partial "components/last-updated.html" . }}
         {{ partial "components/comments.html" . }}
       

diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 01d98b86..61c49aad 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,16 +1,16 @@
 {{ define "main" }}
-  

+  

     {{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
     {{ partial "toc.html" . }}
-    

-      

-        

-        
{{ .Title }}

-        

+    

+      

+        

+        
{{ .Title }}

+        

         

           {{ .Content }}
         

-        

+        

         {{ partial "components/comments.html" . }}
       

     

diff --git a/layouts/_default/wide.html b/layouts/_default/wide.html
index 79d8b7cb..8813ced0 100644
--- a/layouts/_default/wide.html
+++ b/layouts/_default/wide.html
@@ -1,9 +1,9 @@
 {{ define "main" }}
-  

+  

     {{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" false) }}
-    

-      

-      
{{ .Title }}

+    

+      

+      
{{ .Title }}

       

         {{ .Content }}
       

diff --git a/layouts/blog/list.html b/layouts/blog/list.html
index b22de2ec..376d5bc0 100644
--- a/layouts/blog/list.html
+++ b/layouts/blog/list.html
@@ -1,33 +1,33 @@
 {{ define "main" }}
   {{- $readMore := (T "readMore") | default "Read more →" -}}
-  

+  

     {{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
-    

-      

-        

-        
{{ .Title }}

+    
-    
+    

   

 {{ end }}
diff --git a/layouts/blog/single.html b/layouts/blog/single.html
index db831231..2a637a41 100644
--- a/layouts/blog/single.html
+++ b/layouts/blog/single.html
@@ -1,22 +1,22 @@
 {{ define "main" }}
-  

+  

     {{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
     {{ partial "toc.html" . }}
-    

-      

+    

+      

         {{ partial "breadcrumb.html" . }}
-        
{{ .Title }}

-        

-          {{- with $date := .Date }}{{ partial "utils/format-date" $date }}{{ end -}}
+        
{{ .Title }}

+        

+          {{- with $date := .Date }}{{ partial "utils/format-date" $date }}{{ end -}}
           {{- $lazyLoading := site.Params.enableImageLazyLoading | default true -}}
-          {{ if and .Date .Params.authors }}·{{ end -}}
+          {{ if and .Date .Params.authors }}·{{ end -}}
           {{- with $.Params.authors -}}
             {{- range $i, $author := . -}}
               {{- if reflect.IsMap $author -}}
-                {{- if and $i (not $author.image) }},{{ end -}}
+                {{- if and $i (not $author.image) }},{{ end -}}
                 
                   {{- with $image := $author.image }}
@@ -25,12 +25,12 @@ 

+                    {{ $author.name }}
                   {{ end -}}
-                  
{{ $author.name }}

+                  
{{ $author.name }}

                 
               {{- else -}}
-                {{- if $i }},{{ end -}}{{ $author }}
+                {{- if $i }},{{ end -}}{{ $author }}
               {{- end -}}
             {{- end -}}
           {{- end -}}
diff --git a/layouts/docs/list.html b/layouts/docs/list.html
index 5ffe82b8..a91882ae 100644
--- a/layouts/docs/list.html
+++ b/layouts/docs/list.html
@@ -1,9 +1,9 @@
 {{ define "main" }}
-  

+  

     {{ partial "sidebar.html" (dict "context" .) }}
     {{ partial "toc.html" . }}
-    

-      

+    

+      

         {{ partial "breadcrumb.html" . }}
         

           
{{ .Title }}

diff --git a/layouts/docs/single.html b/layouts/docs/single.html
index 5ffe82b8..a91882ae 100644
--- a/layouts/docs/single.html
+++ b/layouts/docs/single.html
@@ -1,9 +1,9 @@
 {{ define "main" }}
-  

+  

     {{ partial "sidebar.html" (dict "context" .) }}
     {{ partial "toc.html" . }}
-    

-      

+    

+      

         {{ partial "breadcrumb.html" . }}
         

           
{{ .Title }}

diff --git a/layouts/hextra-home.html b/layouts/hextra-home.html
index 0ba7c647..54d792df 100644
--- a/layouts/hextra-home.html
+++ b/layouts/hextra-home.html
@@ -1,8 +1,8 @@
 {{ define "main" }}
-  

+  

     {{ partial "sidebar.html" (dict "context" . "disableSidebar" true) }}
-    

-      

+    

+      

         {{ .Content }}
       

     

diff --git a/layouts/index.html b/layouts/index.html
index 69cf277f..58e3bc96 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,10 +1,10 @@
 {{ define "main" }}
-  

+  

     {{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
     {{ partial "toc.html" . }}
-    

-      

-        
{{ .Title }}

+    

+      

+        
{{ .Title }}

         

           {{ .Content }}
         

diff --git a/layouts/partials/breadcrumb.html b/layouts/partials/breadcrumb.html
index 5470b2df..5b1042ed 100644
--- a/layouts/partials/breadcrumb.html
+++ b/layouts/partials/breadcrumb.html
@@ -1,13 +1,13 @@
-

+

   {{- range .Ancestors.Reverse }}
     {{- if not .IsHome }}
-      

+      

         {{ .LinkTitle }}
       

-      {{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"w-3.5 shrink-0 rtl:-rotate-180\"") -}}
+      {{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx-w-3.5 hx-shrink-0 rtl:-hx-rotate-180\"") -}}
     {{ end -}}
   {{ end -}}
-  

+  

     {{- .LinkTitle -}}
   

 

diff --git a/layouts/partials/components/last-updated.html b/layouts/partials/components/last-updated.html
index b7df01e6..7918fb12 100644
--- a/layouts/partials/components/last-updated.html
+++ b/layouts/partials/components/last-updated.html
@@ -3,10 +3,10 @@
 {{- if site.Params.displayUpdatedDate -}}
   {{- with .Lastmod -}}
     {{ $datetime := (time.Format "2006-01-02T15:04:05.000Z" .) }}
-    
{{ $lastUpdated }} 

+    
{{ $lastUpdated }} 

   {{- else -}}
-    

+    

   {{- end -}}
 {{- else -}}
-  

+  

 {{- end -}}
diff --git a/layouts/partials/components/pager.html b/layouts/partials/components/pager.html
index 35001c7b..cae58f5b 100644
--- a/layouts/partials/components/pager.html
+++ b/layouts/partials/components/pager.html
@@ -26,14 +26,14 @@
 {{- end -}}
 
 {{- if or $prev $next -}}
-  

+  

     {{- if $prev -}}
       
-        {{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"inline h-5 shrink-0 ltr:rotate-180\"") -}}
+        {{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx-inline hx-h-5 hx-shrink-0 ltr:hx-rotate-180\"") -}}
         {{- $prev.LinkTitle -}}
       
     {{- end -}}
@@ -41,10 +41,10 @@
       
         {{- $next.LinkTitle -}}
-        {{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"inline h-5 shrink-0 rtl:-rotate-180\"") -}}
+        {{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx-inline hx-h-5 hx-shrink-0 rtl:-hx-rotate-180\"") -}}
       
     {{- end -}}
   

diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 9e8a7429..72bef07c 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -4,42 +4,42 @@
 {{- $copyright := (T "copyright") | default "© 2023 Hextra." -}}
 {{- $poweredBy := (T "poweredBy") | default "Powered by Hextra" -}}
 
-{{- $footerWidth := "max-w-screen-xl" -}}
+{{- $footerWidth := "hx-max-w-screen-xl" -}}
 {{- with .Site.Params.footer.width -}}
   {{ if eq . "wide" -}}
-    {{ $footerWidth = "max-w-[90rem]" -}}
+    {{ $footerWidth = "hx-max-w-[90rem]" -}}
   {{ else if eq . "full" -}}
     {{ $footerWidth = "max-w-full" -}}
   {{ end -}}
 {{- end -}}
 
 
-