base.scss 2.03 KB
Newer Older
1 2
html {
  box-sizing: border-box;
3
  height: 100%;
Nicolas Giard's avatar
Nicolas Giard committed
4
  background-color: mc('grey', '900');
5 6 7 8 9 10 11 12 13
}
*, *:before, *:after {
  box-sizing: inherit;
}

[v-cloak], .is-hidden {
  display: none;
}

14
#root {
15 16
  position: relative;
  min-height: 100%;
17 18 19 20

  &.is-fullscreen {
    height: 100vh;
  }
21
}
22

Nicolas Giard's avatar
Nicolas Giard committed
23 24 25 26 27 28 29 30 31 32
.application--wrap {
  transition: all 1.2s ease;
  transform-origin: 50% 50%;
  background-color: #FFF;

  @at-root .theme--dark & {
    background-color: mc('grey', '900');
  }
}

33

34
@for $i from 0 through 25 {
35 36 37 38
  .radius-#{$i} {
    border-radius: #{$i}px;
  }
}
39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65

@for $i from 1 through 5 {
  .grey.darken-2-d#{$i} {
    background-color: darken(mc('grey', '700'), percentage($i/100)) !important;
    border-color: darken(mc('grey', '700'), percentage($i/100)) !important;
  }
  .grey.darken-2-l#{$i} {
    background-color: lighten(mc('grey', '700'), percentage($i/100)) !important;
    border-color: lighten(mc('grey', '700'), percentage($i/100)) !important;
  }
  .grey.darken-3-d#{$i} {
    background-color: darken(mc('grey', '800'), percentage($i/100)) !important;
    border-color: darken(mc('grey', '800'), percentage($i/100)) !important;
  }
  .grey.darken-3-l#{$i} {
    background-color: lighten(mc('grey', '800'), percentage($i/100)) !important;
    border-color: lighten(mc('grey', '800'), percentage($i/100)) !important;
  }
  .grey.darken-4-d#{$i} {
    background-color: darken(mc('grey', '900'), percentage($i/100)) !important;
    border-color: darken(mc('grey', '900'), percentage($i/100)) !important;
  }
  .grey.darken-4-l#{$i} {
    background-color: lighten(mc('grey', '900'), percentage($i/100)) !important;
    border-color: lighten(mc('grey', '900'), percentage($i/100)) !important;
  }
}
66 67 68 69 70 71 72 73 74 75 76 77 78
.grey.darken-5 {
  background-color: #0C0C0C !important;
  border-color: #0C0C0C !important;
}

.blue.darken-5 {
  background-color: darken(mc('blue', '900'), 20%) !important;
  border-color: darken(mc('blue', '900'), 20%) !important;
}
.indigo.darken-5 {
  background-color: darken(mc('indigo', '900'), 10%) !important;
  border-color: darken(mc('indigo', '900'), 10%) !important;
}