Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-05-03 12:42:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: enable enforce-consistent-class-order tailwind lint rule (#9428)

Browse Source 
## Summary

Enable `better-tailwindcss/enforce-consistent-class-order` lint rule and
auto-fix all 1027 violations across 263 files. Stacked on #9427.

## Changes

- **What**: Sort Tailwind classes into consistent order via `eslint
--fix`
- Enable `enforce-consistent-class-order` as `'error'` in eslint config
- Purely cosmetic reordering — no behavioral or visual changes

## Review Focus

Mechanical auto-fix PR — all changes are class reordering only. This is
the largest diff but lowest risk since it changes no class names, only
their order.

**Stack:** #9417 → #9427 → **this PR**

Fixes #9300 (partial — 3 of 3 rules)

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-9428-fix-enable-enforce-consistent-class-order-tailwind-lint-rule-31a6d73d3650811c9065f5178ba3e724)
by [Unito](https://www.unito.io)
This commit is contained in:
Christian Byrne
2026-03-05 17:24:34 -08:00
committed by GitHub
parent 60267fc64c
commit ef4e4a69d5
278 changed files with 1027 additions and 1027 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/platform/workspace/components/PricingTableWorkspace.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="flex flex-col gap-8">
<h2 class="text-xl lg:text-2xl text-muted-foreground m-0 text-center">
<h2 class="m-0 text-center text-xl text-muted-foreground lg:text-2xl">
{{ t('subscription.chooseBestPlanWorkspace') }}
</h2>
@@ -34,7 +34,7 @@
<span>{{ option.label }}</span>
<div
v-if="option.value === 'yearly'"
class="bg-primary-background text-white text-[11px] px-1 py-0.5 rounded-full flex items-center font-bold"
class="flex items-center rounded-full bg-primary-background px-1 py-0.5 text-[11px] font-bold text-white"
>
-20%
</div>
@@ -42,19 +42,19 @@
</template>
</SelectButton>
</div>
<div class="flex flex-col xl:flex-row items-stretch gap-6">
<div class="flex flex-col items-stretch gap-6 xl:flex-row">
<div
v-for="tier in tiers"
:key="tier.id"
:class="
cn(
'flex-1 flex flex-col rounded-2xl border border-border-default bg-base-background shadow-[0_0_12px_rgba(0,0,0,0.1)]',
'flex flex-1 flex-col rounded-2xl border border-border-default bg-base-background shadow-[0_0_12px_rgba(0,0,0,0.1)]',
tier.isPopular ? 'border-muted-foreground' : ''
)
"
>
<div class="p-8 pb-0 flex flex-col gap-8">
<div class="flex flex-row items-center gap-2 justify-between">
<div class="flex flex-col gap-8 p-8 pb-0">
<div class="flex flex-row items-center justify-between gap-2">
<span
class="font-inter text-base/normal font-bold text-base-foreground"
>
@@ -62,7 +62,7 @@
</span>
<div
v-if="tier.isPopular"
class="rounded-full bg-base-foreground px-1.5 text-[11px] font-bold uppercase text-base-background h-5 tracking-tight flex items-center"
class="flex h-5 items-center rounded-full bg-base-foreground px-1.5 text-[11px] font-bold tracking-tight text-base-background uppercase"
>
{{ t('subscription.mostPopular') }}
</div>
@@ -71,11 +71,11 @@
<div class="flex flex-col gap-2">
<div class="flex flex-row items-baseline gap-2">
<span
class="font-inter text-[32px] font-semibold leading-normal text-base-foreground"
class="font-inter text-[32px] leading-normal font-semibold text-base-foreground"
>
<span
v-show="currentBillingCycle === 'yearly'"
class="line-through text-2xl text-muted-foreground"
class="text-2xl text-muted-foreground line-through"
>
${{ getMonthlyPrice(tier) }}
</span>
@@ -99,13 +99,13 @@
</div>
</div>
<div class="flex flex-col gap-4 pb-0 flex-1">
<div class="flex flex-1 flex-col gap-4 pb-0">
<div class="flex flex-row items-center justify-between">
<span class="text-sm font-normal text-foreground">
<span class="text-foreground text-sm font-normal">
{{ t('subscription.monthlyCreditsPerMemberLabel') }}
</span>
<div class="flex flex-row items-center gap-1">
<i class="icon-[lucide--component] text-amber-400 text-sm" />
<i class="icon-[lucide--component] text-sm text-amber-400" />
<span
class="font-inter text-sm/normal font-bold text-base-foreground"
>
@@ -115,7 +115,7 @@
</div>
<div class="flex flex-row items-center justify-between">
<span class="text-sm font-normal text-foreground">
<span class="text-foreground text-sm font-normal">
{{ t('subscription.maxMembersLabel') }}
</span>
<span
@@ -126,7 +126,7 @@
</div>
<div class="flex flex-row items-center justify-between">
<span class="text-sm font-normal text-foreground">
<span class="text-foreground text-sm font-normal">
{{ t('subscription.maxDurationLabel') }}
</span>
<span
@@ -137,42 +137,42 @@
</div>
<div class="flex flex-row items-center justify-between">
<span class="text-sm font-normal text-foreground">
<span class="text-foreground text-sm font-normal">
{{ t('subscription.gpuLabel') }}
</span>
<i class="pi pi-check text-xs text-success-foreground" />
<i class="pi pi-check text-success-foreground text-xs" />
</div>
<div class="flex flex-row items-center justify-between">
<span class="text-sm font-normal text-foreground">
<span class="text-foreground text-sm font-normal">
{{ t('subscription.addCreditsLabel') }}
</span>
<i class="pi pi-check text-xs text-success-foreground" />
<i class="pi pi-check text-success-foreground text-xs" />
</div>
<div class="flex flex-row items-center justify-between">
<span class="text-sm font-normal text-foreground">
<span class="text-foreground text-sm font-normal">
{{ t('subscription.customLoRAsLabel') }}
</span>
<i
v-if="tier.customLoRAs"
class="pi pi-check text-xs text-success-foreground"
class="pi pi-check text-success-foreground text-xs"
/>
<i v-else class="pi pi-times text-xs text-foreground" />
<i v-else class="pi pi-times text-foreground text-xs" />
</div>
<div class="flex flex-col gap-2">
<div class="flex flex-row items-start justify-between">
<div class="flex flex-col gap-2">
<span class="text-sm/relaxed font-normal text-foreground">
<span class="text-foreground text-sm/relaxed font-normal">
{{ t('subscription.videoEstimateLabel') }}
</span>
<div class="flex flex-row items-center gap-2 group pt-2">
<div class="group flex flex-row items-center gap-2 pt-2">
<i
class="pi pi-question-circle text-xs text-muted-foreground group-hover:text-base-foreground"
/>
<span
class="text-sm font-normal text-muted-foreground cursor-pointer group-hover:text-base-foreground"
class="cursor-pointer text-sm font-normal text-muted-foreground group-hover:text-base-foreground"
@click="togglePopover"
>
{{ t('subscription.videoEstimateHelp') }}
@@ -198,8 +198,8 @@
'h-10 w-full',
getButtonTextClass(tier),
tier.key === 'creator'
? 'bg-base-foreground border-transparent hover:bg-inverted-background-hover'
: 'bg-secondary-background border-transparent hover:bg-secondary-background-hover focus:bg-secondary-background-selected'
? 'border-transparent bg-base-foreground hover:bg-inverted-background-hover'
: 'border-transparent bg-secondary-background hover:bg-secondary-background-hover focus:bg-secondary-background-selected'
)
"
@click="() => handleSubscribe(tier.key)"
@@ -234,7 +234,7 @@
href="https://cloud.comfy.org/?template=video_wan2_2_14B_i2v"
target="_blank"
rel="noopener noreferrer"
class="text-sm text-azure-600 hover:text-azure-400 no-underline flex gap-1"
class="flex gap-1 text-sm text-azure-600 no-underline hover:text-azure-400"
>
<span class="underline">
{{ t('subscription.videoEstimateTryTemplate') }}
@@ -245,7 +245,7 @@
</Popover>
<!-- Contact and Enterprise Links -->
<div class="flex flex-col items-center gap-2">
<p class="text-sm text-text-secondary m-0">
<p class="m-0 text-sm text-text-secondary">
{{ $t('subscription.haveQuestions') }}
</p>
<div class="flex items-center gap-1.5">