reposition modal close button

2018-08-13 11:47:04 -04:00
parent 6fa57c310a
commit 990da72583
2 changed files with 25 additions and 10 deletions
--- a/styles/components/_modal.scss
+++ b/styles/components/_modal.scss
@@ -29,6 +29,7 @@
      flex-grow: 1;
      overflow-y: auto;
      max-width: 80rem;
+      position: relative;

      @include media($medium-screen) {
        padding: $gap * 4;
@@ -39,9 +40,24 @@
        @include h3;
      }

-      :first-child {
+      > :first-child {
        margin-top: 0;
      }
+
+      .modal__dismiss {
+        position: absolute;
+        top: 0;
+        right: 0;
+        width: 8rem;
+      }
+    }
+  }
+
+  &.modal--dismissable {
+    .modal__body {
+      > :first-child {
+        margin-right: 8rem;
+      }
    }
  }
 }