dlegr250_material_design 0.6.05 → 0.6.06

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 89a6b920f3558025551525cf41ccbc18ba9a0058
-  data.tar.gz: af3a8542735dc424a12bbf43e9bbe5ab9cdb3dea
+  metadata.gz: 35a8c13741f8d345a001951845e93f34f2306ddb
+  data.tar.gz: 38ed4115bb32058908c620ef42c0d1a120174a07
 SHA512:
-  metadata.gz: 1cef0ec324878494654f9c3de47a30fcf91f51d4f68b410516bce148ac6c36c061114580fe68b3f0b1b23b0c229143d58acb75e0bef2b75d8e4b0ad3c140289f
-  data.tar.gz: d85e533a70aa4a6326abe095a8ea82f75079999cccfe888d765a7f3a331204c8a7754ba096662d374333aad9c1d04ddc1ac4c8fd0bcddb9a9fd2c6bb1c2718a8
+  metadata.gz: 866e1a8c70eabcc7baa72cce572866c68cb142c6a1712645f6c3352770e301b47b726bca965a1885a04c7e46ee451d626e1462ed48f098762a2e55de64f06b40
+  data.tar.gz: 7d23088406aefca8f06ad242c63bbbc9b48dc3333c8e13ef35efe9b4bd47a972764f6f100e14f1ad13186ef801766fabd66dd9b41edc2032bcccfaed22897341

data/lib/dlegr250_material_design/version.rb

@@ -1,3 +1,3 @@
 module Dlegr250MaterialDesign
-  VERSION = "0.6.05"
+  VERSION = "0.6.06"
 end

data/vendor/assets/javascripts/components/dialog.coffee

@@ -53,7 +53,7 @@ class App.MD.Dialog
     element.find("input[autofocus]").focus()
 
     # Add shadow on scroll
-    element.find(".dialog-scrollable").on "scroll", (e) ->
+    element.find(".dialog-content, .dialog-scrollable").on "scroll", (e) ->
       $scrollContainer = $(this)
       $header = element.find(".dialog-toolbar")
       if $scrollContainer.scrollTop()

data/vendor/assets/javascripts/extensions/jquery/binary_insert.coffee

@@ -1,5 +1,5 @@
 jQuery.extend jQuery.fn,
-  binaryInsert: (element) ->
+  binaryInsert: (element, options = {}) ->
     @each ->
       $list = $(this)
 
@@ -11,6 +11,9 @@ jQuery.extend jQuery.fn,
       $childrenValues = $childrenWithValues.map (i, e) ->
         $(e).attr("data-sort")
 
+      if options["reverse"] == true
+        $childrenValues = $childrenValues.reverse()
+
       listLength = $children.length
 
       # New element to insert

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

@@ -35,6 +35,8 @@
 .dialog {
   background: color("white");
   cursor: default;
+  display: flex;
+  flex-direction: column;
   max-height: 100%;
   max-width: 90%;
   min-width: 280px;
@@ -61,29 +63,29 @@
   .dialog,
   .dialog-full-screen,
   .dialog[data-fullscreen="true"] {
-    height: auto;
+    // height: auto;
     max-height: 90%;
     max-width: 90%;
     position: relative;
-    width: auto;
+    // width: auto;
     @include rounded-corners();
   }
 }
 
 // Sizes
-@media (min-width: $device-small) {
-  .dialog-xsmall { width: $dialog-width-xsmall !important; }
-  .dialog-small { width: $dialog-width-small !important; }
-  .dialog-normal { width: $dialog-width-normal !important; }
-  .dialog-large { width: $dialog-width-large !important; }
-  .dialog-xlarge { width: $dialog-width-xlarge !important; }
-}
+// @media (min-width: $device-small) {
+//   .dialog-xsmall { width: $dialog-width-xsmall !important; }
+//   .dialog-small { width: $dialog-width-small !important; }
+//   .dialog-normal { width: $dialog-width-normal !important; }
+//   .dialog-large { width: $dialog-width-large !important; }
+//   .dialog-xlarge { width: $dialog-width-xlarge !important; }
+// }
 
