ref: replace browser color picker to svelte-awesome-color-picker

2024-06-10 02:23:13 +09:00
parent 6fea4118d3
commit b53cbba0fa
4 changed files with 66 additions and 17 deletions
--- a/src/lib/UI/GUI/ColorInput.svelte
+++ b/src/lib/UI/GUI/ColorInput.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+    import ColorPicker from 'svelte-awesome-color-picker';
+    export let value = '#000000';
+</script>
+
+<div class="cl rounded-full bg-white">
+    <ColorPicker
+        label="" bind:hex={value} on:input
+    />
+</div>
+
+<style>
+    .cl{
+        --cp-bg-color: var(--risu-theme-bgcolor);
+        --cp-border-color: var(--risu-theme-darkborderc);
+        --cp-text-color: var(--risu-theme-textcolor);
+        --cp-input-color: #555;
+        --cp-button-hover-color: #777;
+    }
+</style>