Backport pull request #5590 from jellyfin-web/release-10.9.z

Fix positioning of the main animated page elements Original-merge: f7f5ac9 Merged-by: thornbill <thornbill@users.noreply.github.com> Backported-by: Joshua M. Boniface <joshua@boniface.me>
jellyfin · May 25, 2024 · 711f61d · 711f61d
1 parent 5d60602
commit 711f61d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/src/apps/dashboard/AppOverrides.scss b/src/apps/dashboard/AppOverrides.scss
@@ -5,10 +5,14 @@ $mui-bp-md: 900px;
 $mui-bp-lg: 1200px;
 $mui-bp-xl: 1536px;
 
+$drawer-width: 240px;
+
 // Fix dashboard pages layout to work with drawer
 .dashboardDocument {
     .mainAnimatedPage {
-        position: relative;
+        @media all and (min-width: $mui-bp-md) {
+            left: $drawer-width;
+        }
     }
 
     .skinBody {

diff --git a/src/apps/experimental/AppOverrides.scss b/src/apps/experimental/AppOverrides.scss
@@ -5,9 +5,13 @@ $mui-bp-md: 900px;
 $mui-bp-lg: 1200px;
 $mui-bp-xl: 1536px;
 
+$drawer-width: 240px;
+
 // Fix main pages layout to work with drawer
 .mainAnimatedPage {
-    position: relative;
+    @media all and (min-width: $mui-bp-md) {
+        left: $drawer-width;
+    }
 }
 
 // Hide some items from the user "settings" page that are in the drawer