Merge pull request danskernesdigitalebibliotek#240 from itk-dev/featu…

…re/mobile-view-of-group-modal-buttons itkdev: mobile view of group modal buttons
reload · Jun 27, 2023 · 61d4234 · 61d4234
2 parents fa7b440 + c7e4103
commit 61d4234
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/src/stories/Library/Modals/modal-loan/modal-loan.scss b/src/stories/Library/Modals/modal-loan/modal-loan.scss
@@ -44,17 +44,24 @@ $MODAL_LOAN_CONTAINER_WIDTH: 1000px;
 .modal-loan__buttons {
   background-color: $c-global-primary;
   display: flex;
-  grid-gap: 24px;
   justify-content: flex-end;
-  align-items: center;
   margin-top: 40px;
+  flex-direction: column;
+  margin-bottom: 10px;
+
+  @include breakpoint-s {
+    align-items: center;
+    flex-direction: row;
+  }
 }
 
 .modal-loan__buttons--bottom {
   position: fixed;
   right: 0;
   bottom: 0;
+  left: 0;
   padding: $s-md;
+  margin-bottom: 0px;
 
   @include breakpoint-s {
     padding: $s-lg $s-7xl $s-lg 0;

diff --git a/src/stories/Library/card-list-page/result-pager.scss b/src/stories/Library/card-list-page/result-pager.scss
@@ -7,7 +7,7 @@
 }
 
 .result-pager--margin-bottom {
-  margin-bottom: 80px;
+  margin-bottom: 100px;
   margin-top: 0px;
 }
 // Override button css (Center + Width)
@@ -19,3 +19,9 @@
     max-width: 253px;
   }
 }
+
+.result-pager--margin-bottom > .btn-primary {
+  @include breakpoint-s {
+    margin-bottom: 90px;
+  }
+}