Skip to content
Snippets Groups Projects
_dialog.scss 1.33 KiB
Newer Older
  • Learn to ignore specific revisions
  • Yoan VALLET's avatar
    Yoan VALLET committed
    @import '../base/color';
    
    Yoan VALLET's avatar
    Yoan VALLET committed
    
    
    div.modal-root {
      .MuiBackdrop-root {
    
        background-color: hsla(231, 11%, 12%, 0.85);
    
    div.modal-paper {
    
    Yoan VALLET's avatar
    Yoan VALLET committed
      background: $grey-linear-gradient-background;
      width: 36rem;
      max-width: 100%;
      max-height: 90vh;
    
      padding: 2rem;
    
    Yoan VALLET's avatar
    Yoan VALLET committed
      box-sizing: border-box;
      box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
      border-radius: 4px;
      margin: 0 0 0 13.75rem;
      align-items: center;
      color: $white;
      @media #{$tablet} {
        width: 35rem;
        margin: 0;
      }
      @media #{$large-phone} {
    
        padding: 1rem 1rem 1.5rem;
    
    Yoan VALLET's avatar
    Yoan VALLET committed
        width: 85%;
        max-width: 35rem;
        margin: 0;
      }
    
      &.no-padding {
        padding: 0;
      }
    
    Yoan VALLET's avatar
    Yoan VALLET committed
      &.blue-border {
        border: 1px solid $blue-40;
      }
    
      &.blue-light-border {
        border: 1px solid $blue-light;
      }
    
    Yoan VALLET's avatar
    Yoan VALLET committed
      &.yellow-border {
        border: 1px solid $gold-40;
      }
    
      .modal-paper-close-button {
    
    Yoan VALLET's avatar
    Yoan VALLET committed
        position: absolute;
        top: 0.5rem;
        right: 0.5rem;
        padding: 5px 5px;
    
    Yoan VALLET's avatar
    Yoan VALLET committed
      }
    }
    
    div.modal-paper-full-screen {
    
    Yoan VALLET's avatar
    Yoan VALLET committed
      background: $grey-linear-gradient-background;
    
    Yoan VALLET's avatar
    Yoan VALLET committed
      max-width: 100%;
    
      height: 100%;
      max-height: 100%;
    
    Yoan VALLET's avatar
    Yoan VALLET committed
      padding: 0;
      margin: 0;
      box-sizing: border-box;
      box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
      border-radius: 4px;
      color: $white;
    
      display: flex;
      align-items: center;
    
      &.dark-background {
        background: $dark-light-2;
      }