mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-21 23:34:31 +00:00
## Summary
Backports PR #6381 (UI color updates & tweaks) to core/1.30 branch.
This includes:
- Text readability improvements
- Semantic color token consistency updates
- UI element styling refinements
- Component import path fixes (ComfyLogoTransparent → ComfyLogo)
## Merge Conflicts Resolved
- **ComfyMenuButton.vue**: Accepted cherry-picked version with import
changes
- **20 browser test snapshots**: Used backportee's copy as instructed
**Original commit**: fd236b3587
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6679-Backport-PR-6381-to-core-1-30-UI-color-updates-tweaks-2aa6d73d3650815689defd191e3dd86e)
by [Unito](https://www.unito.io)
---------
Co-authored-by: GitHub Action <action@github.com>
Co-authored-by: github-actions <github-actions@github.com>
28 lines
730 B
Vue
28 lines
730 B
Vue
<template>
|
|
<Avatar
|
|
class="dark-theme:bg-[var(--interface-panel-selected-surface)] bg-gray-200"
|
|
:image="photoUrl ?? undefined"
|
|
:icon="hasAvatar ? undefined : 'icon-[lucide--user]'"
|
|
:pt:icon:class="{ 'size-4': !hasAvatar }"
|
|
shape="circle"
|
|
:aria-label="ariaLabel ?? $t('auth.login.userAvatar')"
|
|
@error="handleImageError"
|
|
/>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Avatar from 'primevue/avatar'
|
|
import { computed, ref } from 'vue'
|
|
|
|
const { photoUrl, ariaLabel } = defineProps<{
|
|
photoUrl?: string | null
|
|
ariaLabel?: string
|
|
}>()
|
|
|
|
const imageError = ref(false)
|
|
const handleImageError = () => {
|
|
imageError.value = true
|
|
}
|
|
const hasAvatar = computed(() => photoUrl && !imageError.value)
|
|
</script>
|