Fix #242

diff --git a/sass/base/generic.sass b/sass/base/generic.sass
index f57517043d50ee94137fe3f4107755c9b1789aa3..09a85fed1f599abb6bf35b572aa762f5611ef7d0 100644 (file)
--- a/sass/base/generic.sass
+++ b/sass/base/generic.sass
@@ -1,5 +1,5 @@
 html
-  background: $body-background
+  background-color: $body-background
   font-size: $size-normal
   -moz-osx-font-smoothing: grayscale
   -webkit-font-smoothing: antialiased
@@ -48,7 +48,7 @@ a
     color: $link-hover
 
 code
-  background: $code-background
+  background-color: $code-background
   color: $code
   font-size: 12px
   font-weight: normal
@@ -79,12 +79,12 @@ strong
 // Block
 
 pre
-  background: $pre-background
+  background-color: $pre-background
   color: $pre
   white-space: pre
   word-wrap: normal
   code
-    background: $pre-background
+    background-color: $pre-background
     color: $pre
     display: block
     overflow-x: auto

diff --git a/sass/components/card.sass b/sass/components/card.sass
index 2ea032e8607ac4200950c6c2411701380faff060..d993667a1d98bef7cf243e8984797f7d84fd18d4 100644 (file)
--- a/sass/components/card.sass
+++ b/sass/components/card.sass
@@ -43,7 +43,7 @@
     border-right: 1px solid $border
 
 .card
-  background: $white
+  background-color: $white
   box-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)
   color: $text
   max-width: 100%

diff --git a/sass/components/media.sass b/sass/components/media.sass
index 8735b1b28826202236ded1005f654e19a0647ffd..5c5e799a76493b2260141fd306904717eb9c8876 100644 (file)
--- a/sass/components/media.sass
+++ b/sass/components/media.sass
@@ -1,5 +1,5 @@
 .media-number
-  background: $background
+  background-color: $background
   border-radius: 290486px
   display: inline-block
   font-size: $size-medium

diff --git a/sass/components/menu.sass b/sass/components/menu.sass
index 402986c3e33638be651e4b8bff653fe578805c4e..c2c6daace8249bd22427e049b83f3d4e96b926c4 100644 (file)
--- a/sass/components/menu.sass
+++ b/sass/components/menu.sass
@@ -10,11 +10,11 @@
     display: block
     padding: 5px 10px
     &:hover
-      background: $background
+      background-color: $background
       color: $link
     // Modifiers
     &.is-active
-      background: $link
+      background-color: $link
       color: $link-invert
   li
     ul

diff --git a/sass/components/message.sass b/sass/components/message.sass
index 83b8424e231a9cd506044192bfe445aa52e4eedf..c133fd99617807d3e9c05de6ff014d564b60380d 100644 (file)
--- a/sass/components/message.sass
+++ b/sass/components/message.sass
@@ -6,7 +6,7 @@
     color: inherit
 
 .message-header
-  background: $text
+  background-color: $text
   border-radius: $radius $radius 0 0
   color: $text-invert
   padding: 7px 10px
@@ -18,7 +18,7 @@
 
 .message
   @extend .block
-  background: $background
+  background-color: $background
   border-radius: $radius
   // Colors
   @each $name, $pair in $colors
@@ -27,9 +27,9 @@
     $lightning: max((100% - lightness($color)) - 4%, 0%)
     $darkness: max(lightness($color) - 10%, lightness($color))
     &.is-#{$name}
-      background: lighten($color, $lightning)
+      background-color: lighten($color, $lightning)
       .message-header
-        background: $color
+        background-color: $color
         color: $color-invert
       .message-body
         border-color: $color

diff --git a/sass/components/modal.sass b/sass/components/modal.sass
index e1d4360038427939da78b5ae87afc261402e3fd2..b61945cbf80a80b6f32a8bec90e244ef887cf9c5 100644 (file)
--- a/sass/components/modal.sass
+++ b/sass/components/modal.sass
@@ -1,6 +1,6 @@
 .modal-background
   +overlay
-  background: rgba($black, 0.86)
+  background-color: rgba($black, 0.86)
 
 .modal-content
   margin: 0 20px
@@ -25,7 +25,7 @@
 
 .modal-card
   @extend .modal-content
-  background: $white
+  background-color: $white
   border-radius: $radius-large
   display: flex
   flex-direction: column
@@ -35,7 +35,7 @@
 .modal-card-head,
 .modal-card-foot
   align-items: center
-  background: $background
+  background-color: $background
   display: flex
   flex-shrink: 0
   justify-content: flex-start

