style: fix formatting via prettier

This commit is contained in:
2026-08-28 14:29:54 +05:00
parent 10278981ba
commit ada96b3534
124 changed files with 8211 additions and 5662 deletions
+8 -8
View File
@@ -1,9 +1,9 @@
<script lang="ts">
import type { Snippet } from 'svelte';
import type { Snippet } from "svelte";
interface Props {
variant?: 'primary' | 'secondary';
type?: 'button' | 'submit';
variant?: "primary" | "secondary";
type?: "button" | "submit";
disabled?: boolean;
busy?: boolean;
busyText?: string;
@@ -13,14 +13,14 @@
}
let {
variant = 'primary',
type = 'button',
variant = "primary",
type = "button",
disabled = false,
busy = false,
busyText = '',
busyText = "",
fullWidth = false,
onclick,
children
children,
}: Props = $props();
</script>
@@ -29,7 +29,7 @@
class={fullWidth ? `${variant} fullwidth` : variant}
aria-busy={busy}
disabled={disabled || busy}
onclick={onclick}
{onclick}
>
{#if busy && busyText}
{busyText}
@@ -11,7 +11,7 @@
<div class="checkbox-row">
<label class="checkbox" for={id}>
<input id={id} type="checkbox" bind:checked />
<input {id} type="checkbox" bind:checked />
{label}
</label>
{#if hint}
@@ -38,7 +38,7 @@
color: var(--text-muted);
}
input[type='checkbox'] {
input[type="checkbox"] {
width: 1rem;
height: 1rem;
cursor: pointer;
+14 -8
View File
@@ -1,6 +1,6 @@
<script lang="ts">
import Field from './Field.svelte';
import { t } from '$lib/i18n/t';
import Field from "./Field.svelte";
import { t } from "$lib/i18n/t";
interface Props {
id: string;
@@ -11,20 +11,26 @@
onPipetteToggle?: () => void;
}
let { id, label, value = $bindable('#000000'), hint, pipetteActive = false, onPipetteToggle }:
Props = $props();
let {
id,
label,
value = $bindable("#000000"),
hint,
pipetteActive = false,
onPipetteToggle,
}: Props = $props();
</script>
<Field {id} {label} {hint}>
<div class="row">
<input id={id} class="control swatch" type="color" bind:value />
<input {id} class="control swatch" type="color" bind:value />
{#if onPipetteToggle}
<button
type="button"
class="pipette"
aria-label={t('ui.pipette')}
aria-label={t("ui.pipette")}
aria-pressed={pipetteActive}
title={t('ui.pipette')}
title={t("ui.pipette")}
onclick={onPipetteToggle}
>
◎
@@ -73,7 +79,7 @@
color: var(--link);
}
.pipette[aria-pressed='true'] {
.pipette[aria-pressed="true"] {
border-color: var(--link);
color: var(--link);
background: color-mix(in srgb, var(--accent) 10%, var(--surface));
+1 -1
View File
@@ -1,5 +1,5 @@
<script lang="ts">
import type { Snippet } from 'svelte';
import type { Snippet } from "svelte";
interface Props {
title: string;
+1 -1
View File
@@ -1,5 +1,5 @@
<script lang="ts">
import type { Snippet } from 'svelte';
import type { Snippet } from "svelte";
interface Props {
id: string;
+3 -3
View File
@@ -1,5 +1,5 @@
<script lang="ts">
import Field from './Field.svelte';
import Field from "./Field.svelte";
interface Props {
id: string;
@@ -9,11 +9,11 @@
hint?: string;
}
let { id, label, value = $bindable(''), options, hint }: Props = $props();
let { id, label, value = $bindable(""), options, hint }: Props = $props();
</script>
<Field {id} {label} {hint}>
<select id={id} class="control" bind:value>
<select {id} class="control" bind:value>
{#each options as option (option.value)}
<option value={option.value}>{option.label}</option>
{/each}
+21 -9
View File
@@ -1,6 +1,6 @@
<script lang="ts">
import Field from './Field.svelte';
import { t } from '$lib/i18n/t';
import Field from "./Field.svelte";
import { t } from "$lib/i18n/t";
interface Props {
id: string;
@@ -21,7 +21,7 @@
max,
step,
default: defaultValue,
hint
hint,
}: Props = $props();
function decrement() {
@@ -38,18 +38,30 @@
if (defaultValue !== undefined) value = defaultValue;
}
const resetDisabled = $derived(defaultValue === undefined || value === defaultValue);
const resetDisabled = $derived(
defaultValue === undefined || value === defaultValue,
);
</script>
<Field {id} {label} {hint}>
<div class="row">
<button type="button" class="step" aria-label={t('ui.decrease')} onclick={decrement}>−</button>
<input id={id} type="range" min={min} max={max} step={step} bind:value />
<button type="button" class="step" aria-label={t('ui.increase')} onclick={increment}>+</button>
<button
type="button"
class="step"
aria-label={t('ui.reset')}
aria-label={t("ui.decrease")}
onclick={decrement}>−</button
>
<input {id} type="range" {min} {max} {step} bind:value />
<button
type="button"
class="step"
aria-label={t("ui.increase")}
onclick={increment}>+</button
>
<button
type="button"
class="step"
aria-label={t("ui.reset")}
disabled={resetDisabled}
onclick={reset}
>
@@ -68,7 +80,7 @@
max-width: 22rem;
}
input[type='range'] {
input[type="range"] {
flex: 1;
min-width: 3rem;
accent-color: var(--link);
+23 -5
View File
@@ -1,11 +1,11 @@
<script lang="ts">
import Field from './Field.svelte';
import Field from "./Field.svelte";
interface Props {
id: string;
label: string;
value?: string | number;
type?: 'number' | 'text';
type?: "number" | "text";
min?: number;
max?: number;
step?: number;
@@ -13,12 +13,30 @@
placeholder?: string;
}
let { id, label, value = $bindable(''), type = 'text', min, max, step, hint, placeholder }: Props =
$props();
let {
id,
label,
value = $bindable(""),
type = "text",
min,
max,
step,
hint,
placeholder,
}: Props = $props();
</script>
<Field {id} {label} {hint}>
<input class="control" {id} {type} min={min} max={max} step={step} {placeholder} bind:value />
<input
class="control"
{id}
{type}
{min}
{max}
{step}
{placeholder}
bind:value
/>
</Field>
<style>