Just using webcomponent version of iconify.

This commit is contained in:
Bradley Shellnut 2023-01-16 13:52:39 -08:00
parent 141ec7fae6
commit 3c845a7800
6 changed files with 76 additions and 91 deletions

View file

@ -15,7 +15,6 @@
"devDependencies": { "devDependencies": {
"@iconify-icons/line-md": "^1.2.21", "@iconify-icons/line-md": "^1.2.21",
"@iconify-icons/mdi": "^1.2.39", "@iconify-icons/mdi": "^1.2.39",
"@iconify/svelte": "^3.0.1",
"@playwright/test": "^1.29.2", "@playwright/test": "^1.29.2",
"@rgossiaux/svelte-headlessui": "1.0.2", "@rgossiaux/svelte-headlessui": "1.0.2",
"@rgossiaux/svelte-heroicons": "^0.1.2", "@rgossiaux/svelte-heroicons": "^0.1.2",

View file

@ -4,7 +4,6 @@ specifiers:
'@fontsource/fira-mono': ^4.5.10 '@fontsource/fira-mono': ^4.5.10
'@iconify-icons/line-md': ^1.2.21 '@iconify-icons/line-md': ^1.2.21
'@iconify-icons/mdi': ^1.2.39 '@iconify-icons/mdi': ^1.2.39
'@iconify/svelte': ^3.0.1
'@leveluptuts/svelte-side-menu': ^1.0.5 '@leveluptuts/svelte-side-menu': ^1.0.5
'@leveluptuts/svelte-toy': ^2.0.3 '@leveluptuts/svelte-toy': ^2.0.3
'@lukeed/uuid': ^2.0.0 '@lukeed/uuid': ^2.0.0
@ -66,7 +65,6 @@ dependencies:
devDependencies: devDependencies:
'@iconify-icons/line-md': 1.2.21 '@iconify-icons/line-md': 1.2.21
'@iconify-icons/mdi': 1.2.39 '@iconify-icons/mdi': 1.2.39
'@iconify/svelte': 3.0.1_svelte@3.55.1
'@playwright/test': 1.29.2 '@playwright/test': 1.29.2
'@rgossiaux/svelte-headlessui': 1.0.2_svelte@3.55.1 '@rgossiaux/svelte-headlessui': 1.0.2_svelte@3.55.1
'@rgossiaux/svelte-heroicons': 0.1.2_svelte@3.55.1 '@rgossiaux/svelte-heroicons': 0.1.2_svelte@3.55.1
@ -380,15 +378,6 @@ packages:
'@iconify/types': 2.0.0 '@iconify/types': 2.0.0
dev: true dev: true
/@iconify/svelte/3.0.1_svelte@3.55.1:
resolution: {integrity: sha512-onjjl496hTXUBWJxeCxo/c5zmVHS3HnKUQv5Cqf1ZsUbY4d0wVJfSDaV1hw1m6b0BNlJCOmbpc23Q6AOO5qqKg==}
peerDependencies:
svelte: '>=3'
dependencies:
'@iconify/types': 2.0.0
svelte: 3.55.1
dev: true
/@iconify/types/2.0.0: /@iconify/types/2.0.0:
resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==} resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}

View file

