src/features/app/components/Modal/Modal.scss

   1 .main {
   2   position: fixed;
   3   top: 0;
   4   right: 0;
   5   left: 0;
   6   bottom: 0;
   7   z-index: 100;
   8 }
   9 .backdrop {
  10   background: transparentize(black, 0.2);
  11   width: 100%;
  12   height: 100%;
  13 }
  14
  15 .content {
  16   background: $background-color;
  17   padding: 30px;
  18   position: absolute;
  19   top: 10%;
  20   left: calc(50% - 250px);
  21   width: 500px;
  22   max-height: 80%;
  23   overflow: scroll;
  24
  25   pre {
  26     white-space: pre-wrap;
  27     background: $background-content-color;
  28     padding: 8px 12px;
  29     color: $text-color;
  30     line-height: 1.4;
  31   }
  32 }
  33
  34 .wide {
  35   left: calc(50% - 425px);
  36   width: 850px;
  37 }
  38
  39 .cancel {
  40   color: $text-color;
  41 }
  42
  43 .box {
  44   background: $background-color;
  45   position: absolute;
  46   top: 10%;
  47   height: 80%;
  48 }
  49
  50 .title {
  51   height: 55px;
  52   padding: $gutter-size/2 $gutter-size;
  53   border-bottom: 1px solid $border-color;
  54   font-size: $font-size-section-title;
  55   color: $text-strong-color;
  56 }
  57
  58 .close {
  59   position: absolute;
  60   right: 10px;
  61   top: 10px;
  62 }