baseguide - npm Package Compare versions

Comparing version 1.3.3 to 1.3.4

package.json

 {
   "name": "baseguide",
   "description": "Lightweight and robust CSS framework for prototyping and production code.",
-  "version": "1.3.3",
+  "version": "1.3.4",
   "keywords": [
@@ -19,5 +19,5 @@ "css",
   "devDependencies": {
-    "autoprefixer": "^6.3.1",
+    "autoprefixer": "^6.3.3",
     "browser-sync": "^2.11.1",
-    "gulp": "^3.9.0",
+    "gulp": "^3.9.1",
     "gulp-cache": "^0.4.2",
@@ -34,5 +34,5 @@ "gulp-iconify": "git://github.com/slavanga/gulp-iconify.git",
     "gulp-sourcemaps": "^1.6.0",
-    "gulp-uglify": "^1.5.1",
+    "gulp-uglify": "^1.5.2",
     "gulp-util": "^3.0.7"
   }
 }

README.md

 # [Baseguide](http://basegui.de)
 Baseguide is a lightweight and robust CSS framework for prototyping and production code. It combines all essential components in a customizable and easy to use package.
 
-[![GitHub version](https://badge.fury.io/gh/slavanga%2Fbaseguide.svg)](https://badge.fury.io/gh/slavanga%2Fbaseguide)
+[![npm version](https://badge.fury.io/js/baseguide.svg)](https://badge.fury.io/js/baseguide)
 
@@ -126,3 +126,3 @@ ## Features
 ```scss
-// $gutter: gutter width in pixels, defaults to $grid-gutter
+// $gutter: gutter width in pixels or map with gutters, defaults to $grid-gutter
 // $size: an integer, the number of columns
@@ -141,2 +141,4 @@ // $columns: an integer, the total number of columns, defaults to $grid-columns
 @include column-offset($size, $columns);
+
+@include column-block($columns);
 ```
@@ -146,9 +148,35 @@
 
-The example below shows how to create a mobile first layout with five columns.
 
+#### Simple two column layout
+
 ```scss
-.col-news-item {
+@include mq(sm) {
+  .col-content {
+    @include column(8);
+  }
+
+  .col-sidebar {
+    @include column(4);
+  }
+}
+```
+
+```html
+<div class="container">
+  <div class="row">
+    <article class="col col-content">Main Content</article>
+    <aside class="col col-sidebar">Sidebar</aside>
+  </div>
+</div>
+```
+
+#### Gallery layout using block grid
+
+```scss
+.col-gallery {
   @include column-base;
+  @include column-block(3);
+
   @include mq(md) {
-    @include column(1, 5);
+    @include column-block(6);
   }
@@ -161,7 +189,8 @@ }
   <div class="row">
-    <article class="col-news-item">News item</article>
-    <article class="col-news-item">News item</article>
-    <article class="col-news-item">News item</article>
-    <article class="col-news-item">News item</article>
-    <article class="col-news-item">News item</article>
+    <div class="col-gallery">Gallery item</div>
+    <div class="col-gallery">Gallery item</div>
+    <div class="col-gallery">Gallery item</div>
+    <div class="col-gallery">Gallery item</div>
+    <div class="col-gallery">Gallery item</div>
+    <div class="col-gallery">Gallery item</div>
   </div>
@@ -168,0 +197,0 @@ </div>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

198522

increased by0.33%

Number of lines in readme file

257

increased by12.72%

No dependency changes