Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-03-07 14:09:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Style: Token renaming and style organization (#6337)

Browse Source 
## Summary

Align color names and organize style.css some more

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6337-Style-Token-renaming-and-style-organization-29a6d73d365081b69f25ce1298c67fdc)
by [Unito](https://www.unito.io)
This commit is contained in:
Alexander Brown
2025-10-28 12:13:28 -07:00
committed by GitHub
parent 0a80a288c0
commit b03cf7e11d
38 changed files with 235 additions and 406 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/graph/modals/ZoomControlsModal.vue
View File

@@ -148,6 +148,6 @@ watch(
</script>
<style>
.zoomInputContainer:focus-within {
border: 1px solid var(--color-pure-white);
border: 1px solid var(--color-white);
}
</style>

2
src/components/graph/selectionToolbox/MenuOptionItem.vue
View File

@@ -1,7 +1,7 @@
<template>
<div
v-if="option.type === 'divider'"
class="my-1 h-px bg-gray-200 dark-theme:bg-zinc-700"
class="my-1 h-px bg-smoke-200 dark-theme:bg-zinc-700"
/>
<div
v-else

6
src/components/graph/selectionToolbox/SubmenuPopover.vue
View File

@@ -20,15 +20,15 @@
:key="subOption.label"
:class="
isColorSubmenu
? 'w-7 h-7 flex items-center justify-center hover:bg-gray-100 dark-theme:hover:bg-zinc-700 rounded cursor-pointer'
: 'flex items-center gap-2 px-3 py-1.5 text-sm hover:bg-gray-100 dark-theme:hover:bg-zinc-700 rounded cursor-pointer'
? 'w-7 h-7 flex items-center justify-center hover:bg-smoke-100 dark-theme:hover:bg-zinc-700 rounded cursor-pointer'
: 'flex items-center gap-2 px-3 py-1.5 text-sm hover:bg-smoke-100 dark-theme:hover:bg-zinc-700 rounded cursor-pointer'
"
:title="subOption.label"
@click="handleSubmenuClick(subOption)"
>
<div
v-if="subOption.color"
class="h-5 w-5 rounded-full border border-gray-300 dark-theme:border-zinc-600"
class="h-5 w-5 rounded-full border border-smoke-300 dark-theme:border-zinc-600"
:style="{ backgroundColor: subOption.color }"
/>
<template v-else-if="!subOption.color">

4
src/components/graph/selectionToolbox/VerticalDivider.vue
View File

@@ -1,3 +1,5 @@
<template>
<div class="h-6 w-px self-center bg-gray-300/10 dark-theme:bg-gray-600/10" />
<div
class="h-6 w-px self-center bg-smoke-300/10 dark-theme:bg-smoke-600/10"
/>
</template>

4
src/components/graph/widgets/ChatHistoryWidget.vue
View File

@@ -13,7 +13,7 @@
>
<div class="mb-1 flex justify-end">
<div
class="max-w-[80%] rounded-xl bg-gray-300 px-4 py-1 text-right dark-theme:bg-gray-800"
class="max-w-[80%] rounded-xl bg-smoke-300 px-4 py-1 text-right dark-theme:bg-smoke-800"
>
<div class="text-[12px] break-words">{{ item.prompt }}</div>
</div>
@@ -26,7 +26,7 @@
"
text
rounded
class="h-4! w-4! p-1! text-gray-400 transition hover:text-gray-600 hover:dark-theme:text-gray-200"
class="h-4! w-4! p-1! text-smoke-400 transition hover:text-smoke-600 hover:dark-theme:text-smoke-200"
pt:icon:class="text-xs!"
:icon="editIndex === i ? 'pi pi-times' : 'pi pi-pencil'"
:aria-label="

2
src/components/graph/widgets/chatHistory/CopyButton.vue
View File

@@ -5,7 +5,7 @@
"
text
rounded
class="h-4! w-6! p-1! text-gray-400 transition hover:text-gray-600 hover:dark-theme:text-gray-200"
class="h-4! w-6! p-1! text-smoke-400 transition hover:text-smoke-600 hover:dark-theme:text-smoke-200"
pt:icon:class="text-xs!"
:icon="copied ? 'pi pi-check' : 'pi pi-copy'"
:aria-label="