mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-03-08 22:50:27 +00:00
493b1e42aa
## Summary Enable `better-tailwindcss/no-deprecated-classes` lint rule and auto-fix all 103 violations across 65 files. First PR in a stacked series for #9300. ## Changes - **What**: Replace deprecated Tailwind v3 classes with v4 equivalents: - `rounded` → `rounded-sm` (85) - `flex-shrink-0` → `shrink-0` (16) - `flex-grow` → `grow` (2) - Enable `no-deprecated-classes` as `'error'` in eslint config - Update one test asserting on `'rounded'` class string ## Review Focus Mechanical auto-fix PR — all changes produced by `eslint --fix`. No visual or behavioral changes (Tailwind v4 aliases these classes identically). Fixes #9300 (partial — 1 of 3 rules) ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-9417-fix-enable-no-deprecated-classes-tailwind-lint-rule-31a6d73d3650819eaef4cf8ad84fb186) by [Unito](https://www.unito.io) Co-authored-by: Alexander Brown <drjkl@comfy.org>
62 lines
1.8 KiB
Vue
62 lines
1.8 KiB
Vue
<template>
|
|
<div class="flex flex-col gap-4 text-sm text-muted-foreground">
|
|
<div class="flex flex-col gap-2">
|
|
<p class="m-0">
|
|
{{ $t('assetBrowser.modelAssociatedWithLink') }}
|
|
</p>
|
|
<div
|
|
class="flex items-center gap-3 rounded-lg bg-secondary-background px-4 py-2"
|
|
>
|
|
<img
|
|
v-if="previewImage"
|
|
:src="previewImage"
|
|
:alt="metadata?.filename || metadata?.name || 'Model preview'"
|
|
class="size-14 shrink-0 rounded-sm object-cover"
|
|
/>
|
|
<p class="m-0 min-w-0 flex-1 truncate text-base-foreground">
|
|
{{ metadata?.filename || metadata?.name }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Model Type Selection -->
|
|
<div class="flex flex-col gap-2">
|
|
<div class="flex items-center gap-2">
|
|
<label>
|
|
{{ $t('assetBrowser.modelTypeSelectorLabel') }}
|
|
</label>
|
|
<i class="icon-[lucide--circle-question-mark] text-muted-foreground" />
|
|
<span class="text-muted-foreground">
|
|
{{ $t('assetBrowser.notSureLeaveAsIs') }}
|
|
</span>
|
|
</div>
|
|
<SingleSelect
|
|
v-model="modelValue"
|
|
:label="
|
|
isLoading
|
|
? $t('g.loading')
|
|
: $t('assetBrowser.modelTypeSelectorPlaceholder')
|
|
"
|
|
:options="modelTypes"
|
|
:disabled="isLoading"
|
|
data-attr="upload-model-step2-type-selector"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import SingleSelect from '@/components/input/SingleSelect.vue'
|
|
import { useModelTypes } from '@/platform/assets/composables/useModelTypes'
|
|
import type { AssetMetadata } from '@/platform/assets/schemas/assetSchema'
|
|
|
|
defineProps<{
|
|
metadata?: AssetMetadata
|
|
previewImage?: string
|
|
}>()
|
|
|
|
const modelValue = defineModel<string | undefined>()
|
|
|
|
const { modelTypes, isLoading } = useModelTypes()
|
|
</script>
|