flexbox_sass_rails 0.2.3 → 0.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 64da608b1f764c4fa6f8d35db55688e073eeb665
-  data.tar.gz: 7e68060bbac0a32ce7ad00d3bc8a0edec9be048f
+  metadata.gz: 2bac61c948bc66815f6c4e1e3ba3b39da05d56e6
+  data.tar.gz: 69fd41028f4da5274fecd39e7dedcfa6fe6616d7
 SHA512:
-  metadata.gz: 385597dbe32b36dc6f0b86d7c1d847410ab24c101bc164772193d69c88aee2fb9447666b2553f45908f83eb6b5f935825f5c2f1915f8ae59cc8e8a5f58fa8602
-  data.tar.gz: bee2c52efa2d11a61159cb3a64a8863305d946daa4c893370892bf85b4440b31863359e0cb378bafe80ed22e655dd122ef9110271e7c85fe47af70b3a9192cf2
+  metadata.gz: 5003c63ba87ea3c75caee7974dc19ec00372cf2d6b43e84ad1e5857f10cb12b38b7afe9c55de1b1d93895bc2680638cc62ab93fbe0b533c5fe1eea0544040f26
+  data.tar.gz: c4aa7de7b0efae656a499546dda7e90b14e43b95df166dfec2712bbc7c2538bc7ec2c58f67af2ffe48eb323e78f7ddafa80265560507c6948a4df40afa18bb5e

data/app/assets/stylesheets/components/_variables.scss

@@ -7,3 +7,8 @@ $fb-layout-sm: 600px !default;
 $fb-layout-md: 960px !default;
 $fb-layout-lg: 1280px !default;
 $fb-layout-xl: 1920px !default;
+
+$fb-layout-xs-max: $fb-layout-sm - 1 !default;
+$fb-layout-sm-max: $fb-layout-md - 1 !default;
+$fb-layout-md-max: $fb-layout-lg - 1 !default;
+$fb-layout-lg-max: $fb-layout-xl - 1 !default;

data/app/assets/stylesheets/flexbox_sass_rails.scss

@@ -41,6 +41,9 @@
 @mixin fb-layout-wrap {
   flex-wrap: wrap;
 }
+@mixin fb-layout-no-wrap {
+  flex-wrap: nowrap;
+}
 
 // Flex
 
@@ -140,10 +143,16 @@
   order: $amount;
 }
 
+// Hide
+
+@mixin fb-hide {
+  display: none;
+}
+
 // Responsivity mixin
 // ==========================================================================
 
-@mixin fb-responsivity-($size: null){
+@mixin fb-responsivity($size: null){
 
   // Add size
 
@@ -178,6 +187,10 @@
       @include fb-layout-wrap;
     }
 
+    .fb-layout#{$output}-no-wrap{
+      @include fb-layout-no-wrap;
+    }
+
   // Flex
 
     // Placeholders
@@ -399,6 +412,14 @@
       }
     }
 
+  // Hide
+
+    // Output
+
+    .fb-hide#{$output} {
+      @include fb-hide;
+    }
+
 }
 
 // Styles output
@@ -408,24 +429,48 @@
   @include fb-layout-fill;
 }
 
-@include fb-responsivity-();
+@include fb-responsivity();
+
+@media (max-width: $fb-layout-lg-max) {
+  @include fb-responsivity(lt-xl);
+}
+
+@media (max-width: $fb-layout-md-max) {
+  @include fb-responsivity(lt-lg);
+}
+
+@media (max-width: $fb-layout-sm-max) {
+  @include fb-responsivity(lt-md);
+}
+
+@media (min-width: $fb-layout-sm) {
+  @include fb-responsivity(gt-xs);
+}
+
+@media (min-width: $fb-layout-md) {
+  @include fb-responsivity(gt-sm);
+}
+
+@media (min-width: $fb-layout-lg) {
+  @include fb-responsivity(gt-md);
+}
 
 @media (min-width: $fb-layout-xl) {
-  @include fb-responsivity-(xl);
+  @include fb-responsivity(xl);
 }
 
-@media (min-width: $fb-layout-lg) and (max-width: ($fb-layout-xl - 1)) {
-  @include fb-responsivity-(lg);
+@media (min-width: $fb-layout-lg) and (max-width: ($fb-layout-lg-max)) {
+  @include fb-responsivity(lg);
 }
 
-@media (min-width: $fb-layout-md) and (max-width: ($fb-layout-lg - 1)) {
-  @include fb-responsivity-(md);
+@media (min-width: $fb-layout-md) and (max-width: ($fb-layout-md-max)) {
+  @include fb-responsivity(md);
 }
 
-@media (min-width: $fb-layout-sm) and (max-width: ($fb-layout-md - 1)) {
-  @include fb-responsivity-(sm);
+@media (min-width: $fb-layout-sm) and (max-width: ($fb-layout-sm-max)) {
+  @include fb-responsivity(sm);
 }
 
-@media (max-width: ($fb-layout-sm - 1)) {
-  @include fb-responsivity-(xs);
+@media (max-width: ($fb-layout-xs-max)) {
+  @include fb-responsivity(xs);
 }

data/lib/flexbox_sass_rails/version.rb

@@ -1,3 +1,3 @@
 module FlexboxSassRails
-  VERSION = "0.2.3"
+  VERSION = "0.3.0"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: flexbox_sass_rails
 version: !ruby/object:Gem::Version
-  version: 0.2.3
+  version: 0.3.0
 platform: ruby
 authors:
 - Pavel Cerny
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2017-03-08 00:00:00.000000000 Z
+date: 2017-04-24 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler