Cossale/kepler-chat
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

betterb titles

Browse source
This commit is contained in:
Thomas G. Lopes 2025-06-17 01:01:32 +01:00
parent 872b4b3cba
commit 7535e54477
2 changed files with 51 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/app.css
View file

@ -32,13 +32,16 @@
--chart-3: oklch(0.379 0.0438 226.1538); --chart-3: oklch(0.379 0.0438 226.1538);
--chart-4: oklch(0.833 0.1185 88.3461); --chart-4: oklch(0.833 0.1185 88.3461);
--chart-5: oklch(0.7843 0.1256 58.9964); --chart-5: oklch(0.7843 0.1256 58.9964);
--sidebar: oklch(0.936 0.0288 320.5788); /* Subtle blue shift for sidebar colors in light mode */
--sidebar-foreground: oklch(0.4948 0.1909 354.5435); --sidebar: oklch(0.936 0.0288 280); /* Original hue 320.5788 -> 280 (more blue) */
--sidebar-primary: oklch(0.3963 0.0251 285.1962); --sidebar-foreground: oklch(0.4948 0.1909 285); /* Original hue 354.5435 -> 285 */
--sidebar-primary-foreground: oklch(0.9668 0.0124 337.5228); --sidebar-primary: oklch(0.3963 0.0251 270); /* Original hue 285.1962 -> 270 */
--sidebar-accent: oklch(0.9789 0.0013 106.4235); --sidebar-primary-foreground: oklch(
--sidebar-accent-foreground: oklch(0.3963 0.0251 285.1962); 0.9668 0.0124 337.5228
--sidebar-border: oklch(0.9383 0.0026 48.7178); ); /* No change, keep white/near white */
--sidebar-accent: oklch(0.9789 0.0013 280); /* Original hue 106.4235 -> 280 */
--sidebar-accent-foreground: oklch(0.3963 0.0251 270); /* Original hue 285.1962 -> 270 */
--sidebar-border: oklch(0.9383 0.0026 280); /* Original hue 48.7178 -> 280 */
--sidebar-ring: oklch(0.5916 0.218 0.5844); --sidebar-ring: oklch(0.5916 0.218 0.5844);
--radius: 0.5rem; --radius: 0.5rem;
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05); --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
@ -76,13 +79,14 @@
--chart-3: oklch(0.7227 0.1502 60.5799); --chart-3: oklch(0.7227 0.1502 60.5799);
--chart-4: oklch(0.6193 0.2029 312.7422); --chart-4: oklch(0.6193 0.2029 312.7422);
--chart-5: oklch(0.6118 0.2093 6.1387); --chart-5: oklch(0.6118 0.2093 6.1387);
--sidebar: oklch(0.1893 0.0163 331.0475); /* Subtle blue shift for sidebar colors in dark mode */
--sidebar-foreground: oklch(0.8607 0.0293 343.6612); --sidebar: oklch(0.1693 0.0143 280); /* Original hue 331.0475 -> 260 */
--sidebar-primary: oklch(0.4882 0.2172 264.3763); --sidebar-foreground: oklch(0.8607 0.0293 265); /* Original hue 343.6612 -> 265 */
--sidebar-primary-foreground: oklch(1 0 0); --sidebar-primary: oklch(0.4882 0.2172 250); /* Original hue 264.3763 -> 250 */
--sidebar-accent: oklch(0.2337 0.0261 338.1961); --sidebar-primary-foreground: oklch(1 0 0); /* No change, keep white */
--sidebar-accent-foreground: oklch(0.9674 0.0013 286.3752); --sidebar-accent: oklch(0.2337 0.0261 260); /* Original hue 338.1961 -> 260 */
--sidebar-border: oklch(0 0 0); --sidebar-accent-foreground: oklch(0.9674 0.0013 250); /* Original hue 286.3752 -> 250 */
--sidebar-border: oklch(0 0 0); /* No change, keep black */
--sidebar-ring: oklch(0.5797 0.1194 237.7893); --sidebar-ring: oklch(0.5797 0.1194 237.7893);
--radius: 0.5rem; --radius: 0.5rem;
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05); --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
@ -449,3 +453,8 @@
opacity: var(--opacity, 1); opacity: var(--opacity, 1);
} }
} }
@utility abs-y-center {
top: 50%;
transform: translateY(-50%);
}

30
src/routes/chat/+layout.svelte
View file

@ -7,6 +7,8 @@
import { isString } from '$lib/utils/is.js'; import { isString } from '$lib/utils/is.js';
import { Avatar } from 'melt/components'; import { Avatar } from 'melt/components';
import PanelLeftIcon from '~icons/lucide/panel-left'; import PanelLeftIcon from '~icons/lucide/panel-left';
import PinIcon from '~icons/lucide/pin';
import XIcon from '~icons/lucide/x';
import SendIcon from '~icons/lucide/send'; import SendIcon from '~icons/lucide/send';
import { callGenerateMessage } from '../api/generate-message/call.js'; import { callGenerateMessage } from '../api/generate-message/call.js';
import ModelPicker from './model-picker.svelte'; import ModelPicker from './model-picker.svelte';
@ -15,6 +17,7 @@
import { useCachedQuery } from '$lib/cache/cached-query.svelte.js'; import { useCachedQuery } from '$lib/cache/cached-query.svelte.js';
import { api } from '$lib/backend/convex/_generated/api.js'; import { api } from '$lib/backend/convex/_generated/api.js';
import { TextareaAutosize } from '$lib/spells/textarea-autosize.svelte.js'; import { TextareaAutosize } from '$lib/spells/textarea-autosize.svelte.js';
import Tooltip from '$lib/components/ui/tooltip.svelte';
let { data, children } = $props(); let { data, children } = $props();
@ -70,10 +73,33 @@
</div> </div>
<div class="flex flex-1 flex-col overflow-y-auto py-2"> <div class="flex flex-1 flex-col overflow-y-auto py-2">
{#each conversationsQuery.data ?? [] as conversation (conversation._id)} {#each conversationsQuery.data ?? [] as conversation (conversation._id)}
<a href={`/chat/${conversation._id}`} class="group py-0.5 pr-2.5 text-left text-sm"> <a
<p class="group-hover:bg-muted rounded-md py-1.5 pl-3"> href={`/chat/${conversation._id}`}
class="group relative overflow-clip py-0.5 pr-2.5 text-left text-sm"
>
<p class="group-hover:bg-sidebar-accent rounded-md py-1.5 pl-3">
{conversation.title} {conversation.title}
</p> </p>
<div
class=" to-sidebar-accent pointer-events-none absolute inset-y-0 right-0 flex translate-x-full items-center gap-2 rounded-r-lg bg-gradient-to-r from-transparent pr-2 transition group-hover:pointer-events-auto group-hover:translate-0"
>
<Tooltip>
{#snippet trigger(tooltip)}
<button {...tooltip.trigger} class="hover:bg-muted rounded-md p-1">
<PinIcon class="size-4" />
</button>
{/snippet}
Pin
</Tooltip>
<Tooltip>
{#snippet trigger(tooltip)}
<button {...tooltip.trigger} class="hover:bg-muted rounded-md p-1">
<XIcon class="size-4" />
</button>
{/snippet}
Delete
</Tooltip>
</div>
</a> </a>
{/each} {/each}
</div> </div>