style: Prettier format
This commit is contained in:
parent
81099b7c6a
commit
6602fbdd28
@ -33,7 +33,7 @@
|
||||
bind:value={$form.channelName}
|
||||
aria-invalid={$errors.channelName ? 'true' : undefined}
|
||||
{...$constraints.channelName} />
|
||||
{#if $errors.channelName}<Label for="channelName" class="text-red-500 m-0 p-0">{$errors.channelName}</Label>{/if}
|
||||
{#if $errors.channelName}<Label for="channelName" class="m-0 p-0 text-red-500">{$errors.channelName}</Label>{/if}
|
||||
<Dialog.Footer>
|
||||
<Button type="submit">Create</Button>
|
||||
</Dialog.Footer>
|
||||
|
@ -24,7 +24,7 @@
|
||||
</script>
|
||||
|
||||
<div class="grid min-h-screen w-full md:grid-cols-[220px_1fr] lg:grid-cols-[280px_1fr]">
|
||||
<div class="bg-muted/40 hidden border-r md:block">
|
||||
<div class="hidden border-r bg-muted/40 md:block">
|
||||
<div class="flex h-full max-h-screen flex-col gap-2">
|
||||
<div class="flex h-14 items-center border-b px-4 lg:h-[60px] lg:px-6">
|
||||
<a href="/" class="flex items-center gap-2 font-semibold">
|
||||
@ -45,7 +45,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-2 max-h-screen">
|
||||
<div class="max-h-screen p-2">
|
||||
{@render children()}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -3,9 +3,9 @@
|
||||
const { message, imageSrc, user }: TypeMessage = $props();
|
||||
</script>
|
||||
|
||||
<div class="w-full hover:bg-zinc-200 flex py-2 dark:hover:bg-stone-900">
|
||||
<div class="flex w-full py-2 hover:bg-zinc-200 dark:hover:bg-stone-900">
|
||||
<div class="avatar mx-2 rounded-sm">
|
||||
<div class="w-12 h-12 overflow-hidden rounded-lg border bg-white">
|
||||
<div class="h-12 w-12 overflow-hidden rounded-lg border bg-white">
|
||||
<img src={imageSrc} alt="Profile image for {user}" />
|
||||
</div>
|
||||
</div>
|
||||
|
@ -8,6 +8,6 @@
|
||||
export { className as class };
|
||||
</script>
|
||||
|
||||
<p class={cn('text-muted-foreground text-sm', className)} {...$$restProps}>
|
||||
<p class={cn('text-sm text-muted-foreground', className)} {...$$restProps}>
|
||||
<slot />
|
||||
</p>
|
||||
|
@ -10,7 +10,7 @@
|
||||
|
||||
<!-- svelte-ignore a11y-no-static-element-interactions -->
|
||||
<div
|
||||
class={cn('bg-card text-card-foreground rounded-xl border shadow', className)}
|
||||
class={cn('rounded-xl border bg-card text-card-foreground shadow', className)}
|
||||
{...$$restProps}
|
||||
on:click
|
||||
on:focusin
|
||||
|
@ -20,13 +20,13 @@
|
||||
{transition}
|
||||
{transitionConfig}
|
||||
class={cn(
|
||||
'bg-background fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg sm:rounded-lg md:w-full',
|
||||
'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg sm:rounded-lg md:w-full',
|
||||
className,
|
||||
)}
|
||||
{...$$restProps}>
|
||||
<slot />
|
||||
<DialogPrimitive.Close
|
||||
class="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none">
|
||||
class="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
|
||||
<Cross2 class="h-4 w-4" />
|
||||
<span class="sr-only">Close</span>
|
||||
</DialogPrimitive.Close>
|
||||
|
@ -8,6 +8,6 @@
|
||||
export { className as class };
|
||||
</script>
|
||||
|
||||
<DialogPrimitive.Description class={cn('text-muted-foreground text-sm', className)} {...$$restProps}>
|
||||
<DialogPrimitive.Description class={cn('text-sm text-muted-foreground', className)} {...$$restProps}>
|
||||
<slot />
|
||||
</DialogPrimitive.Description>
|
||||
|
@ -16,5 +16,5 @@
|
||||
<DialogPrimitive.Overlay
|
||||
{transition}
|
||||
{transitionConfig}
|
||||
class={cn('bg-background/80 fixed inset-0 z-50 backdrop-blur-sm ', className)}
|
||||
class={cn('fixed inset-0 z-50 bg-background/80 backdrop-blur-sm ', className)}
|
||||
{...$$restProps} />
|
||||
|
@ -14,7 +14,7 @@
|
||||
<DropdownMenuPrimitive.CheckboxItem
|
||||
bind:checked
|
||||
class={cn(
|
||||
'data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
|
||||
'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50',
|
||||
className,
|
||||
)}
|
||||
{...$$restProps}
|
||||
|
@ -15,7 +15,7 @@
|
||||
{transition}
|
||||
{transitionConfig}
|
||||
{sideOffset}
|
||||
class={cn('bg-popover text-popover-foreground z-50 min-w-[8rem] rounded-md border p-1 shadow-md focus:outline-none', className)}
|
||||
class={cn('z-50 min-w-[8rem] rounded-md border bg-popover p-1 text-popover-foreground shadow-md focus:outline-none', className)}
|
||||
{...$$restProps}
|
||||
on:keydown>
|
||||
<slot />
|
||||
|
@ -14,7 +14,7 @@
|
||||
|
||||
<DropdownMenuPrimitive.Item
|
||||
class={cn(
|
||||
'data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
|
||||
'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50',
|
||||
inset && 'pl-8',
|
||||
className,
|
||||
)}
|
||||
|
@ -13,7 +13,7 @@
|
||||
|
||||
<DropdownMenuPrimitive.RadioItem
|
||||
class={cn(
|
||||
'data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
|
||||
'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50',
|
||||
className,
|
||||
)}
|
||||
{value}
|
||||
|
@ -8,4 +8,4 @@
|
||||
export { className as class };
|
||||
</script>
|
||||
|
||||
<DropdownMenuPrimitive.Separator class={cn('bg-muted -mx-1 my-1 h-px', className)} {...$$restProps} />
|
||||
<DropdownMenuPrimitive.Separator class={cn('-mx-1 my-1 h-px bg-muted', className)} {...$$restProps} />
|
||||
|
@ -16,7 +16,7 @@
|
||||
<DropdownMenuPrimitive.SubContent
|
||||
{transition}
|
||||
{transitionConfig}
|
||||
class={cn('bg-popover text-popover-foreground z-50 min-w-[8rem] rounded-md border p-1 shadow-lg focus:outline-none', className)}
|
||||
class={cn('z-50 min-w-[8rem] rounded-md border bg-popover p-1 text-popover-foreground shadow-lg focus:outline-none', className)}
|
||||
{...$$restProps}
|
||||
on:keydown
|
||||
on:focusout
|
||||
|
@ -15,7 +15,7 @@
|
||||
|
||||
<DropdownMenuPrimitive.SubTrigger
|
||||
class={cn(
|
||||
'data-[highlighted]:bg-accent data-[state=open]:bg-accent data-[highlighted]:text-accent-foreground data-[state=open]:text-accent-foreground flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none',
|
||||
'flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[highlighted]:bg-accent data-[state=open]:bg-accent data-[highlighted]:text-accent-foreground data-[state=open]:text-accent-foreground',
|
||||
inset && 'pl-8',
|
||||
className,
|
||||
)}
|
||||
|
@ -17,7 +17,7 @@
|
||||
|
||||
<input
|
||||
class={cn(
|
||||
'border-input placeholder:text-muted-foreground focus-visible:ring-ring flex h-9 w-full rounded-md border bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50',
|
||||
'flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',
|
||||
className,
|
||||
)}
|
||||
bind:value
|
||||
|
@ -29,7 +29,7 @@
|
||||
{...$$restProps}>
|
||||
<slot />
|
||||
<SheetPrimitive.Close
|
||||
class="ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none">
|
||||
class="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
|
||||
<Cross2 class="h-4 w-4" />
|
||||
<span class="sr-only">Close</span>
|
||||
</SheetPrimitive.Close>
|
||||
|
@ -8,6 +8,6 @@
|
||||
export { className as class };
|
||||
</script>
|
||||
|
||||
<SheetPrimitive.Description class={cn('text-muted-foreground text-sm', className)} {...$$restProps}>
|
||||
<SheetPrimitive.Description class={cn('text-sm text-muted-foreground', className)} {...$$restProps}>
|
||||
<slot />
|
||||
</SheetPrimitive.Description>
|
||||
|
@ -16,5 +16,5 @@
|
||||
<SheetPrimitive.Overlay
|
||||
{transition}
|
||||
{transitionConfig}
|
||||
class={cn('bg-background/80 fixed inset-0 z-50 backdrop-blur-sm', className)}
|
||||
class={cn('fixed inset-0 z-50 bg-background/80 backdrop-blur-sm', className)}
|
||||
{...$$restProps} />
|
||||
|
@ -8,6 +8,6 @@
|
||||
export { className as class };
|
||||
</script>
|
||||
|
||||
<SheetPrimitive.Title class={cn('text-foreground text-lg font-semibold', className)} {...$$restProps}>
|
||||
<SheetPrimitive.Title class={cn('text-lg font-semibold text-foreground', className)} {...$$restProps}>
|
||||
<slot />
|
||||
</SheetPrimitive.Title>
|
||||
|
@ -6,12 +6,12 @@
|
||||
</script>
|
||||
|
||||
<main class="relative size-full">
|
||||
<Card.Root class="md:w-1/4 w-1/2 h-1/2 abs-center flex flex-col">
|
||||
<Card.Root class="abs-center flex h-1/2 w-1/2 flex-col md:w-1/4">
|
||||
<Card.Header class="h-fit">
|
||||
<Card.Title class="text-center">{page.status} - {page.error?.message}</Card.Title>
|
||||
</Card.Header>
|
||||
<Card.Content class="relative grow">
|
||||
<BrokenHeart class="size-1/2 abs-center" />
|
||||
<BrokenHeart class="abs-center size-1/2" />
|
||||
</Card.Content>
|
||||
<Card.Footer class="h-fit">
|
||||
<Button href="/channel/general" variant="secondary" class="mx-auto">Go Home</Button>
|
||||
|
@ -39,13 +39,13 @@
|
||||
<Message imageSrc={message.imageSrc} user={message.user} message={message.message} />
|
||||
{/each}
|
||||
{/snippet}
|
||||
<div class="flex flex-1 flex-col items-center justify-center rounded-lg shadow-sm gap-1 h-full">
|
||||
<div class="flex-grow flex-col-reverse flex flex-auto overflow-y-scroll overflow-x-hidden rounded-lg border w-full">
|
||||
<div class="flex h-full flex-1 flex-col items-center justify-center gap-1 rounded-lg shadow-sm">
|
||||
<div class="flex w-full flex-auto flex-grow flex-col-reverse overflow-x-hidden overflow-y-scroll rounded-lg border">
|
||||
{@render message(socket?.messages!)}
|
||||
{@render message(data.messages)}
|
||||
</div>
|
||||
<form
|
||||
class="flex gap-1 w-full"
|
||||
class="flex w-full gap-1"
|
||||
onsubmit={() => {
|
||||
socket?.sendMessage(user!, msg);
|
||||
msg = '';
|
||||
|
Loading…
Reference in New Issue
Block a user