prettier tailwind class sorting

This commit is contained in:
2025-07-16 10:18:57 +02:00
parent c9bf3912f8
commit d0d54b09ba
9 changed files with 25 additions and 20 deletions

View File

@@ -3,5 +3,6 @@
"tabWidth": 4,
"trailingComma": "es5",
"semi": true,
"singleQuote": true
"singleQuote": true,
"plugins": ["prettier-plugin-tailwindcss"]
}

View File

@@ -34,6 +34,7 @@
"@types/byte-size": "^8.1.2",
"eslint-config-prettier": "^10.1.5",
"prettier": "^3.6.2",
"prettier-plugin-tailwindcss": "^0.6.14",
},
},
},
@@ -1532,6 +1533,8 @@
"prettier": ["prettier@3.6.2", "", { "bin": { "prettier": "bin/prettier.cjs" } }, "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ=="],
"prettier-plugin-tailwindcss": ["prettier-plugin-tailwindcss@0.6.14", "", { "peerDependencies": { "@ianvs/prettier-plugin-sort-imports": "*", "@prettier/plugin-hermes": "*", "@prettier/plugin-oxc": "*", "@prettier/plugin-pug": "*", "@shopify/prettier-plugin-liquid": "*", "@trivago/prettier-plugin-sort-imports": "*", "@zackad/prettier-plugin-twig": "*", "prettier": "^3.0", "prettier-plugin-astro": "*", "prettier-plugin-css-order": "*", "prettier-plugin-import-sort": "*", "prettier-plugin-jsdoc": "*", "prettier-plugin-marko": "*", "prettier-plugin-multiline-arrays": "*", "prettier-plugin-organize-attributes": "*", "prettier-plugin-organize-imports": "*", "prettier-plugin-sort-imports": "*", "prettier-plugin-style-order": "*", "prettier-plugin-svelte": "*" }, "optionalPeers": ["@ianvs/prettier-plugin-sort-imports", "@prettier/plugin-hermes", "@prettier/plugin-oxc", "@prettier/plugin-pug", "@shopify/prettier-plugin-liquid", "@trivago/prettier-plugin-sort-imports", "@zackad/prettier-plugin-twig", "prettier-plugin-astro", "prettier-plugin-css-order", "prettier-plugin-import-sort", "prettier-plugin-jsdoc", "prettier-plugin-marko", "prettier-plugin-multiline-arrays", "prettier-plugin-organize-attributes", "prettier-plugin-organize-imports", "prettier-plugin-sort-imports", "prettier-plugin-style-order", "prettier-plugin-svelte"] }, "sha512-pi2e/+ZygeIqntN+vC573BcW5Cve8zUB0SSAGxqpB4f96boZF4M3phPVoOFCeypwkpRYdi7+jQ5YJJUwrkGUAg=="],
"pretty-bytes": ["pretty-bytes@6.1.1", "", {}, "sha512-mQUvGU6aUFQ+rNvTIAcZuWGRT9a6f6Yrg9bHs4ImKF+HZCEK+plBvnAZYSIQztknZF2qnzNtr6F8s0+IuptdlQ=="],
"process": ["process@0.11.10", "", {}, "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A=="],

View File

