Creepso/miru
1
0
Fork 0
mirror of https://github.com/ThaUnknown/miru.git synced 2026-04-19 11:22:04 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: make settings handle better on small phone displays
Some checks are pending
Check / check (push) Waiting to run
Details

Browse source
This commit is contained in:
ThaUnknown 2025-07-19 01:13:42 +02:00
parent 4d67618390
commit 0fb10cce85
No known key found for this signature in database
4 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -1,6 +1,6 @@
{
"name": "ui",
"version": "6.4.59",
"version": "6.4.60",
"license": "BUSL-1.1",
"private": true,
"packageManager": "pnpm@9.15.5",

4
src/lib/components/SettingsNav.svelte
View file

@ -19,10 +19,10 @@
const key = 'active-settings-tab'
</script>
<nav class={cn('flex flex-col md:flex-row lg:flex-col gap-y-1 gap-x-2', className)}>
<nav class={cn('md:flex grid grid-cols-2 md:flex-row lg:flex-col gap-y-1 gap-x-2', className)}>
{#each items as { href, title }, i (i)}
{@const isActive = $page.url.pathname === href}
<Button {href} variant='ghost' data-sveltekit-noscroll class='relative font-semibold justify-start'>
<Button {href} variant='ghost' data-sveltekit-noscroll class='relative font-semibold justify-start last:odd:col-span-2'>
{#if isActive}
<div class='bg-white absolute inset-0 rounded-md' in:send={{ key }} out:receive={{ key }} />
{/if}

6
src/routes/app/client/+layout.svelte
View file

@ -47,18 +47,18 @@
}
</script>
<div class='space-y-6 p-3 md:p-10 md:pb-0 pb-0 w-full h-full flex flex-col min-w-0'>
<div class='p-3 md:p-10 md:pb-0 pb-0 w-full h-full flex flex-col min-w-0'>
<div class='space-y-0.5'>
<h2 class='text-2xl font-bold'>{overview.title}</h2>
<p class='text-muted-foreground'>
{overview.desc}
</p>
</div>
<Separator class='my-6' />
<Separator class='my-3 md:my-6' />
<div class='flex flex-col lg:flex-row gap-x-12 grow min-h-0'>
<aside class='lg:grow lg:max-w-60 flex flex-col'>
<SettingsNav {items} />
<div class='mt-auto text-xs text-muted-foreground px-4 sm:px-2 py-5 flex flex-row lg:flex-col font-light gap-0.5 gap-x-4 flex-wrap'>
<div class='mt-auto text-xs text-muted-foreground px-4 sm:px-2 py-3 md:py-5 flex-row lg:flex-col font-light gap-0.5 gap-x-4 flex-wrap hidden sm:flex'>
<div>WebTorrent v2.6.8</div>
</div>
</aside>

6
src/routes/app/settings/+layout.svelte
View file

@ -38,18 +38,18 @@
]
</script>
<div class='space-y-6 p-3 md:p-10 md:pb-0 pb-0 w-full h-full flex flex-col'>
<div class='p-3 md:p-10 md:pb-0 pb-0 w-full h-full flex flex-col'>
<div class='space-y-0.5'>
<h2 class='text-2xl font-bold'>Settings</h2>
<p class='text-muted-foreground'>
Manage your app settings, preferences and accounts.
</p>
</div>
<Separator class='my-6' />
<Separator class='my-3 md:my-6' />
<div class='flex flex-col lg:flex-row gap-x-12 grow min-h-0'>
<aside class='lg:grow lg:max-w-60 flex flex-col'>
<SettingsNav {items} />
<div class='mt-auto text-xs text-muted-foreground px-4 sm:px-2 py-5 flex flex-row lg:flex-col font-light gap-0.5 gap-x-4 flex-wrap'>
<div class='mt-auto text-xs text-muted-foreground px-4 sm:px-2 py-3 md:py-5 flex flex-row lg:flex-col font-light gap-0.5 gap-x-4 flex-wrap'>
<div>Interface v{version}</div>
<div>Native {#await native.version() then version}{version}{/await}</div>
{#if highEntropyValues}