@ -2,7 +2,6 @@
import { createEventDispatcher } from 'svelte'; import { createEventDispatcher } from 'svelte';
import { Image } from 'svelte-lazy-loader'; import { Image } from 'svelte-lazy-loader';
import { fade } from 'svelte/transition'; import { fade } from 'svelte/transition';
import Icon from '@iconify/svelte/dist/OfflineIcon.svelte';
import plusCircle from '@iconify-icons/line-md/plus-circle'; import plusCircle from '@iconify-icons/line-md/plus-circle';
import minusCircle from '@iconify-icons/line-md/minus-circle'; import minusCircle from '@iconify-icons/line-md/minus-circle';
import Button from '$lib/components/button/index.svelte'; import Button from '$lib/components/button/index.svelte';
@ -100,17 +99,17 @@
<Button size="md" kind={existsInCollection ? 'danger' : 'primary'} icon on:click={onCollectionClick}> <Button size="md" kind={existsInCollection ? 'danger' : 'primary'} icon on:click={onCollectionClick}>
{collectionText} {collectionText}
{#if existsInCollection} {#if existsInCollection}
<Icon icon={minusCircle} width="24" height="24" /> <iconify-icon icon={minusCircle} width="24" height="24" />
{:else} {:else}
<Icon icon={plusCircle} width="24" height="24" /> <iconify-icon icon={plusCircle} width="24" height="24" />
{/if} {/if}
</Button> </Button>
<Button size="md" kind={existsInWishlist ? 'danger' : 'primary'} icon on:click={onWishlistClick}> <Button size="md" kind={existsInWishlist ? 'danger' : 'primary'} icon on:click={onWishlistClick}>
{wishlistText} {wishlistText}
{#if existsInWishlist} {#if existsInWishlist}
<Icon icon={minusCircle} width="24" height="24" /> <iconify-icon icon={minusCircle} width="24" height="24" />
{:else} {:else}
<Icon icon={plusCircle} width="24" height="24" /> <iconify-icon icon={plusCircle} width="24" height="24" />
{/if} {/if}
</Button> </Button>
</div> </div>

View file

@ -1,7 +1,6 @@
<script lang="ts"> <script lang="ts">
import { fade } from 'svelte/transition'; import { fade } from 'svelte/transition';
import { Popover, PopoverButton, PopoverPanel } from '@rgossiaux/svelte-headlessui'; import { Popover, PopoverButton, PopoverPanel } from '@rgossiaux/svelte-headlessui';
import Icon from '@iconify/svelte/dist/OfflineIcon.svelte';
import cogOutline from '@iconify-icons/mdi/cog-outline'; import cogOutline from '@iconify-icons/mdi/cog-outline';
import Themes from './themes.svelte'; import Themes from './themes.svelte';
import GameCollection from './gameCollection.svelte'; import GameCollection from './gameCollection.svelte';
@ -19,7 +18,7 @@
: 'transform: rotate(0deg); transition: transform 0.5s ease;' : 'transform: rotate(0deg); transition: transform 0.5s ease;'
} }
></iconify-icon> --> ></iconify-icon> -->
<Icon <iconify-icon
icon={cogOutline} icon={cogOutline}
width="24" height="24" width="24" height="24"
style={open ? style={open ?

View file

@ -15,7 +15,7 @@
import { toast } from '$lib/components/toast/toast'; import { toast } from '$lib/components/toast/toast';
import Toast from '$lib/components/toast/Toast.svelte'; import Toast from '$lib/components/toast/Toast.svelte';
import '$root/styles/styles.pcss'; import '$root/styles/styles.pcss';
// import 'iconify-icon'; import 'iconify-icon';
import type { SavedGameType } from '$root/lib/types'; import type { SavedGameType } from '$root/lib/types';

View file

@ -1,7 +1,6 @@
<script lang="ts"> <script lang="ts">
import { fade, fly } from 'svelte/transition'; import { fade, fly } from 'svelte/transition';
import { Image } from 'svelte-lazy-loader'; import { Image } from 'svelte-lazy-loader';
import Icon from '@iconify/svelte/dist/OfflineIcon.svelte';
import minusCircle from '@iconify-icons/line-md/minus-circle'; import minusCircle from '@iconify-icons/line-md/minus-circle';
import plusCircle from '@iconify-icons/line-md/plus-circle'; import plusCircle from '@iconify-icons/line-md/plus-circle';
import { import {
@ -117,17 +116,17 @@
<Button size="md" kind={existsInCollection ? 'danger' : 'primary'} icon on:click={onCollectionClick}> <Button size="md" kind={existsInCollection ? 'danger' : 'primary'} icon on:click={onCollectionClick}>
{collectionText} {collectionText}
{#if existsInCollection} {#if existsInCollection}
<Icon icon={minusCircle} width="24" height="24" /> <iconify-icon icon={minusCircle} width="24" height="24" />
{:else} {:else}
<Icon icon={plusCircle} width="24" height="24" /> <iconify-icon icon={plusCircle} width="24" height="24" />
{/if} {/if}
</Button> </Button>
<Button size="md" kind={existsInWishlist ? 'danger' : 'primary'} icon on:click={onWishlistClick}> <Button size="md" kind={existsInWishlist ? 'danger' : 'primary'} icon on:click={onWishlistClick}>
{wishlistText} {wishlistText}
{#if existsInWishlist} {#if existsInWishlist}
<Icon icon={minusCircle} width="24" height="24" /> <iconify-icon icon={minusCircle} width="24" height="24" />
{:else} {:else}
<Icon icon={plusCircle} width="24" height="24" /> <iconify-icon icon={plusCircle} width="24" height="24" />
{/if} {/if}
</Button> </Button>
</div> </div>