github.com/outbrain/consul@v1.4.5/ui-v2/app/styles/core/layout.scss (about)

     1  @import '../layouts/index';
     2  
     3  // TODO: This shouldn't be done here, decide the best way to do this
     4  // %main-decoration ? %main-skin ? %content-skin ?
     5  // it includes layouts of components, but not layout of itself?
     6  // %main-components? What about %app-content
     7  main,
     8  %modal-window {
     9    @extend %main-content;
    10  }
    11  html.template-with-vertical-menu,
    12  html.template-with-vertical-menu body {
    13    overflow: hidden;
    14  }
    15  #wrapper {
    16    @extend %viewport-container;
    17  }
    18  #wrapper {
    19    @extend %with-sticky-footer;
    20  }
    21  main {
    22    @extend %with-sticky-footer-content;
    23  }
    24  main,
    25  #wrapper > footer {
    26    @extend %content-container;
    27  }
    28  html.template-edit main {
    29    @extend %content-container-restricted;
    30  }
    31  
    32  @media #{$--lt-spacious-page-header} {
    33    html.template-list:not(.template-kv) main {
    34      margin-top: 10px;
    35    }
    36  }
    37  @media #{$--lt-spacious-page-header} {
    38    .actions button.copy-btn {
    39      margin-top: -56px;
    40      padding: 0;
    41    }
    42  }
    43  /* TODO: keep margin below forms, move elsewhere */
    44  %main-content form,
    45  %main-content form + div .with-confirmation {
    46    margin-bottom: 2em;
    47  }
    48  @media #{$--lt-wide-form} {
    49    main form [type='reset'] {
    50      float: right;
    51      margin-right: 0 !important;
    52    }
    53  }