dlegr250_material_design 0.5.20 → 0.5.21

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 3baca51f5b510fa9ccf459c79dabebcf64e38a62
-  data.tar.gz: 474debabdc81bc80082c2cabfc8ac215dbb32ba1
+  metadata.gz: ecfe3b130d4d15de612a933bfded0d75a51d67f8
+  data.tar.gz: c639c759c13eca0e4fd094af0332d031c8584be7
 SHA512:
-  metadata.gz: 0c69c02982a9f57b081b2983a6e5d83089c6012642425b83e4e82040fc7d16a8e7e5149c9aeee8bc027688a2e79af7c78f94444e57916ce04ca0a3dd04c59842
-  data.tar.gz: 6fe0c0f5cca7f883ae8df2b3c95800df8e3bf0c747e64f7759dafe2529279b0262ad106aabe15c21c6ac7a7ffcf1b27de3809d73a9118aeb9f5ef6d4cb1fb40f
+  metadata.gz: 522ae7a1665f1c377cb2afb7dc753858e5f09a846d2db3d778242acf5dc7172701880098815f4d13b4f5c88f558249ea6ae0c7a9576948fdc3d48ca6ce8ffff2
+  data.tar.gz: 97b9fabe38d0ec04a03afb7932d6330b56a7b462b201f4aadc51d9aa3ae5244458a39b1b3b4e246d376555efc63cd3c428413a503df346d292c531b620e58972

data/lib/dlegr250_material_design/version.rb

@@ -1,3 +1,3 @@
 module Dlegr250MaterialDesign
-  VERSION = "0.5.20"
+  VERSION = "0.5.21"
 end

data/vendor/assets/stylesheets/base/mixins.scss

@@ -257,6 +257,8 @@ $default-rounded-corners-radius: 3px;
   color: color("text");
   font-size: $font-size-normal;
   min-height: $list-one-line-height;
+  padding-left: $spacing-small;
+  padding-right: $spacing-right;
   @include flex-parent-row();
   @include no-touch-highlight-color();
   @include transition(background-color 0.30s ease);
