Skip to content

Commit c576352

Browse files
theskillwithintheskillwithin
authored
Update biome.json to auto fix ordering className (#42)
Fixes # # Description order tailwind className's on format save biomejs/biome#1362 ## Type of change Please mark relevant options with an `x` in the brackets. - [ ] Bug fix (non-breaking change which fixes an issue) - [ ] New feature (non-breaking change which adds functionality) - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) - [ ] This change requires a documentation update - [ ] Algorithm update - updates algorithm documentation/questions/answers etc. - [ ] Other (please describe): # How Has This Been Tested? Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration - [ ] Integration tests - [ ] Unit tests - [ ] Manual tests - [ ] No tests required # Reviewer checklist Mark everything that needs to be checked before merging the PR. - [ ] Check if the UI is working as expected and is satisfactory - [ ] Check if the code is well documented - [ ] Check if the behavior is what is expected - [ ] Check if the code is well tested - [ ] Check if the code is readable and well formatted - [ ] Additional checks (document below if any) # Screenshots (if appropriate): # Questions (if appropriate):
1 parent 6fdf8a9 commit c576352

File tree

5 files changed

+34
-26
lines changed

5 files changed

+34
-26
lines changed

‎app/library/language-switcher/LanguageSwitcher.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,10 @@ const LanguageSwitcher = () => {
88
const location = useLocation()
99

1010
return (
11-
<div className="flex gap-2 p-2 fixed top-0 right-0 w-min z-10">
11+
<div className="fixed top-0 right-0 z-10 flex w-min gap-2 p-2">
1212
{supportedLanguages.map((language) => (
1313
<Link
14-
className="text-blue-500 dark:text-white hover:underline transition-all"
14+
className="text-blue-500 transition-all hover:underline dark:text-white"
1515
key={language}
1616
to={`${location.pathname}`}
1717
// We override the default appending of the language to the search params via our language

‎app/root.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ export const Layout = ({ children }: { children: React.ReactNode }) => {
4242
<Meta />
4343
<Links />
4444
</head>
45-
<body className="w-full h-full">
45+
<body className="h-full w-full">
4646
<LanguageSwitcher />
4747
{children}
4848
<ScrollRestoration />
@@ -75,11 +75,11 @@ export const ErrorBoundary = () => {
7575
const errorStatusCode = statusCode()
7676

7777
return (
78-
<div className="placeholder-index relative h-full min-h-screen w-screen flex items-center bg-gradient-to-b from-gray-50 to-gray-100 dark:from-blue-950 dark:to-blue-900 justify-center dark:bg-white sm:pb-16 sm:pt-8">
78+
<div className="relative flex h-full min-h-screen w-screen items-center justify-center bg-gradient-to-b from-gray-50 to-gray-100 placeholder-index sm:pt-8 sm:pb-16 dark:bg-white dark:from-blue-950 dark:to-blue-900">
7979
<div className="relative mx-auto max-w-[90rem] sm:px-6 lg:px-8">
80-
<div className="relative min-h-72 flex flex-col justify-center sm:overflow-hidden sm:rounded-2xl p-1 md:p-4 lg:p-6">
81-
<h1 className="text-center w-full text-red-600 text-2xl pb-2">{t(`error.${errorStatusCode}.title`)}</h1>
82-
<p className="text-lg dark:text-white text-center w-full">{t(`error.${errorStatusCode}.description`)}</p>
80+
<div className="relative flex min-h-72 flex-col justify-center p-1 sm:overflow-hidden sm:rounded-2xl md:p-4 lg:p-6">
81+
<h1 className="w-full pb-2 text-center text-2xl text-red-600">{t(`error.${errorStatusCode}.title`)}</h1>
82+
<p className="w-full text-center text-lg dark:text-white">{t(`error.${errorStatusCode}.description`)}</p>
8383
</div>
8484
</div>
8585
</div>

‎app/routes/$.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -8,27 +8,27 @@ export default function Route404() {
88
const { t } = useTranslation()
99
const to = href("/")
1010
return (
11-
<div className="min-h-screen bg-gradient-to-b from-gray-50 to-gray-100 dark:from-blue-950 dark:to-blue-900 dark:text-white flex items-center justify-center p-4">
12-
<div className="max-w-2xl w-full text-center">
11+
<div className="flex min-h-screen items-center justify-center bg-gradient-to-b from-gray-50 to-gray-100 p-4 dark:from-blue-950 dark:to-blue-900 dark:text-white">
12+
<div className="w-full max-w-2xl text-center">
1313
<div className="mb-8 flex justify-center">
14-
<Icon name="Ghost" className="h-24 w-24 text-indigo-600 animate-float" />
14+
<Icon name="Ghost" className="h-24 w-24 animate-float text-indigo-600" />
1515
</div>
1616

17-
<h1 className="text-6xl font-bold dark:text-white text-gray-900 mb-4">404</h1>
18-
<h2 className="text-3xl font-semibold dark:text-white text-gray-800 mb-4">{t("error.404.title")}</h2>
19-
<p className="text-gray-600 dark:text-white mb-8 text-lg">{t("error.404.description")}</p>
17+
<h1 className="mb-4 font-bold text-6xl text-gray-900 dark:text-white">404</h1>
18+
<h2 className="mb-4 font-semibold text-3xl text-gray-800 dark:text-white">{t("error.404.title")}</h2>
19+
<p className="mb-8 text-gray-600 text-lg dark:text-white">{t("error.404.description")}</p>
2020

21-
<div className="flex flex-col sm:flex-row gap-4 justify-center">
21+
<div className="flex flex-col justify-center gap-4 sm:flex-row">
2222
<button
2323
type="button"
2424
onClick={() => navigate(-1)}
25-
className="inline-flex cursor-pointer items-center justify-center px-6 py-3 border border-transparent text-base font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-200 transition-colors duration-300"
25+
className="inline-flex cursor-pointer items-center justify-center rounded-md border border-transparent bg-indigo-100 px-6 py-3 font-medium text-base text-indigo-700 transition-colors duration-300 hover:bg-indigo-200"
2626
>
2727
{t("navigation.back")}
2828
</button>
2929
<Link
3030
to={to}
31-
className="inline-flex cursor-pointer items-center justify-center px-6 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 transition-colors duration-300"
31+
className="inline-flex cursor-pointer items-center justify-center rounded-md border border-transparent bg-indigo-600 px-6 py-3 font-medium text-base text-white transition-colors duration-300 hover:bg-indigo-700"
3232
>
3333
{t("navigation.home")}
3434
</Link>

‎app/routes/_index.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -19,18 +19,18 @@ export default function Index({ loaderData }: Route.ComponentProps) {
1919
const { t } = useTranslation()
2020

2121
return (
22-
<div className="placeholder-index relative h-full min-h-screen w-screen dark:bg-gradient-to-b bg-white dark:from-blue-950 dark:to-blue-900 dark:text-white sm:pb-16 sm:pt-8">
22+
<div className="relative h-full min-h-screen w-screen bg-white placeholder-index sm:pt-8 sm:pb-16 dark:bg-gradient-to-b dark:from-blue-950 dark:to-blue-900 dark:text-white">
2323
<div className="relative mx-auto max-w-[90rem] sm:px-6 lg:px-8">
2424
<div className="relative shadow-xl sm:overflow-hidden sm:rounded-2xl">
2525
<section className="absolute inset-0">
2626
<img className="h-full w-full object-cover" src="/banner.png" alt="Cover" />
2727
<div className="absolute inset-0 bg-slate-950/60 mix-blend-multiply" />
2828
</section>
29-
<section className="lg:pb-18 relative px-4 pb-8 pt-16 sm:px-6 sm:pb-14 sm:pt-24 lg:px-8 lg:pt-32">
30-
<h1 className="select-none overflow-hidden text-center text-7xl font-medium sm:text-6xl lg:text-8xl">
31-
<span className="block pb-2 pr-2 text-center font-space uppercase text-white drop-shadow-md">
32-
<img className="rounded-full size-80 m-auto" src="/logo.png" alt="Forge42 Logo" />
33-
<span className="block h-full bg-gradient-to-tr from-[#48DDF3] to-[#FB4BB5] bg-clip-text pb-1 pr-1 text-center text-transparent dark:from-indigo-500 dark:to-sky-300 sm:inline sm:pb-0">
29+
<section className="relative px-4 pt-16 pb-8 sm:px-6 sm:pt-24 sm:pb-14 lg:px-8 lg:pt-32 lg:pb-18">
30+
<h1 className="select-none overflow-hidden text-center font-medium text-7xl sm:text-6xl lg:text-8xl">
31+
<span className="block pr-2 pb-2 text-center font-space text-white uppercase drop-shadow-md">
32+
<img className="m-auto size-80 rounded-full" src="/logo.png" alt="Forge42 Logo" />
33+
<span className="block h-full bg-gradient-to-tr from-[#48DDF3] to-[#FB4BB5] bg-clip-text pr-1 pb-1 text-center text-transparent sm:inline sm:pb-0 dark:from-indigo-500 dark:to-sky-300">
3434
Base&nbsp;
3535
</span>
3636
<span className="text-center">Stack</span>
@@ -42,7 +42,7 @@ export default function Index({ loaderData }: Route.ComponentProps) {
4242
<a
4343
href="https://github.com/forge42dev/base-stack"
4444
target={"_blank"}
45-
className="text-white no-underline font-bold hover:cursor-pointer focus:text-white"
45+
className="font-bold text-white no-underline hover:cursor-pointer focus:text-white"
4646
rel="noreferrer"
4747
>
4848
README.md
@@ -56,8 +56,8 @@ export default function Index({ loaderData }: Route.ComponentProps) {
5656
</div>
5757
</div>
5858

59-
<div className="w-full text-center text-2xl mt-4">{t("hi")}</div>
60-
<section className="absolute bottom-1 mb-2 w-full pb-1 pt-2 text-center sm:bottom-2 sm:pb-3 md:mb-0 md:mt-0">
59+
<div className="mt-4 w-full text-center text-2xl">{t("hi")}</div>
60+
<section className="absolute bottom-1 mb-2 w-full pt-2 pb-1 text-center sm:bottom-2 sm:pb-3 md:mt-0 md:mb-0">
6161
Crafted with ❤️ / Time without timezone mismatch {timezoneDate}
6262
</section>
6363
</div>

‎biome.json‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,15 @@
4848
},
4949
"nursery": {
5050
"recommended": true,
51-
"noProcessEnv": "error"
51+
"noProcessEnv": "error",
52+
"useSortedClasses": {
53+
"level": "error",
54+
"fix": "safe",
55+
"options": {
56+
"attributes": ["className"],
57+
"functions": ["cn", "tw", "clsx", "twMerge"]
58+
}
59+
}
5260
}
5361
}
5462
},

0 commit comments

Comments
 (0)