Color updates for labels

pull/7044/head
Cagatay Civici 2025-01-03 19:56:06 +03:00
parent d15023e1f0
commit afe9dc82e0
3 changed files with 9 additions and 11 deletions

View File

@ -16,8 +16,7 @@
<button <button
type="button" type="button"
@click="createThemeFromPreset" @click="createThemeFromPreset"
icon="pi pi-download" class="btn-design"
class="px-3 py-2 bg-zinc-950 hover:bg-zinc-800 text-white dark:bg-white dark:hover:bg-gray-100 dark:text-black rounded-md font-medium cursor-pointer transition-colors duration-200 focus:outline focus:outline-offset-2 focus:outline-zinc-950 focus:dark:outline-white"
> >
Create Create
</button> </button>
@ -34,8 +33,7 @@
<button <button
type="button" type="button"
@click="createThemeFromFigma" @click="createThemeFromFigma"
icon="pi pi-download" class="btn-design"
class="px-3 py-2 bg-zinc-950 hover:bg-zinc-800 text-white dark:bg-white dark:hover:bg-gray-100 dark:text-black rounded-md font-medium cursor-pointer transition-colors duration-200 focus:outline focus:outline-offset-2 focus:outline-zinc-950 focus:dark:outline-white"
> >
Create Create
</button> </button>

View File

@ -23,8 +23,8 @@
<button <button
type="button" type="button"
:class="[ :class="[
'rounded-xl h-32 w-32 bg-transparent border border-gray-200 dark:border-gray-700 text-black dark:text-white', 'rounded-xl h-32 w-32 bg-transparent border border-surface-200 dark:border-surface-700 text-black dark:text-white',
{ 'opacity-50 cursor-auto': themeLimitReached, 'hover:border-gray-400 dark:hover:border-gray-500': !themeLimitReached } { 'opacity-50 cursor-auto': themeLimitReached, 'hover:border-surface-400 dark:hover:border-surface-500': !themeLimitReached }
]" ]"
@click="openNewTheme" @click="openNewTheme"
> >
@ -38,7 +38,7 @@
<div v-for="theme of $appState.designer.themes" :key="theme.t_key" class="flex flex-col gap-2 relative"> <div v-for="theme of $appState.designer.themes" :key="theme.t_key" class="flex flex-col gap-2 relative">
<button <button
type="button" type="button"
class="rounded-xl h-32 w-32 px-4 overflow-hidden text-ellipsis bg-transparent border border-gray-200 dark:border-gray-700 hover:border-gray-400 dark:hover:border-gray-500 text-black dark:text-white" class="rounded-xl h-32 w-32 px-4 overflow-hidden text-ellipsis bg-transparent border border-surface-200 dark:border-surface-700 hover:border-surface-400 dark:hover:border-surface-500 text-black dark:text-white"
@click="loadTheme(theme)" @click="loadTheme(theme)"
> >
<span class="text-2xl uppercase font-bold">{{ abbrThemeName(theme) }}</span> <span class="text-2xl uppercase font-bold">{{ abbrThemeName(theme) }}</span>
@ -50,7 +50,7 @@
</div> </div>
<span class="text-muted-color text-xs">{{ formatTimestamp(theme.t_last_updated) }}</span> <span class="text-muted-color text-xs">{{ formatTimestamp(theme.t_last_updated) }}</span>
</div> </div>
<button type="button" @click="toggleMenuOptions($event, theme)" class="hover:bg-surface-100 dark:hover:bg-surface-800 text-zinc-500 dark:text-zinc-400 flex absolute top-1 right-1 w-8 h-8 rounded-lg items-center justify-center"> <button type="button" @click="toggleMenuOptions($event, theme)" class="hover:bg-surface-100 dark:hover:bg-surface-800 text-surface-500 dark:text-surface-400 flex absolute top-1 right-1 w-8 h-8 rounded-lg items-center justify-center">
<i class="pi pi-ellipsis-h !text-xs" /> <i class="pi pi-ellipsis-h !text-xs" />
</button> </button>
</div> </div>

View File

@ -1,8 +1,8 @@
<template> <template>
<div class="group"> <div class="group">
<div class="flex justify-between justify-items-center"> <div class="flex justify-between justify-items-center">
<label :for="inputId" class="text-xs text-zinc-700 dark:text-white block capitalize text-ellipsis overflow-hidden w-full whitespace-nowrap mb-px" :title="label">{{ label }}</label> <label :for="inputId" class="text-xs text-zinc-700 dark:text-white/70 block capitalize text-ellipsis overflow-hidden w-full whitespace-nowrap mb-px" :title="label">{{ label }}</label>
<button type="button" @click="transfer"><i class="pi pi-sort-alt !text-xs text-zinc-400 hidden group-hover:block animate-fadein" title="Transfer between color scheme and common"></i></button> <button type="button" @click="transfer"><i class="pi pi-sort-alt !text-xs text-zinc-700 dark:text-white/70 hidden group-hover:block animate-fadein" title="Transfer between color scheme and common"></i></button>
</div> </div>
<div :id="id" class="relative"> <div :id="id" class="relative">
<AutoComplete <AutoComplete
@ -16,7 +16,7 @@
:showEmptyMessage="false" :showEmptyMessage="false"
:pt="{ :pt="{
pcInputText: { pcInputText: {
root: ['border border-surface-300 dark:border-surface-600 rounded-lg py-2 px-2 w-full text-xs', { 'pr-8': type === 'color' }] root: ['border border-surface-300 text-zinc-950 dark:text-white dark:border-surface-600 rounded-lg py-2 px-2 w-full text-xs', { 'pr-8': type === 'color' }]
}, },
overlay: 'border border-surface-200 dark:border-surface-700 bg-surface-0 dark:bg-surface-950 shadow-2 rounded-md', overlay: 'border border-surface-200 dark:border-surface-700 bg-surface-0 dark:bg-surface-950 shadow-2 rounded-md',
listContainer: 'max-h-40 overflow-auto', listContainer: 'max-h-40 overflow-auto',