diff --git a/sass/components/nav.sass b/sass/components/nav.sass
index 0b32f58b58e57c69bce362ab6a307db1d23a14ee..f2c5ac1ab7462fb9fc22baf1d31101ed0ce175b6 100644 (file)
--- a/sass/components/nav.sass
+++ b/sass/components/nav.sass
@@ -52,7 +52,7 @@ a.nav-item
 .nav-menu
   // Responsiveness
   +mobile
-    background: $white
+    background-color: $white
     box-shadow: 0 4px 7px rgba($black, 0.1)
     left: 0
     display: none
@@ -91,7 +91,7 @@ a.nav-item
 
 .nav
   align-items: stretch
-  background: $white
+  background-color: $white
   display: flex
   min-height: $nav-height
   position: relative

diff --git a/sass/components/panel.sass b/sass/components/panel.sass
index 31ccea38d5f7a83f066b4177464999bc69727400..a60949ee0911c6d75703d747b55cac6f954fc601 100644 (file)
--- a/sass/components/panel.sass
+++ b/sass/components/panel.sass
@@ -8,7 +8,7 @@
     line-height: inherit
 
 .panel-heading
-  background: $background
+  background-color: $background
   border-bottom: 1px solid $border
   border-radius: 4px 4px 0 0
   color: $text-strong
@@ -48,7 +48,7 @@
 
 a.panel-block
   &:hover
-    background: $background
+    background-color: $background
 
 .panel
   border: 1px solid $border

diff --git a/sass/components/tabs.sass b/sass/components/tabs.sass
index 8214924e8044395e7b7ee85cf781ce919061920a..4138cc4d66e88a0c26e2e1bf440b999abc46086c 100644 (file)
--- a/sass/components/tabs.sass
+++ b/sass/components/tabs.sass
@@ -62,12 +62,12 @@
       padding-bottom: 5px
       padding-top: 5px
       &:hover
-        background: $background
+        background-color: $background
         border-bottom-color: $border
     li
       &.is-active
         a
-          background: $white
+          background-color: $white
           border-color: $border
           border-bottom-color: transparent !important
   &.is-fullwidth
@@ -81,7 +81,7 @@
       padding-top: 5px
       position: relative
       &:hover
-        background: $background
+        background-color: $background
         border-color: $border-hover
         z-index: 2
     li
@@ -93,7 +93,7 @@
         border-radius: 0 $radius $radius 0
       &.is-active
         a
-          background: $primary
+          background-color: $primary
           border-color: $primary
           color: $primary-invert
           z-index: 1

diff --git a/sass/elements/box.sass b/sass/elements/box.sass
index eeef09a4bdbefbd0b16b79cf24410dc9913f53a8..b4f99840b4df426c282f40cba3ba9f207872bca0 100644 (file)
--- a/sass/elements/box.sass
+++ b/sass/elements/box.sass
@@ -1,6 +1,6 @@
 .box
   @extend .block
-  background: $white
+  background-color: $white
   border-radius: $radius-large
   box-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)
   display: block

diff --git a/sass/elements/button.sass b/sass/elements/button.sass
index f05247f1f82ac7303b95ef401aab8738075c5b22..4b5cb6c757befdd4ae62ae4f2e2fdb46b6d591e6 100644 (file)
--- a/sass/elements/button.sass
+++ b/sass/elements/button.sass
@@ -50,42 +50,42 @@
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}
-      background: $color
+      background-color: $color
       border-color: transparent
       color: $color-invert
       &:hover,
       &:focus,
       &.is-active
-        background: darken($color, 10%)
+        background-color: darken($color, 10%)
         border-color: transparent
         color: $color-invert
       &:active
         border-color: transparent
       &.is-inverted
-        background: $color-invert
+        background-color: $color-invert
         color: $color
         &:hover
-          background: darken($color-invert, 5%)
+          background-color: darken($color-invert, 5%)
       &.is-loading
         &:after
           border-color: transparent transparent $color-invert $color-invert !important
       &.is-outlined
-        background: transparent
+        background-color: transparent
         border-color: $color
         color: $color
         &:hover,
         &:focus
-          background: $color
+          background-color: $color
           border-color: $color
           color: $color-invert
   &.is-link
-    background: transparent
+    background-color: transparent
     border-color: transparent
     color: $text
     text-decoration: underline
     &:hover,
     &:focus
-      background: $border
+      background-color: $border
       color: $text-strong
   // Sizes
   &.is-small

diff --git a/sass/elements/content.sass b/sass/elements/content.sass
index 5a7a38711bdae4fc7f3c4980098fb5d160bab72c..a54203f614aadd6944149d560525f94bf8855357 100644 (file)
--- a/sass/elements/content.sass
+++ b/sass/elements/content.sass
@@ -32,7 +32,7 @@
     &:not(:first-child)
       margin-top: 40px
   blockquote
-    background: $background
+    background-color: $background
     border-left: 5px solid $border
     padding: 1.5em
   h1

