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

* feat: add prefix to tailwind css classes

* fix: remove unnecessary prefixes

* fix: add missing prefix in other places

* chore: regenerate hugo_stats.json

* chore: run `npm run build:css`

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

* fix: lang switcher display issue

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

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

View File

@ -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;
}
}

View File

@ -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);
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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);
}
}