-.dialog-xsmall { width: $dialog-width-xsmall; }
-.dialog-small { width: $dialog-width-small; }
-.dialog-normal { width: $dialog-width-normal; }
-.dialog-large { width: $dialog-width-large; }
-.dialog-xlarge { width: $dialog-width-xlarge; }
+.dialog-xsmall { width: $dialog-width-xsmall !important; }
+.dialog-small { width: $dialog-width-small !important; }
+.dialog-normal { width: $dialog-width-normal !important; }
+.dialog-large { width: $dialog-width-large !important; }
+.dialog-xlarge { width: $dialog-width-xlarge !important; }
 
 // Dialog - title (header without toolbar actions)
 //----------------------------------------------------------------------
@@ -100,7 +102,11 @@
 
 .dialog-toolbar {
   border-bottom: 1px solid color("divider");
+  flex: none;
   height: $toolbar-height-device-small;
+  justify-content: flex-start;
+  min-height: $toolbar-height-device-small;
+  overflow: visible;
   padding: 0 $spacing-small;
   position: relative; // Allow box-shadow to cover children
   @include elevation(4);
@@ -112,24 +118,6 @@
   @include list-item-primary-subtext();
 }
 
-@media (min-width: $device-medium) {
-  .dialog-toolbar {
-    height: $toolbar-height-device-medium;
-  }
-}
-
-@media (min-width: $device-large) {
-  .dialog-toolbar {
-    height: $toolbar-height-device-large;
-  }
-}
-
-@media (min-width: $device-xlarge) {
-  .dialog-toolbar {
-    height: $toolbar-height-device-xlarge;
-  }
-}
-
 // Line up buttons with content
 .dialog-toolbar .button {
   margin-right: $spacing-small;
@@ -152,9 +140,10 @@
 //----------------------------------------------------------------------
 
 .dialog-toolbar-actions {
-  @include flex-section();
-  @include flex-align-right();
-  flex: 0;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  min-height: $toolbar-height-device-small;
 }
 
 // .dialog-header
@@ -192,64 +181,68 @@
 // Dialogs - scrollable
 //----------------------------------------------------------------------
 
+// TODO remove .dialog-scrollable eventually and just use .dialog-content
+.dialog-content,
 .dialog-scrollable {
-  max-height: calc(100vh - #{$toolbar-height-device-small});
+  // max-height: calc(100vh - #{$toolbar-height-device-small});
+  flex: 1 1 auto;
   overflow-y: auto;
 }
 
-@media (min-width: $device-medium) {
-  .dialog-scrollable {
-    max-height: calc(90vh - #{$toolbar-height-device-medium});
-  }
-}
-
-@media (min-width: $device-large) {
-  .dialog-scrollable {
-    max-height: calc(90vh - #{$toolbar-height-device-large});
-  }
-}
-
-@media (min-width: $device-xlarge) {
-  .dialog-scrollable {
-    max-height: calc(90vh - #{$toolbar-height-device-xlarge});
-  }
-}
+// @media (min-width: $device-medium) {
+//   .dialog-scrollable {
+//     // max-height: calc(90vh - #{$toolbar-height-device-medium});
+//   }
+// }
+//
+// @media (min-width: $device-large) {
+//   .dialog-scrollable {
+//     // max-height: calc(90vh - #{$toolbar-height-device-large});
+//   }
+// }
+//
+// @media (min-width: $device-xlarge) {
+//   .dialog-scrollable {
+//     // max-height: calc(90vh - #{$toolbar-height-device-xlarge});
+//   }
+// }
 
 // Dialogs - scrollable with actions
 //----------------------------------------------------------------------
 
-.dialog-scrollable-with-actions {
-  max-height: calc(100vh - #{$toolbar-height-device-small * 1});
-  overflow-y: auto;
-}
-
-@media (min-width: $device-medium) {
-  .dialog-scrollable-with-actions {
-    max-height: calc(90vh - #{$toolbar-height-device-medium * 2});
-  }
-}
-
-@media (min-width: $device-large) {
-  .dialog-scrollable-with-actions {
-    max-height: calc(90vh - #{$toolbar-height-device-large * 2});
-  }
-}
-
-@media (min-width: $device-xlarge) {
-  .dialog-scrollable-with-actions {
-    max-height: calc(90vh - #{$toolbar-height-device-xlarge * 2});
-  }
-}
+// .dialog-scrollable-with-actions {
+//   max-height: calc(100vh - #{$toolbar-height-device-small * 1});
+//   overflow-y: auto;
+// }
+//
+// @media (min-width: $device-medium) {
+//   .dialog-scrollable-with-actions {
+//     max-height: calc(90vh - #{$toolbar-height-device-medium * 2});
+//   }
+// }
+//
+// @media (min-width: $device-large) {
+//   .dialog-scrollable-with-actions {
+//     max-height: calc(90vh - #{$toolbar-height-device-large * 2});
+//   }
+// }
+//
+// @media (min-width: $device-xlarge) {
+//   .dialog-scrollable-with-actions {
+//     max-height: calc(90vh - #{$toolbar-height-device-xlarge * 2});
+//   }
+// }
 
 // Dialogs - actions
 //----------------------------------------------------------------------
 
 .dialog-actions {
-  border-top: none;
+  align-items: center;
+  display: flex;
   height: $toolbar-height-device-small;
+  justify-content: flex-end;
+  min-height: $toolbar-height-device-small;
   padding: 0 $spacing-normal;
-  @include flex-parent();
-  @include flex-align-right();
 }
 
 @media (min-width: $device-medium) {
@@ -277,21 +270,21 @@
 // Dialog - full height
 //----------------------------------------------------------------------
 
-.dialog-full-height .dialog-scrollable {
-  height: calc(100vh - #{$toolbar-height-device-small});
-}
-
-@media (min-width: $device-medium) {
-  .dialog-full-height .dialog-scrollable {
-    height: calc(90vh - #{$toolbar-height-device-medium});
-  }
-}
-
-@media (min-width: $device-large) {
-  .dialog-full-height .dialog-scrollable {
-    height: calc(90vh - #{$toolbar-height-device-large});
-  }
-}
+// .dialog-full-height .dialog-scrollable {
+//   height: calc(100vh - #{$toolbar-height-device-small});
+// }
+//
+// @media (min-width: $device-medium) {
+//   .dialog-full-height .dialog-scrollable {
+//     height: calc(90vh - #{$toolbar-height-device-medium});
+//   }
+// }
+//
+// @media (min-width: $device-large) {
+//   .dialog-full-height .dialog-scrollable {
+//     height: calc(90vh - #{$toolbar-height-device-large});
+//   }
+// }
 
 // Dialog - full width
 //----------------------------------------------------------------------
@@ -306,6 +299,12 @@
   }
 }
 
+// Dialog - full height
+//----------------------------------------------------------------------
+
+.dialog-full-height {
+  height: 100%;
+}
 
 
 // .dialog-full-height {
@@ -330,6 +329,30 @@
 //   }
 // }
 
+// Responsive toolbars/actions
+//----------------------------------------------------------------------
+
+@media (min-width: $device-medium) {
+  .dialog-toolbar,
+  .dialog-actions {
+    height: $toolbar-height-device-medium;
+  }
+}
+
+@media (min-width: $device-large) {
+  .dialog-toolbar,
+  .dialog-actions {
+    height: $toolbar-height-device-large;
+  }
+}
+
+@media (min-width: $device-xlarge) {
+  .dialog-toolbar,
+  .dialog-actions {
+    height: $toolbar-height-device-xlarge;
+  }
+}
+
 // Dialogs - simple
 //----------------------------------------------------------------------
 

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

@@ -72,20 +72,6 @@
   }
 }
 
-@each $color-name, $color in $colors {
-  .tabs-#{$color-name} {
-    .tab {
-      &:hover {
-        border-color: lighten($color, 30%);
-      }
-
-      &:active {
-        background-color: lighten($color, 40%);
-      }
-    }
-  }
-}
-
 // Tabs - bordered
 //----------------------------------------------------------------------
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: dlegr250_material_design
 version: !ruby/object:Gem::Version
-  version: 0.6.05
+  version: 0.6.06
 platform: ruby
 authors:
 - Daniel LeGrand
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2018-01-16 00:00:00.000000000 Z
+date: 2018-04-28 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