@@ -264,17 +266,17 @@ $default-rounded-corners-radius: 3px;
 
 @mixin list-item-icon() {
   color: color("icon");
-  max-width: 56px;
-  padding-left: $spacing-normal;
+  max-width: 64px;
+  padding-left: $spacing-small;
   text-align: center;
-  width: 56px;
+  width: 64px;
 }
 
 @mixin list-item-primary() {
   color: color("text");
   flex: 1; // Fill space
   font-size: $font-size-normal;
-  padding: $spacing-normal;
+  padding: $spacing-normal $spacing-small;
 }
 
 @mixin list-item-primary-supertext() {
@@ -293,8 +295,9 @@ $default-rounded-corners-radius: 3px;
 
 @mixin list-item-secondary() {
   color: color("helper");
-  padding-right: $spacing-normal;
-  text-align: right;
+  padding-left: $spacing-small;
+  padding-right: $spacing-small;
+  // text-align: right;
 }
 
 @mixin list-item-secondary-actions() {

data/vendor/assets/stylesheets/components/boxes.scss

@@ -2,75 +2,104 @@
 // Extends .list and .list-item in order to keep code DRY.
 //======================================================================
 
-// Box  - base
-//----------------------------------------------------------------------
-
 .box {
   background-color: color("white");
   border: 1px solid color("divider");
-  color: color("text");
-  min-height: 0;
-  padding: $spacing-normal 0; // box-primary has padding on L/R already
-  @include flex-parent-row();
-  @include rounded-corners;
+  @include rounded-corners();
 }
 
-// Box - icon
-//----------------------------------------------------------------------
+.box-header {
+  background-color: color("grey-100");
+  border-bottom: 1px solid color("divider");
+  @include list-item();
+}
 
-.box-icon {
+.box-header-icon {
   @include list-item-icon();
-  // color: color("icon");
-  // font-size: $font-size-icon;
-  // height: $list-item-icon-width;
-  // line-height: $list-item-icon-width;
-  // margin-left: $spacing-normal;
-  // padding: 0;
-  // text-align: center;
-  // width: $list-item-icon-width;
-  //
-  // .icon {
-  //   color: color("icon");
-  //   font-size: $font-size-icon;
-  // }
 }
 
-.box-icon-circle {
-  background-color: color("icon");
-  @include rounded-corners(50%);
-
-  .icon {
-    color: color("white");
-  }
+.box-header-primary {
+  font-weight: bold;
+  @include list-item-primary();
 }
 
-// Box - primary
-//----------------------------------------------------------------------
-
-.box-primary {
-  @include list-item-primary();
-  @include force-text-wrap();
+.box-icon {
+  @include list-item-icon();
 }
 
-.box-primary-subtext {
-  @include list-item-primary-subtext();
-  @include force-text-wrap();
+.box-content {
+  @include list-item-primary();
 }
 
-// Box - secondary
+// Box  - base
 //----------------------------------------------------------------------
 
-.box-secondary {
-  @include list-item-secondary();
-}
+// .box {
+//   background-color: color("white");
+//   border: 1px solid color("divider");
+//   color: color("text");
+//   min-height: 0;
+//   padding: $spacing-normal 0; // box-primary has padding on L/R already
+//   @include flex-parent-row();
+//   @include rounded-corners;
+// }
 
-// Box - flat
+// Box - icon
 //----------------------------------------------------------------------
 
-.box-flat {
-  border: none;
-  @include rounded-corners(0);
-}
+// .box-icon {
+//   @include list-item-icon();
+//   // color: color("icon");
+//   // font-size: $font-size-icon;
+//   // height: $list-item-icon-width;
+//   // line-height: $list-item-icon-width;
+//   // margin-left: $spacing-normal;
+//   // padding: 0;
+//   // text-align: center;
+//   // width: $list-item-icon-width;
+//   //
+//   // .icon {
+//   //   color: color("icon");
+//   //   font-size: $font-size-icon;
+//   // }
+// }
+//
+// .box-icon-circle {
+//   background-color: color("icon");
+//   @include rounded-corners(50%);
+//
+//   .icon {
+//     color: color("white");
+//   }
+// }
+//
+// // Box - primary
+// //----------------------------------------------------------------------
+//
+// .box-primary {
+//   @include list-item-primary();
+//   @include force-text-wrap();
+// }
+//
+// .box-primary-subtext {
+//   @include list-item-primary-subtext();
+//   @include force-text-wrap();
+// }
+//
+// // Box - secondary
+// //----------------------------------------------------------------------
+//
+// .box-secondary {
+//   @include list-item-secondary();
+// }
+//
+// // Box - flat
+// //----------------------------------------------------------------------
+//
+// .box-flat {
+//   border: none;
+//   @include rounded-corners(0);
+// }
 
 // Box - custom boxes
 //----------------------------------------------------------------------

data/vendor/assets/stylesheets/components/cards.scss

@@ -115,6 +115,19 @@
   border-top: none;
 }
 
+// Cards - links in card
+//----------------------------------------------------------------------
+
+.card .link {
+  color: color("text");
+  text-decoration: none;
+
+  &:hover {
+    text-decoration: underline;
+  }
+}
+
+
 // Card - image header
 // Using an image at top instead of header text
 //----------------------------------------------------------------------

data/vendor/assets/stylesheets/components/dividers.scss

@@ -4,12 +4,9 @@
 // <hr class="spacer large" />
 //======================================================================
 
-// Dividers - base
-//----------------------------------------------------------------------
-
 hr {
-  height: 0;
-  margin: $spacing-small 0;
+  height: 1px;
+  margin: ($spacing-normal / 2) 0;
 
   // Has a line
   &.divider {
@@ -23,51 +20,39 @@ hr {
     margin: $spacing-normal 0;
   }
 
-  // No margins, totally flush against other containers
-  &.flush {
-    margin: 0;
-  }
-
-  &.xsmall {
-    margin: $spacing-xsmall 0;
-  }
-
-  &.small {
-    margin: $spacing-small 0;
-  }
-
-  &.large {
-    margin: $spacing-large 0;
-  }
+  &.xsmall { margin: ($spacing-xsmall / 2) 0; }
+  &.small { margin: ($spacing-small / 2) 0; }
+  &.large { margin: ($spacing-large / 2) 0; }
+  &.xlarge { margin: ($spacing-xlarge / 2) 0; }
 
-  &.xlarge {
-    margin: $spacing-xlarge 0;
-  }
+  // No margins, totally flush against other containers
+  &.flush { margin: 0; }
 }
 
+// WHAT ARE THESE USED FOR???
 // Label dividers
 //----------------------------------------------------------------------
 
-.label-divider {
-  border-top: 1px solid #ccc;
-  height: 0;
-  margin: $spacing-large 0;
-  position: relative;
-  text-align: center;
-}
-
-.label-divider-text {
-  $label-divider-text-width: 30px;
-
-  background-color: #fff;
-  color: #999;
-  display: inline-block;
-  height: $label-divider-text-width;
-  line-height: $label-divider-text-width;
-  padding: 0;
-  position: relative;
-  text-align: center;
-  top: -16px;
-  width: $label-divider-text-width;
-  @include rounded-corners(50%);
-}
+// .label-divider {
+//   border-top: 1px solid #ccc;
+//   height: 0;
+//   margin: $spacing-large 0;
+//   position: relative;
+//   text-align: center;
+// }
+//
+// .label-divider-text {
+//   $label-divider-text-width: 30px;
+//
+//   background-color: #fff;
+//   color: #999;
+//   display: inline-block;
+//   height: $label-divider-text-width;
+//   line-height: $label-divider-text-width;
+//   padding: 0;
+//   position: relative;
+//   text-align: center;
+//   top: -16px;
+//   width: $label-divider-text-width;
+//   @include rounded-corners(50%);
+// }

data/vendor/assets/stylesheets/components/lists.scss

@@ -74,7 +74,7 @@ ol {
 // Lists - links in text
 //----------------------------------------------------------------------
 
-.list-item .link {
+.list .link {
   color: color("text");
   text-decoration: none;
 
@@ -174,6 +174,40 @@ ol {
 
 // background-color-white bordered-rounded list-divided
 
+// List headers
+//----------------------------------------------------------------------
+
+.list-header {
+  background-color: color("grey-100");
+  border-bottom: 1px solid color("divider");
+  @include list-item();
+}
+
+.list-header-icon {
+  @include list-item-icon();
+}
+
+.list-header-primary {
+  font-weight: bold;
+  @include list-item-primary();
+}
+
+.list-header-primary-supertext {
+  @include list-item-primary-supertext();
+}
+
+.list-header-primary-subtext {
+  @include list-item-primary-subtext();
+}
+
+.list-header-secondary {
+  @include list-item-secondary();
+}
+
+.list-header-secondary-actions {
+  @include list-item-secondary-actions();
+}
+
 // // Lists - header
 // //----------------------------------------------------------------------
 //

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: dlegr250_material_design
 version: !ruby/object:Gem::Version
-  version: 0.5.20
+  version: 0.5.21
 platform: ruby
 authors:
 - Daniel LeGrand
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2017-02-07 00:00:00.000000000 Z
+date: 2017-02-09 00:00:00.000000000 Z
 dependencies: []
 description: 'WARNING: ALPHA CODE, NOT PRODUCTION READY. ACTIVELY UNDER DEVELOPMENT
   AS OF AUG 2016. Implement Google Material Design spec with modern browsers in mind