diff --git a/sass/elements/notification.sass b/sass/elements/notification.sass
index 434d6865b264145a99226306e2e075efc1204fc0..63d1739af0df0f235dc82639d43b6ec2d591f698 100644 (file)
--- a/sass/elements/notification.sass
+++ b/sass/elements/notification.sass
@@ -1,7 +1,7 @@
 .notification
   @extend .block
   +clearfix
-  background: $background
+  background-color: $background
   border-radius: $radius
   padding: 16px 20px
   position: relative
@@ -17,5 +17,5 @@
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}
-      background: $color
+      background-color: $color
       color: $color-invert

diff --git a/sass/elements/other.sass b/sass/elements/other.sass
index e92bb0953320dac808949c0703f0475ea0be39c8..5101872612bd0dc6bd22d84b4836c29c06f6ea02 100644 (file)
--- a/sass/elements/other.sass
+++ b/sass/elements/other.sass
@@ -2,7 +2,7 @@
   @extend .unselectable
   -moz-appearance: none
   -webkit-appearance: none
-  background: rgba($black, 0.2)
+  background-color: rgba($black, 0.2)
   border: none
   border-radius: 290486px
   cursor: pointer
@@ -13,7 +13,7 @@
   width: 24px
   &:before,
   &:after
-    background: $white
+    background-color: $white
     content: ""
     display: block
     height: 2px
@@ -28,7 +28,7 @@
   &:after
     transform: rotate(-45deg)
   &:hover
-    background: rgba($black, 0.5)
+    background-color: rgba($black, 0.5)
   // Sizes
   &.is-small
     height: 16px
@@ -60,7 +60,7 @@
   position: relative
   width: $nav-height
   span
-    background: $text
+    background-color: $text
     display: block
     height: 1px
     left: 50%
@@ -77,11 +77,11 @@
     &:nth-child(3)
       margin-top: 4px
   &:hover
-    background: $background
+    background-color: $background
   // Modifers
   &.is-active
     span
-      background: $link
+      background-color: $link
       &:nth-child(1)
         margin-left: -5px
         transform: rotate(45deg)
@@ -124,7 +124,7 @@
   width: 16px
 
 .number
-  background: $background
+  background-color: $background
   border-radius: 290486px
   display: inline-block
   font-size: $size-medium
@@ -132,7 +132,7 @@
 
 .tag
   align-items: center
-  background: $background
+  background-color: $background
   border-radius: 290486px
   color: $text
   display: inline-flex
@@ -155,7 +155,7 @@
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}
-      background: $color
+      background-color: $color
       color: $color-invert
   // Sizes
   &.is-small

diff --git a/sass/elements/progress.sass b/sass/elements/progress.sass
index 8136f5589846ddff4093b4fe32f43ceb9daeea0f..bfaeaa68081c89b640d0f2fd1b7dc9a20ccae189 100644 (file)
--- a/sass/elements/progress.sass
+++ b/sass/elements/progress.sass
@@ -10,19 +10,19 @@
   padding: 0
   width: 100%
   &::-webkit-progress-bar
-    background: $border
+    background-color: $border
   &::-webkit-progress-value
-    background: $text
+    background-color: $text
   &::-moz-progress-bar
-    background: $text
+    background-color: $text
   // Colors
   @each $name, $pair in $colors
     $color: nth($pair, 1)
     &.is-#{$name}
       &::-webkit-progress-value
-        background: $color
+        background-color: $color
       &::-moz-progress-bar
-        background: $color
+        background-color: $color
   // Sizes
   &.is-small
     height: 8px

diff --git a/sass/elements/table.sass b/sass/elements/table.sass
index 944120659dda5a4a36c06d2124a8097bb9dd7fde..9984df0d9ce4bb00979c22d580e30acd4de0107e 100644 (file)
--- a/sass/elements/table.sass
+++ b/sass/elements/table.sass
@@ -1,5 +1,5 @@
 .table
-  background: $white
+  background-color: $white
   color: $text-strong
   margin-bottom: 20px
   width: 100%
@@ -27,7 +27,7 @@
         display: block
         padding: 8px 10px
         &:hover
-          background: $link
+          background-color: $link
           color: $link-invert
     &.is-narrow
       white-space: nowrap
@@ -37,7 +37,7 @@
     text-align: left
   tr
     &:hover
-      background: $background
+      background-color: $background
       color: $text-strong
   thead
     td,
@@ -84,8 +84,8 @@
     tbody
       tr
         &:hover
-          background: darken($background, 2%)
+          background-color: darken($background, 2%)
         &:nth-child(2n)
-          background: $background
+          background-color: $background
           &:hover
-            background: darken($background, 2%)
+            background-color: darken($background, 2%)

