@@ -1,6 +1,6 @@
@charset "utf-8"
-@import generic
-@import content
-@import highlight
-@import helpers
+@import "generic"
+@import "content"
+@import "highlight"
+@import "helpers"
@@ -91,9 +91,14 @@ table
color: $text-strong
.container
- margin: 0 auto
- max-width: 960px
+ margin: 0 20px
position: relative
+ +desktop
+ margin: 0 auto
+ max-width: 960px
+ &.is-fluid
+ max-width: none
.fa
font-size: 21px
@@ -1,12 +1,12 @@
-@import grid
-@import navbar
-@import card
-@import table
-@import tabs
-@import media
-@import menu
+@import "grid"
+@import "navbar"
+@import "card"
+@import "table"
+@import "tabs"
+@import "media"
+@import "menu"
.block:not(:last-child)
margin-bottom: 20px
@@ -9,6 +9,9 @@
border-width: 0 0 1px
padding: 8px 10px
vertical-align: top
+ &.table-narrow
+ white-space: nowrap
+ width: 1%
&.table-link
padding: 0
& > a
@@ -4,7 +4,6 @@ $grey-darker: #222324
$grey-dark: #69707a
$grey: #aeb1b5
$grey-light: #d3d6db
-$grey-lighter: #ebeff5
$grey-lighter: #f5f7fa
$blue: #42afe3
@@ -1,10 +1,11 @@
-@import controls
-@import buttons
-@import titles
-@import messages
-@import notifications
+@import "controls"
+@import "buttons"
+@import "titles"
+@import "images"
+@import "messages"
+@import "notifications"
.delete
+unselectable
@@ -0,0 +1,32 @@
+$dimensions: 16 24 32 48 64 96 128
+
+.image
+ display: block
+ position: relative
+ img
+ &.is-square,
+ &.is-1by1,
+ &.is-4by3,
+ &.is-3by2,
+ &.is-16by9,
+ &.is-2by1
+ +overlay
+ height: 100%
+ width: 100%
+ &.is-1by1
+ padding-top: 100%
+ &.is-4by3
+ padding-top: 75%
+ &.is-3by2
+ padding-top: 66.6666%
+ &.is-16by9
+ padding-top: 56.25%
+ padding-top: 50%
+ @each $dimension in $dimensions
+ &.is-#{$dimension}x#{$dimension}
+ height: $dimension * 1px
+ width: $dimension * 1px
@@ -3,6 +3,10 @@
font-weight: 300
&:not(:last-child)
+ a
+ &:hover
+ border-bottom: 1px solid
+ // text-decoration: underline
.title
@@ -42,6 +42,9 @@
border: none
ul
border-bottom: none
+ &.is-boxed
+ padding: 8px 15px
&.is-alt
background: $background
color: $text-light
-@import header
-@import hero
-@import section
-@import footer
+@import "header"
+@import "hero"
+@import "section"
+@import "footer"
@@ -1,10 +1,9 @@
.section
background: white
- padding: 40px 20px
+ padding: 40px 0
& + .section
border-top: 1px solid rgba($border, 0.5)
+desktop
- padding: 40px 0
&.is-medium
padding: 120px 0
&.is-large
@@ -64,6 +64,7 @@
$tablet: 769px
$desktop: 980px
+$widescreen: 1180px
=from($device)
@media screen and (min-width: $device)
@@ -88,3 +89,7 @@ $desktop: 980px
=desktop
@media screen and (min-width: $desktop)
@content
+=widescreen
+ @media screen and (min-width: $widescreen)
+ @content
-@import reset
-@import functions
-@import mixins
-@import animations
+@import "reset"
+@import "functions"
+@import "mixins"
+@import "animations"