Add only responsive classes, Remove test tiles, Remove section border, Add widescreen container

CHANGELOG.md

@@ -2,11 +2,23 @@
 
 ## 0.0.24
 
+### Added
+
+* `is-mobile` for the navbar
+
+### Removed
+
+* removed border between sections. Use `<hr class="is-marginless">` now
+
 ### Updated
 
-* restructured file structure
+* restructured files
 * added back `inline-flex` for controls and tags
 
+### Removed
+
+* test tiles
+
 ## 0.0.23
 
 ### BREAKING

sass/base/classes.sass

@@ -11,6 +11,8 @@
     &.is-fluid
       margin: 0 20px
       max-width: none
+  +widescreen
+    max-width: 1200px
 
 .fa
   font-size: 21px

sass/base/helpers.sass

@@ -40,7 +40,7 @@
     display: none !important
 
 .is-hidden-tablet
-  +tablet
+  +tablet-only
     display: none !important
 
 .is-hidden-touch
@@ -48,7 +48,7 @@
     display: none !important
 
 .is-hidden-desktop
-  +desktop
+  +desktop-only
     display: none !important
 
 // Other

sass/components/grid.sass

@@ -211,19 +211,6 @@
     &.is-desktop
       display: flex
 
-.tilefiejsoif
-  flex: 1
-  // Modifiers
-  &.is-parent
-    padding: 10px
-  // Responsiveness
-  +tablet
-    // Sizes
-    @for $i from 1 through 12
-      &.is-#{$i}
-        flex: none
-        width: ($i / 12) * 100%
-
 .tile
   align-items: stretch
   flex: 1

sass/components/navbar.sass

@@ -34,16 +34,24 @@
 
 .navbar
   @extend .block
+  align-items: center
+  justify-content: space-between
   code
     border-radius: $radius
   img
     display: inline-block
     vertical-align: top
+  // Modifiers
+  &.is-mobile
+    display: flex
+    & > .navbar-item
+      &:not(:last-child)
+        margin-bottom: 0
+      &:not(.is-narrow)
+        flex: 1
   // Responsiveness
   +tablet
-    align-items: center
     display: flex
-    justify-content: space-between
     & > .navbar-item
       &:not(.is-narrow)
         flex: 1

sass/layout/section.sass

@@ -1,8 +1,6 @@
 .section
   background: white
   padding: 40px 20px
-  & + .section
-    border-top: 1px solid rgba($border, 0.5)
   // Responsiveness
   +desktop
     padding: 40px 0

sass/utilities/mixins.sass

@@ -78,6 +78,10 @@
   @media screen and (min-width: $tablet)
     @content
 
+=tablet-only
+  @media screen and (min-width: $tablet) and (max-width: $desktop - 1px)
+    @content
+
 =touch
   @media screen and (max-width: $desktop - 1px)
     @content
@@ -86,6 +90,10 @@
   @media screen and (min-width: $desktop)
     @content
 
+=desktop-only
+  @media screen and (min-width: $desktop) and (max-width: $widescreen - 1px)
+    @content
+
 =widescreen
   @media screen and (min-width: $widescreen)
     @content