fix: episode list widths

fix: macOS menubar
This commit is contained in:
ThaUnknown 2025-06-14 21:23:55 +02:00
parent 5330207f12
commit c78b18c5e8
No known key found for this signature in database
6 changed files with 41 additions and 17 deletions

View file

@ -1,6 +1,6 @@
{
"name": "ui",
"version": "6.3.53",
"version": "6.3.54",
"license": "BUSL-1.1",
"private": true,
"packageManager": "pnpm@9.14.4",

View file

@ -82,7 +82,7 @@
{#each getPage(currentPage, episodeList) as { episode, image, title, summary, airingAt, airdate, filler, length } (episode)}
{@const watched = _progress >= episode}
{@const target = _progress + 1 === episode}
<div class={!target ? 'px-3' : 'contents'}>
<div class={!target ? 'px-3 w-full' : 'contents'}>
<div use:click={() => play(episode)}
class={cn(
'select:scale-[1.05] select:shadow-lg scale-100 transition-[transform,box-shadow] duration-200 shrink-0 ease-out focus-visible:ring-ring focus-visible:ring-1 rounded-md bg-neutral-950 text-secondary-foreground select:bg-neutral-900 flex w-full max-h-28 cursor-pointer relative overflow-hidden group',

View file

@ -1,6 +1,8 @@
<script lang='ts'>
import { persisted } from 'svelte-persisted-store'
import Wrapper from './wrapper.svelte'
import native from '$lib/modules/native'
import { click } from '$lib/modules/navigate'
@ -10,20 +12,24 @@
}
</script>
<div class='w-[calc(100%-3.5rem)] left-[3.5rem] top-0 z-[2000] flex navbar absolute h-8'>
<div class='draggable w-full' />
<div class='window-controls flex text-white backdrop-blur'>
<button class='max-button flex items-center justify-center h-8 w-[46px]' use:click={native.minimise} use:tabindex>
<svg class='svg-controls w-3 h-3' role='img' viewBox='0 0 12 12'><rect fill='currentColor' height='1' width='10' x='1' y='6' />
</button>
<button class='restore-button flex items-center justify-center h-8 w-[46px]' use:click={native.maximise} use:tabindex>
<svg class='svg-controls w-3 h-3' role='img' viewBox='0 0 12 12'><rect fill='none' height='9' stroke='currentColor' width='9' x='1.5' y='1.5' />
</button>
<button class='close-button flex items-center justify-center h-8 w-[46px]' use:click={native.close} use:tabindex>
<svg class='svg-controls w-3 h-3' role='img' viewBox='0 0 12 12'><polygon fill='currentColor' fill-rule='evenodd' points='11 1.576 6.583 6 11 10.424 10.424 11 6 6.583 1.576 11 1 10.424 5.417 6 1 1.576 1.576 1 6 5.417 10.424 1' />
</button>
<Wrapper let:platform>
<div class='w-[calc(100%-3.5rem)] left-[3.5rem] top-0 z-[2000] flex navbar absolute h-8'>
<div class='draggable w-full' />
{#if platform !== 'macOS'}
<div class='window-controls flex text-white backdrop-blur'>
<button class='max-button flex items-center justify-center h-8 w-[46px]' use:click={native.minimise} use:tabindex>
<svg class='svg-controls w-3 h-3' role='img' viewBox='0 0 12 12'><rect fill='currentColor' height='1' width='10' x='1' y='6' />
</button>
<button class='restore-button flex items-center justify-center h-8 w-[46px]' use:click={native.maximise} use:tabindex>
<svg class='svg-controls w-3 h-3' role='img' viewBox='0 0 12 12'><rect fill='none' height='9' stroke='currentColor' width='9' x='1.5' y='1.5' />
</button>
<button class='close-button flex items-center justify-center h-8 w-[46px]' use:click={native.close} use:tabindex>
<svg class='svg-controls w-3 h-3' role='img' viewBox='0 0 12 12'><polygon fill='currentColor' fill-rule='evenodd' points='11 1.576 6.583 6 11 10.424 10.424 11 6 6.583 1.576 11 1 10.424 5.417 6 1 1.576 1.576 1 6 5.417 10.424 1' />
</button>
</div>
{/if}
</div>
</div>
</Wrapper>
{#if $debug}
<div class='ribbon z-[1000] text-center fixed font-bold pointer-events-none'>Debug Mode!</div>
{/if}

View file

@ -0,0 +1,15 @@
<script lang='ts'>
import { highEntropyValues } from '$lib/utils'
</script>
{#if highEntropyValues}
{#await highEntropyValues then { platform }}
<slot {platform} />
{:catch e}
<slot platform='' />
{/await}
{:else}
<slot platform='' />
{/if}

View file

@ -65,6 +65,8 @@ export const flyAndScale = (
export const sleep = (t: number) => new Promise<void>(resolve => setTimeout(resolve, t))
export const highEntropyValues = 'userAgentData' in navigator && navigator.userAgentData.getHighEntropyValues(['architecture', 'platform', 'platformVersion'])
export function safeLocalStorage<T> (key: string): T | undefined {
try {
const value = localStorage.getItem(key)

View file

@ -4,6 +4,7 @@
import { Separator } from '$lib/components/ui/separator'
import native from '$lib/modules/native'
import { dragScroll } from '$lib/modules/navigate'
import { highEntropyValues } from '$lib/utils'
const items = [
{
@ -51,8 +52,8 @@
<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>Interface v{version}</div>
<div>Native {#await native.version() then version}{version}{/await}</div>
{#if 'userAgentData' in navigator}
{#await navigator.userAgentData.getHighEntropyValues(['architecture', 'platform', 'platformVersion']) then { architecture, platform, platformVersion }}
{#if highEntropyValues}
{#await highEntropyValues then { architecture, platform, platformVersion }}
<div>{platform} {platformVersion} {architecture}</div>
{:catch e}
<div>Could not obtain device version</div>