diff --git a/js/app.js b/js/app.js index 4ae254d..1cf990e 100644 --- a/js/app.js +++ b/js/app.js @@ -395,7 +395,6 @@ document.addEventListener('DOMContentLoaded', async () => { const lastfmToggleSetting = document.getElementById('lastfm-toggle-setting'); window.loadHomeFeed = loadHomeFeed; - function positionContextMenu(menu, x, y, preferLeft = false) { menu.style.display = 'block'; menu.style.visibility = 'hidden'; diff --git a/styles.css b/styles.css index a90be22..a10eeb7 100644 --- a/styles.css +++ b/styles.css @@ -117,6 +117,8 @@ html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; + height: 100%; + overflow: hidden; } body { @@ -125,6 +127,9 @@ body { font-family: 'Inter', sans-serif; overflow: hidden; transition: background-color 0.3s ease, color 0.3s ease; + height: 100%; + position: fixed; + width: 100%; } img { @@ -142,6 +147,7 @@ a { .app-container { display: grid; height: 100vh; + height: 100dvh; grid-template: "sidebar main" 1fr "player player" auto / 280px 1fr; @@ -1008,7 +1014,7 @@ input:checked + .slider::before { #context-menu, .queue-track-menu { display: none; - position: absolute; + position: fixed; background-color: var(--card); border: 1px solid var(--border); border-radius: var(--radius); @@ -1557,6 +1563,8 @@ input:checked + .slider::before { "header" auto "main" 1fr "player" auto / 1fr; + height: 100vh; + height: 100dvh; } .main-content { @@ -1640,6 +1648,7 @@ input:checked + .slider::before { padding: var(--spacing-md); height: auto; } + .now-playing-bar .track-info { grid-area: track; @@ -1688,7 +1697,7 @@ input:checked + .slider::before { } #download-notifications { - bottom: 160px; + bottom: 10px; right: 10px; left: 10px; max-width: none;