icon picker component
This commit is contained in:
parent
61d674199f
commit
06f5a1af42
11
src/ui/Icon.svelte
Normal file
11
src/ui/Icon.svelte
Normal file
@ -0,0 +1,11 @@
|
||||
<script>
|
||||
const ICONS = import.meta.glob('./icons/*.svelte', {eager: true});
|
||||
|
||||
export let name;
|
||||
let classes = "";
|
||||
export {classes as class};
|
||||
|
||||
let svg = ICONS[`./icons/${name}.svelte`].default;
|
||||
</script>
|
||||
|
||||
<svelte:component this={svg} class={classes} />
|
8
src/ui/icons/check-circle.svelte
Normal file
8
src/ui/icons/check-circle.svelte
Normal file
@ -0,0 +1,8 @@
|
||||
<script>
|
||||
let classes = "";
|
||||
export {classes as class};
|
||||
</script>
|
||||
|
||||
<svg class={classes} fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
8
src/ui/icons/x-circle.svelte
Normal file
8
src/ui/icons/x-circle.svelte
Normal file
@ -0,0 +1,8 @@
|
||||
<script>
|
||||
let classes = "";
|
||||
export {classes as class};
|
||||
</script>
|
||||
|
||||
<svg class={classes} fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
@ -2,6 +2,8 @@
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { invoke } from '@tauri-apps/api/tauri';
|
||||
|
||||
import Icon from '../ui/icon.svelte';
|
||||
|
||||
export let appState;
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
@ -40,20 +42,16 @@
|
||||
<div class="text-center">
|
||||
<ul class="text-gray-200">
|
||||
{#each appState.currentRequest.clients as client}
|
||||
<li>PID: {client.pid}</li>
|
||||
<li>Path: {client.exe}</li>
|
||||
<li>PID: {client ? client.pid : 'Unknown'}</li>
|
||||
<li>Path: {client ? client.exe : 'Unknown'}</li>
|
||||
{/each}
|
||||
</ul>
|
||||
|
||||
<button on:click={approve}>
|
||||
<svg class="w-32 stroke-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
<Icon name="check-circle" class="w-32 stroke-green-500" />
|
||||
</button>
|
||||
|
||||
<button on:click={deny}>
|
||||
<svg class="w-32 stroke-red-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
<Icon name="x-circle" class="w-32 stroke-red-600" />
|
||||
</button>
|
||||
</div>
|
Loading…
x
Reference in New Issue
Block a user