till/managarten
1
0
Fork 0
mirror of https://github.com/Memo-2023/mana-monorepo.git synced 2026-05-14 21:01:08 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

fix(mukke): position MiniPlayer above PillNav to prevent overlap

Browse source 
MiniPlayer was fixed at bottom-0 behind PillNav (z-1000). Now offset
by 80px + safe-area so it sits directly above the navigation bar.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-03-23 08:59:12 +01:00
parent abc7f95601
commit 20b36697d4
2 changed files with 11 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

10
apps/mukke/apps/web/src/lib/components/MiniPlayer.svelte
View file

@ -13,7 +13,9 @@
</script>
{#if playerStore.currentSong}
<div class="fixed bottom-0 left-0 right-0 z-30 bg-surface border-t border-border">
<div
class="mini-player fixed left-0 right-0 z-30 bg-surface border-t border-border rounded-t-xl shadow-lg"
>
<!-- Error toast -->
{#if playerStore.error}
<div
@ -113,3 +115,9 @@
</div>
</div>
{/if}
<style>
.mini-player {
bottom: calc(80px + env(safe-area-inset-bottom, 0px));
}
</style>

4
apps/mukke/apps/web/src/routes/(app)/+layout.svelte
View file

@ -181,12 +181,12 @@
.main-content {
flex: 1;
transition: all 300ms ease;
padding-bottom: calc(130px + env(safe-area-inset-bottom));
padding-bottom: calc(180px + env(safe-area-inset-bottom));
}
@media (max-width: 768px) {
.main-content {
padding-bottom: calc(140px + env(safe-area-inset-bottom));
padding-bottom: calc(190px + env(safe-area-inset-bottom));
}
}