@@ -43,7 +43,7 @@ async function openRenameDialog() {
<NuxtLink
:to="joinPaths(route.path, entry.name)"
:class="[
'flex flex-row gap-4 bg-accent/30 border-1 border-border px-4 py-2 rounded-md select-none w-52',
'bg-accent/30 border-border flex w-52 flex-row gap-4 rounded-md border-1 px-4 py-2 select-none',
{
'pointer-events-none':
disabled || entry.fileType === 'file',
@@ -55,7 +55,7 @@ async function openRenameDialog() {
</div>
<div
class="flex flex-col gap-0 leading-6 overflow-hidden truncate"
class="flex flex-col gap-0 truncate overflow-hidden leading-6"
>
<span>{{ entry.name }}</span>
<NuxtTime

View File

@@ -13,7 +13,7 @@ const sortedEntries = computed(() =>
</script>
<template>
<ScrollArea class="w-full h-full">
<ScrollArea class="h-full w-full">
<div class="flex flex-row flex-wrap gap-2">
<DirectoryEntry
v-for="entry in sortedEntries"

View File

@@ -209,14 +209,14 @@ async function submit() {
/>
<div
class="flex min-h-[280px] sm:min-h-[unset] sm:aspect-video w-full items-center justify-center rounded-xl border overflow-hidden"
class="flex min-h-[280px] w-full items-center justify-center overflow-hidden rounded-xl border sm:aspect-video sm:min-h-[unset]"
>
<ScrollArea
v-if="uploadStore.files.length > 0"
class="h-full w-full"
>
<div
class="flex h-full w-full flex-col items-stretch gap-2 text-left p-4"
class="flex h-full w-full flex-col items-stretch gap-2 p-4 text-left"
>
<UploadListEntry
v-for="(file, i) in uploadStore.files"

View File

@@ -16,15 +16,15 @@ function createObjectUrl(file: File): string {
<template>
<div
class="flex border rounded-lg flex-row items-center justify-between gap-4 px-3 py-3"
class="flex flex-row items-center justify-between gap-4 rounded-lg border px-3 py-3"
>
<div
:class="[
'rounded-md border overflow-hidden w-12 h-12 min-w-12 min-h-12 items-center justify-center flex',
'flex h-12 min-h-12 w-12 min-w-12 items-center justify-center overflow-hidden rounded-md border',
{ 'p-2': !file.data.type.startsWith('image/') },
]"
>
<div v-if="file.status === 'not_uploaded'" class="w-full h-full">
<div v-if="file.status === 'not_uploaded'" class="h-full w-full">
<img
v-if="file.data.type.startsWith('image/')"
:src="createObjectUrl(file.data)"
@@ -48,17 +48,17 @@ function createObjectUrl(file: File): string {
/>
<Icon
v-else-if="file.status === 'failed'"
class="h-5 w-5 text-destructive-foreground"
class="text-destructive-foreground h-5 w-5"
name="lucide:circle-alert"
/>
</div>
<div class="flex flex-col grow overflow-hidden">
<span class="font-medium truncate">{{ file.data.name }}</span>
<div class="flex grow flex-col overflow-hidden">
<span class="truncate font-medium">{{ file.data.name }}</span>
<span class="text-muted-foreground"
>{{ byteSize(file.data.size) }}
</span>
</div>
<div class="flex flex-row gap-2 items-center">
<div class="flex flex-row items-center gap-2">
<Button
variant="ghost"
size="icon"

View File

@@ -20,11 +20,11 @@ const breadcrumbs = computed(() => getBreadcrumbs(route.path));
<template>
<SidebarProvider>
<AppSidebar />
<main class="w-full grow overflow-hidden flex flex-col">
<main class="flex w-full grow flex-col overflow-hidden">
<header
class="h-16 flex items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12"
class="flex h-16 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12"
>
<div class="items-center flex gap-2 px-4 w-full">
<div class="flex w-full items-center gap-2 px-4">
<SidebarTrigger class="[&_svg]:size-4" />
<Separator orientation="vertical" class="mr-2 !h-4" />
<Breadcrumb>
@@ -76,7 +76,7 @@ const breadcrumbs = computed(() => getBreadcrumbs(route.path));
<Icon name="lucide:upload" />
<div
v-if="uploadStore.progress != null"
class="w-1.5 h-1.5 rounded-full bg-primary absolute top-1 right-1 animate-pulse"
class="bg-primary absolute top-1 right-1 h-1.5 w-1.5 animate-pulse rounded-full"
></div>
</Button>
</UploadDialog>

View File

@@ -40,6 +40,7 @@
"@nuxtjs/color-mode": "^3.5.2",
"@types/byte-size": "^8.1.2",
"eslint-config-prettier": "^10.1.5",
"prettier": "^3.6.2"
"prettier": "^3.6.2",
"prettier-plugin-tailwindcss": "^0.6.14"
}
}

View File

@@ -5,14 +5,14 @@ const store = useWarrenStore();
</script>
<template>
<ScrollArea class="w-full h-full">
<ScrollArea class="h-full w-full">
<div class="flex flex-row gap-2">
<NuxtLink
v-for="(warren, uuid) in store.warrens"
:key="uuid"
:to="`/warrens/${uuid}`"
>
<Button class="w-44 h-12" variant="outline" size="lg">
<Button class="h-12 w-44" variant="outline" size="lg">
<Icon name="lucide:folder-root" />
<span clas="truncate">{{ warren.name }}</span>
</Button>