fix: update button component styles
This commit is contained in:
@@ -1,11 +1,11 @@
|
||||
<script lang="ts">
|
||||
import { TOOLS } from "$lib/registry";
|
||||
import Panel from "$lib/components/kit/Panel.svelte";
|
||||
import PanelHeading from "$lib/components/kit/PanelHeading.svelte";
|
||||
import SettingsFooter from "$lib/components/kit/SettingsFooter.svelte";
|
||||
import TextField from "$lib/components/kit/TextField.svelte";
|
||||
import ToolCard from "$lib/components/kit/ToolCard.svelte";
|
||||
import Button from "$lib/components/kit/Button.svelte";
|
||||
import Button from "$lib/components/kit/ui/Button.svelte";
|
||||
import { TOOLS } from "$lib/registry";
|
||||
import { Search } from "@lucide/svelte";
|
||||
|
||||
let query = $state("");
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
<script lang="ts">
|
||||
import Button from "$lib/components/kit/Button.svelte";
|
||||
import CheckboxField from "$lib/components/kit/CheckboxField.svelte";
|
||||
import CheckerCanvas from "$lib/components/kit/CheckerCanvas.svelte";
|
||||
import CodeBlock from "$lib/components/kit/CodeBlock.svelte";
|
||||
@@ -23,6 +22,7 @@
|
||||
import Toggle from "$lib/components/kit/Toggle.svelte";
|
||||
import ToolCard from "$lib/components/kit/ToolCard.svelte";
|
||||
import Badge from "$lib/components/kit/ui/Badge.svelte";
|
||||
import Button from "$lib/components/kit/ui/Button.svelte";
|
||||
import { Download, ImageOff, Palette, Plus, Trash2 } from "@lucide/svelte";
|
||||
|
||||
let mode = $state("preview");
|
||||
@@ -63,7 +63,7 @@
|
||||
<div class="stack">
|
||||
<SettingGroup label="variants">
|
||||
<Button onclick={() => {}}>Primary</Button>
|
||||
<Button variant="ghost" onclick={() => {}}>Ghost</Button>
|
||||
<Button variant="outline" onclick={() => {}}>Outline</Button>
|
||||
<Button variant="accent" onclick={() => {}}>Accent</Button>
|
||||
<Button variant="danger" onclick={() => {}}>Danger</Button>
|
||||
</SettingGroup>
|
||||
@@ -133,10 +133,12 @@
|
||||
]}
|
||||
/>
|
||||
<SettingGroup label="tones">
|
||||
<Badge>default</Badge>
|
||||
<Badge tone="accent">accent</Badge>
|
||||
<Badge tone="success">success</Badge>
|
||||
<Badge tone="amber">amber</Badge>
|
||||
<Badge label="default" />
|
||||
<Badge tone="accent" label="accent" />
|
||||
<Badge tone="success" label="success" />
|
||||
<Badge tone="danger" label="default" />
|
||||
<Badge tone="warning" label="warning" />
|
||||
<Badge tone="info" label="info" />
|
||||
</SettingGroup>
|
||||
</div>
|
||||
</Panel>
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
<script lang="ts">
|
||||
import Button from "$lib/components/kit/Button.svelte";
|
||||
import CheckerCanvas from "$lib/components/kit/CheckerCanvas.svelte";
|
||||
import DownloadButton from "$lib/components/kit/DownloadButton.svelte";
|
||||
import Dropzone from "$lib/components/kit/Dropzone.svelte";
|
||||
@@ -10,6 +9,7 @@
|
||||
import PreviewStack from "$lib/components/kit/PreviewStack.svelte";
|
||||
import PreviewTile from "$lib/components/kit/PreviewTile.svelte";
|
||||
import StatusLine from "$lib/components/kit/StatusLine.svelte";
|
||||
import Button from "$lib/components/kit/ui/Button.svelte";
|
||||
import type { PixelImage } from "$lib/core/types";
|
||||
|
||||
interface PreviewItem {
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
<script lang="ts">
|
||||
import Button from "$lib/components/kit/Button.svelte";
|
||||
import EmptyState from "$lib/components/kit/EmptyState.svelte";
|
||||
import Panel from "$lib/components/kit/Panel.svelte";
|
||||
import PanelHeading from "$lib/components/kit/PanelHeading.svelte";
|
||||
@@ -7,6 +6,7 @@
|
||||
import SettingsFooter from "$lib/components/kit/SettingsFooter.svelte";
|
||||
import StepCard from "$lib/components/kit/StepCard.svelte";
|
||||
import Badge from "$lib/components/kit/ui/Badge.svelte";
|
||||
import Button from "$lib/components/kit/ui/Button.svelte";
|
||||
import { getTool } from "$lib/registry";
|
||||
import ParamControl from "./ParamControl.svelte";
|
||||
|
||||
|
||||
Reference in New Issue
Block a user