diff --git a/sass/layout/footer.sass b/sass/layout/footer.sass
index 255ebd44c15e97849beecbd8bf7cf03c04008d79..32919365434970899f709ba4df1968bd62a9e065 100644 (file)
--- a/sass/layout/footer.sass
+++ b/sass/layout/footer.sass
@@ -1,5 +1,5 @@
 .footer
-  background: $background
+  background-color: $background
   padding: 40px 20px 80px
   a
     &,

diff --git a/sass/layout/header.sass b/sass/layout/header.sass
index 07b21d4d7c13c7429cc83b4a6e1620d6d4f776ac..37a9a3c028bb0403eba700e76245580b25d89593 100644 (file)
--- a/sass/layout/header.sass
+++ b/sass/layout/header.sass
@@ -2,7 +2,7 @@ $header-height: 50px !default
 
 .header
   +clearfix
-  background: $white
+  background-color: $white
   display: flex
   line-height: 24px
   min-height: $header-height
@@ -143,7 +143,7 @@ a.header-item
     justify-content: center
 
 .header.is-small
-  background: $background
+  background-color: $background
   box-shadow: none
   height: 40px
   z-index: 1

diff --git a/sass/layout/hero.sass b/sass/layout/hero.sass
index 67f9283489cbed0b080a23cad918a23ce1254d0a..d9a6fa4b53f17005cdf05950f0c15c3f1ee00a86 100644 (file)
--- a/sass/layout/hero.sass
+++ b/sass/layout/hero.sass
@@ -49,7 +49,7 @@
 
 .hero
   align-items: stretch
-  background: $white
+  background-color: $white
   display: flex
   flex-direction: column
   justify-content: space-between
@@ -64,7 +64,7 @@
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}
-      background: $color
+      background-color: $color
       color: $color-invert
       .title
         color: $color-invert
@@ -80,7 +80,7 @@
         box-shadow: 0 1px 0 rgba($color-invert, 0.2)
       .nav-menu
         +mobile
-          background: $color
+          background-color: $color
       a.nav-item,
       .nav-item a:not(.button)
         color: rgba($color-invert, 0.5)
@@ -101,11 +101,11 @@
           a
             color: $color-invert
             &:hover
-              background: rgba($black, 0.1)
+              background-color: rgba($black, 0.1)
           li.is-active a
             &,
             &:hover
-              background: $color-invert
+              background-color: $color-invert
               border-color: $color-invert
               color: $color
       // Modifiers
@@ -117,12 +117,12 @@
       +mobile
         .nav-toggle
           span
-            background: $color-invert
+            background-color: $color-invert
           &:hover
-            background: rgba($black, 0.1)
+            background-color: rgba($black, 0.1)
           &.is-active
             span
-              background: $color-invert
+              background-color: $color-invert
         .nav-menu
           .nav-item
             border-top-color: rgba($color-invert, 0.2)

diff --git a/sass/layout/section.sass b/sass/layout/section.sass
index 44b8c1b588f6cf58ffd8d864efe04ee207c62801..95b74d0b9f82a8558caa572193a6dfb94cb6e62f 100644 (file)
--- a/sass/layout/section.sass
+++ b/sass/layout/section.sass
@@ -1,5 +1,5 @@
 .section
-  background: $white
+  background-color: $white
   padding: 40px 20px
   // Responsiveness
   +desktop

diff --git a/sass/utilities/controls.sass b/sass/utilities/controls.sass
index 887e34c7cc0ac01caf1d026e5e70b43728bcd2cb..28b77c1604a72699b88af00cf4973fa5ba6d0d55 100644 (file)
--- a/sass/utilities/controls.sass
+++ b/sass/utilities/controls.sass
@@ -2,7 +2,7 @@
   -moz-appearance: none
   -webkit-appearance: none
   align-items: center
-  background: $control-background
+  background-color: $control-background
   border: 1px solid $control-border
   border-radius: $radius
   color: $control
@@ -24,7 +24,7 @@
     outline: none
   &[disabled],
   &.is-disabled
-    background: $background
+    background-color: $background
     border-color: $control-border
     cursor: not-allowed
     pointer-events: none

diff --git a/sass/utilities/mixins.sass b/sass/utilities/mixins.sass
index e1802963834ad9f100722c6a73cc380b67825805..e15c8065a18bbfd91f69eb94d433158665fde92e 100644 (file)
--- a/sass/utilities/mixins.sass
+++ b/sass/utilities/mixins.sass
@@ -46,7 +46,9 @@
       @content
 
 =replace($background, $width, $height)
-  background: $background center center no-repeat
+  background-color: $background
+  background-position: center center
+  background-repeat: no-repeat
   background-size: $width $height
   display: block
   height: $height