diff --git a/ToDo.md b/ToDo.md new file mode 100644 index 0000000..34d8b6f --- /dev/null +++ b/ToDo.md @@ -0,0 +1,2 @@ +- png/jpg genareto can generate image all colors +- for color palette add support combination diff --git a/src/App.svelte b/src/App.svelte index 2251418..e5502ca 100644 --- a/src/App.svelte +++ b/src/App.svelte @@ -141,6 +141,7 @@ effectiveTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'; } document.documentElement.setAttribute('data-theme', effectiveTheme); + console.log('[theme] Applied theme:', effectiveTheme, '(from', theme, ')'); } function setTheme(newTheme) { @@ -179,10 +180,6 @@ } } - function getTagObj(text) { - return allTags.find(t => t.text === text); - } - // Listen for outside click to close dropdown $: if (tagDropdownOpen) { window.addEventListener('click', closeDropdown); @@ -207,7 +204,6 @@ {addTag} {removeTag} {toggleTag} - {getTagObj} {closeDropdown} {filteredLogos} /> diff --git a/src/components/Header.svelte b/src/components/Header.svelte index e2a5f51..b9bbb7f 100644 --- a/src/components/Header.svelte +++ b/src/components/Header.svelte @@ -12,7 +12,6 @@ export let toggleDropdown; export let addTag; export let removeTag; - export let getTagObj;
@@ -39,17 +38,14 @@
{#each selectedTags as tagText} - {#if getTagObj(tagText)} - {/if} {/each}
-
+
+
-
(e.key === 'Enter' || e.key === ' ') && close()} - style="cursor:pointer;" - > +
{#if isSvgLogo(logo)} getDefaultLogoColor(logo.colors, theme); {/if}
+

{logo.name}

{#if isSvgLogo(logo) && logo.colors}
getDefaultLogoColor(logo.colors, theme); on:click|stopPropagation={() => logo._activeColor = undefined} on:keydown|stopPropagation={(e) => (e.key === 'Enter' || e.key === ' ') && (logo._activeColor = undefined)} > - + @@ -130,9 +96,9 @@ $: getLogoThemeColor = logo => getDefaultLogoColor(logo.colors, theme);
{#each logo.tags as tag} {#if getTagObj(tag).color} - {getTagObj(tag).text} + {tag} {:else} - {getTagObj(tag).text} + {tag} {/if} {/each}
@@ -144,118 +110,91 @@ $: getLogoThemeColor = logo => getDefaultLogoColor(logo.colors, theme);
diff --git a/src/components/Row.svelte b/src/components/Row.svelte index 3459872..218d385 100644 --- a/src/components/Row.svelte +++ b/src/components/Row.svelte @@ -1,21 +1,23 @@
(e.key === 'Enter' || e.key === ' ') && onPreview && onPreview(e)} + on:keydown={(e) => (e.key === 'Enter' || e.key === ' ') && onPreview && onPreview()} tabindex="0" role="button" aria-label="Preview logo" @@ -52,9 +54,9 @@
{#each logo.tags as tag} {#if getTagObj(tag).color} - {getTagObj(tag).text} + {tag} {:else} - {getTagObj(tag).text} + {tag} {/if} {/each}
diff --git a/src/utils/tagUtils.js b/src/utils/tagUtils.js new file mode 100644 index 0000000..044e54d --- /dev/null +++ b/src/utils/tagUtils.js @@ -0,0 +1,27 @@ +// Shared tag data loading and utilities +let tagsDataPromise = null; +let tagsData = null; + +// Load tags data once and cache it +export function loadTagsData() { + if (!tagsDataPromise) { + tagsDataPromise = fetch('/data/tags.json') + .then(res => res.json()) + .then(data => { + console.log('Tags data loaded successfully:', data); + tagsData = data; + return data; + }) + .catch(err => { + console.error('Failed to load tags data:', err); + return {}; + }); + } + return tagsDataPromise; +} + +// Get tag object (with color) from tag text +export function getTagObj(text) { + if (!tagsData) return { text }; + return tagsData[text] ? { text, ...tagsData[text] } : { text }; +}