Fix the page box style on mobile devices

diff --git a/app/static/src/sass/modules/boxes/_page-box.scss b/app/static/src/sass/modules/boxes/_page-box.scss
index fcebba99e84ccfdb73eb6da9412f253f756aef7c..24f76636890d5f6a28806ed1cb7e7dd577dc99a9 100644 (file)
--- a/app/static/src/sass/modules/boxes/_page-box.scss
+++ b/app/static/src/sass/modules/boxes/_page-box.scss
@@ -8,6 +8,11 @@ $module: ".page-box";
 
     @include margin-bottom(1);
 
+    @include mq($until: sm) {
+        height: auto;
+        overflow: hidden;
+    }
+
     &:first-of-type {
 
         @include margin-top(3);
@@ -18,6 +23,15 @@ $module: ".page-box";
 
         @include fluid-aspect(9 4, "img");
 
+        @include mq($until: xs) {
+            @include fluid-aspect(4.5 8, "img");
+            >img {
+                width: 310%;
+                left: -50%;
+                max-width: none;
+            }
+        }
+
         &:after {
             content: '';
             display: block;