src/sass/main.sass

   1 @charset "utf-8"
   2
   3 // Import some basic variables from Bulma
   4 @import "../third-party/bulma/sass/utilities/initial-variables.sass"
   5
   6 // Global Settings
   7 $family-sans-serif:                             Prompt, sans-serif
   8
   9 $size-1:                                                3rem
  10 $size-2:                                                2.5rem
  11 $size-3:                                                2rem
  12 $size-4:                                                1.5rem
  13 $size-5:                                                1.25rem
  14 $size-6:                                                1rem
  15 $size-7:                                                0.75rem
  16
  17 // Make titles slightly larger
  18 $title-size:                                    $size-2
  19
  20 // Colour Palette
  21 $primary:                                               #ff2e52
  22 $primary-invert:                                #ffffff
  23 $secondary:                                             #46ffc0
  24 $secondary-invert:                              #000000
  25 $success:                                               #1ae210
  26 $success-invert:                #ffffff
  27 $danger:                                                #ac001a
  28 $warning:                                               #f3ff50
  29
  30 // Custom Colours
  31 $lwl:                                                   #6534C8
  32
  33 $custom-colors: ("secondary" : ($secondary, $secondary-invert), "lwl" : ($lwl, $white))
  34
  35 // Use the primary colour for links
  36 $link:                                                  $primary
  37
  38 // Use black for titles
  39 $title-color:                   $grey-darker
  40
  41 // Use dark grey for text
  42 $text:                          $grey-darker
  43
  44 // Use the primary color for code
  45 $code:                                                  $primary
  46
  47 @import "../third-party/bulma/sass/utilities/derived-variables.sass"
  48
  49 // Controls
  50 $control-border-width:                                  4px
  51
  52 // Breadcrumbs
  53 $breadcrumb-item-color:         $primary
  54 $breadcrumb-item-hover-color:   $primary-dark
  55 $breadcrumb-item-active-color:  $primary
  56
  57 // section
  58 $section-padding:               3rem 1.5rem
  59 $section-padding-desktop:       3rem 0.5rem
  60
  61 // Import Bulma
  62 @import "../third-party/bulma/sass/utilities/_all.sass"
  63 @import "../third-party/bulma/sass/base/_all.sass"
  64 @import "../third-party/bulma/sass/components/_all.sass"
  65 @import "../third-party/bulma/sass/elements/_all.sass"
  66 @import "../third-party/bulma/sass/form/_all.sass"
  67 @import "../third-party/bulma/sass/grid/_all.sass"
  68 @import "../third-party/bulma/sass/helpers/_all.sass"
  69 @import "../third-party/bulma/sass/layout/_all.sass"
  70
  71 // Import fonts
  72 @import "_fonts"
  73
  74 // Import icons
  75 @import "_icons"
  76
  77 // Custom CSS
  78
  79 html, body
  80         min-height: 100vh;
  81
  82 #hero-index
  83         position: relative
  84         video
  85                 width: 100%;
  86                 height: 100%;
  87                 position: absolute;
  88                 object-fit: cover;
  89                 z-index: 0;
  90
  91 .footer
  92         a
  93                 color: $grey
  94                 &:hover
  95                         color: $black
  96
  97 // Used to wrap text on buttons
  98 .wrap-text
  99     height: max-content;
 100     white-space: inherit;
 101
 102 .map
 103         width: 100%;
 104         height: 100%;
 105         min-height: 24rem;