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

…re/5548-make-loan-list-look-like-figma 5548: fix margin, padding and fontsizes
itk-dev · Dec 20, 2022 · 13dfac0 · 13dfac0
2 parents b7f5caa + 2407254
commit 13dfac0
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/src/stories/Library/Lists/list-reservation/list-reservation.scss b/src/stories/Library/Lists/list-reservation/list-reservation.scss
@@ -26,12 +26,6 @@ $list-reservation-space-desktop: 24px;
   height: 100%;
   display: flex;
   align-items: center;
-
-  @include breakpoint-s {
-    div:first-of-type {
-      margin-bottom: 8px;
-    }
-  }
 }
 
 .list-reservation__hidden-explanation {
@@ -57,6 +51,7 @@ $list-reservation-space-desktop: 24px;
   margin-top: 4px;
   white-space: break-spaces;
   text-decoration: underline;
+  padding-left: 0;
   @extend %text-small-caption;
   @extend %color-secondary-gray;
 }
@@ -82,6 +77,7 @@ $list-reservation-space-desktop: 24px;
   height: 100%;
   margin-left: $list-reservation-space-mobile;
   align-items: baseline;
+  justify-content: space-between;
 
   @include breakpoint-s {
     margin-left: $list-reservation-space-desktop;
@@ -93,10 +89,15 @@ $list-reservation-space-desktop: 24px;
 
   p {
     margin-top: 2px;
+    font-size: 14px;
+    margin-bottom: $s-md;
   }
 
   @include breakpoint-s {
     margin-top: 0;
+    p {
+      font-size: 12px;
+    }
   }
 }
 

diff --git a/src/stories/Library/loan-list-page/loan-list-page.scss b/src/stories/Library/loan-list-page/loan-list-page.scss
@@ -1,6 +1,7 @@
 .loan-list-page {
   background: $c-global-primary;
   padding: $s-md;
+  position: sticky;
 
   @include breakpoint-m {
     padding: $s-6xl;