materialize-sass 0.95.3.2 → 0.95.3.3

data/app/assets/stylesheets/materialize/components/_grid.scss

@@ -20,8 +20,8 @@
 }
 
 .section {
-  padding-top: 1rem;
-  padding-bottom: 1rem;
+	padding-top: 1rem;
+	padding-bottom: 1rem;
 
   &.no-pad {
     padding: 0;

data/app/assets/stylesheets/materialize/components/_icons-material-design.scss

@@ -1,10 +1,10 @@
 @font-face {
     font-family: "Material-Design-Icons";
-    src:url("#{$icons-font-path}Material-Design-Icons.eot");
-    src:url("#{$icons-font-path}Material-Design-Icons.eot?#iefix") format("embedded-opentype"),
-        url("#{$icons-font-path}Material-Design-Icons.woff") format("woff"),
-        url("#{$icons-font-path}Material-Design-Icons.ttf") format("truetype"),
-        url("#{$icons-font-path}Material-Design-Icons.svg#Material-Design-Icons") format("svg");
+    src:font-url("#{$icons-font-path}Material-Design-Icons.eot?#iefix") format("embedded-opentype"),
+        font-url("#{$icons-font-path}Material-Design-Icons.woff2") format("woff2"),
+        font-url("#{$icons-font-path}Material-Design-Icons.woff") format("woff"),
+        font-url("#{$icons-font-path}Material-Design-Icons.ttf") format("truetype"),
+        font-url("#{$icons-font-path}Material-Design-Icons.svg#Material-Design-Icons") format("svg");
     font-weight: normal;
     font-style: normal;
 }

data/app/assets/stylesheets/materialize/components/_modal.scss

@@ -30,6 +30,7 @@
   }
 
   .modal-footer {
+    @include border-radius(0 0 2px 2px);
     background-color: #eee;
     padding: 4px 6px;
     height: 56px;
@@ -56,6 +57,7 @@
     will-change: opacity;
 }
 
+// Modal with fixed action footer
 .modal.modal-fixed-footer {
   padding: 0;
   height: 70%;
@@ -74,3 +76,14 @@
     bottom: 0;
   }
 }
+
+// Modal Bottom Sheet Style
+.modal.bottom-sheet {
+  top: auto;
+  bottom: -100%;
+  margin: 0;
+  width: 100%;
+  max-height: 45%;
+  @include border-radius(0);
+  will-change: bottom, opacity;
+}

data/app/assets/stylesheets/materialize/components/_navbar.scss

@@ -5,22 +5,25 @@ nav {
   width: 100%;
   height: $navbar-height-mobile;
   line-height: $navbar-height-mobile;
+  overflow: hidden;
+
+  a { color: #fff; }
 
   .nav-wrapper {
     position: relative;
     height: 100%;
+
     i {
       font-size: 2rem;
     }
   }
 
-  a { color: #fff; }
-
   @media #{$large-and-up} {
     a.button-collapse { display: none; }
   }
 
 
+  // Collapse button
   a.button-collapse {
     float: left;
     position: relative;
@@ -29,40 +32,32 @@ nav {
     color: #fff;
 
     i {
+
       font-size: 2.7rem;
       height: $navbar-height-mobile;
       line-height: $navbar-height-mobile;
     }
   }
 
+
+  // Logo
   .brand-logo {
     position: absolute;
     color: #fff;
     display: inline-block;
     font-size: 2.1rem;
     padding: 0;
+
     &.center {
       top: 50%;
       left: 50%;
-      -webkit-transform: translate(-50%, -50%);
-      -moz-transform: translate(-50%, -50%);
-      -ms-transform: translate(-50%, -50%);
-      -o-transform: translate(-50%, -50%);
-      transform: translate(-50%, -50%);
+      @include transform(translate(-50%, -50%));
     }
 
     @media #{$medium-and-down} {
-      // left: 0;
-      // width: 100%;
-      // text-align: center;
-      // z-index: 0;
       top: 50%;
       left: 50%;
-      -webkit-transform: translate(-50%, -50%);
-      -moz-transform: translate(-50%, -50%);
-      -ms-transform: translate(-50%, -50%);
-      -o-transform: translate(-50%, -50%);
-      transform: translate(-50%, -50%);
+      @include transform(translate(-50%, -50%));
     }
 
     &.right {
@@ -71,13 +66,15 @@ nav {
     }
   }
 
+
+  // Navbar Links
   ul {
     margin: 0;
 
     li {
+      @include transition(background-color .3s);
       float: left;
       padding: 0px;
-      @include transition(background-color .3s);
 
       &:hover, &.active {
         background-color: rgba(0,0,0,.1);
@@ -145,10 +142,7 @@ nav {
     height: $navbar-height;
     line-height: $navbar-height;
   }
-  // nav .nav-wrapper i {
-  //   font-size: 2rem;
-  // }
   .navbar-fixed {
     height: $navbar-height;
   }
-}
+}

data/app/assets/stylesheets/materialize/components/_preloader.scss

@@ -62,26 +62,26 @@
   position: absolute;
   width: 100%;
   height: 100%;
-  -ms-filter: "progid:DXImageTransform@mixin Microsoft@mixin Alpha(Opacity=${iefactor})";
-  filter: "alpha(opacity=(${iefactor}))";
-  -moz-opacity: 0;
-  -khtml-opacity: 0;
-  opacity: 0;
+  @include opacity(0);
 }
 
-.spinner-blue, .spinner-blue-only {
+.spinner-blue,
+.spinner-blue-only {
   border-color: #4285f4;
 }
 
-.spinner-red, .spinner-red-only {
+.spinner-red,
+.spinner-red-only {
   border-color: #db4437;
 }
 
-.spinner-yellow, .spinner-yellow-only {
+.spinner-yellow,
+.spinner-yellow-only {
   border-color: #f4b400;
 }
 
-.spinner-green, .spinner-green-only {
+.spinner-green,
+.spinner-green-only {
   border-color: #0f9d58;
 }
 
@@ -98,20 +98,6 @@
  * specific properties properly, treats them as -webkit-animation, and overrides the
  * other animation rules. See https://github.com/Polymer/platform/issues/53.
  */
-.active .spinner-layer.spinner-blue-only,
-.active .spinner-layer.spinner-red-only,
-.active .spinner-layer.spinner-yellow-only,
-.active .spinner-layer.spinner-green-only {
-  /* durations: 4 * ARCTIME */
-  -ms-filter: "progid:DXImageTransform@mixin Microsoft@mixin Alpha(Opacity=${iefactor})";
-  filter: "alpha(opacity=(${iefactor}))";
-  -moz-opacity: 1;
-  -khtml-opacity: 1;
-  opacity: 1;
-  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
-  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
-}
-
 .active .spinner-layer.spinner-blue {
   /* durations: 4 * ARCTIME */
   -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
@@ -136,6 +122,16 @@
   animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
 }
 
+.active .spinner-layer.spinner-blue-only,
+.active .spinner-layer.spinner-red-only,
+.active .spinner-layer.spinner-yellow-only,
+.active .spinner-layer.spinner-green-only {
+  /* durations: 4 * ARCTIME */
+  @include opacity(1);
+  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
+  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
+}
+
 @-webkit-keyframes fill-unfill-rotate {
   12.5% { -webkit-transform: rotate(135deg);  } /* 0.5 * ARCSIZE */
   25%   { -webkit-transform: rotate(270deg);  } /* 1   * ARCSIZE */
@@ -335,4 +331,4 @@
 @keyframes fade-out {
   from { opacity: 1; }
   to { opacity: 0; }
-}
+}

data/app/assets/stylesheets/materialize/components/_roboto.scss

@@ -1,28 +1,38 @@
 @font-face {
     font-family: "Roboto";
-    src: font-url("#{$roboto-font-path}Roboto-Thin.ttf");
+    src: font-url("#{$roboto-font-path}Roboto-Thin.woff2") format("woff2"),
+        font-url("#{$roboto-font-path}Roboto-Thin.woff") format("woff"),
+        font-url("#{$roboto-font-path}Roboto-Thin.ttf") format("truetype");
     font-weight: 200;
 }
 @font-face {
     font-family: "Roboto";
-    src: font-url("#{$roboto-font-path}Roboto-Light.ttf");
+    src: font-url("#{$roboto-font-path}Roboto-Light.woff2") format("woff2"),
+        font-url("#{$roboto-font-path}Roboto-Light.woff") format("woff"),
+        font-url("#{$roboto-font-path}Roboto-Light.ttf") format("truetype");
     font-weight: 300;
 }
 
 @font-face {
     font-family: "Roboto";
-    src: font-url("#{$roboto-font-path}Roboto-Regular.ttf");
+    src: font-url("#{$roboto-font-path}Roboto-Regular.woff2") format("woff2"),
+        font-url("#{$roboto-font-path}Roboto-Regular.woff") format("woff"),
+        font-url("#{$roboto-font-path}Roboto-Regular.ttf") format("truetype");
     font-weight: 400;
 }
 
 @font-face {
     font-family: "Roboto";
-    src: font-url("#{$roboto-font-path}Roboto-Medium.ttf");
+    src: font-url("#{$roboto-font-path}Roboto-Medium.woff2") format("woff2"),
+        font-url("#{$roboto-font-path}Roboto-Medium.woff") format("woff"),
+        font-url("#{$roboto-font-path}Roboto-Medium.ttf") format("truetype");
     font-weight: 500;
 }
 
 @font-face {
     font-family: "Roboto";
-    src: font-url("#{$roboto-font-path}Roboto-Bold.ttf");
+    src: font-url("#{$roboto-font-path}Roboto-Bold.woff2") format("woff2"),
+        font-url("#{$roboto-font-path}Roboto-Bold.woff") format("woff"),
+        font-url("#{$roboto-font-path}Roboto-Bold.ttf") format("truetype");
     font-weight: 700;
 }

data/app/assets/stylesheets/materialize/components/_sideNav.scss

@@ -6,6 +6,7 @@ ul.side-nav {
   margin: 0;
   height: 100%;
   height: calc(100% + 60px);
+  height: -moz-calc(100%); //Temporary Firefox Fix
   padding-bottom: 60px;
   background-color: #FFF;
   z-index: 999;

data/app/assets/stylesheets/materialize/components/_slider.scss

@@ -89,4 +89,4 @@
     }
   }
 
-}
+}

data/app/assets/stylesheets/materialize/components/_tabs.scss

@@ -1,43 +1,43 @@
-.tabs {
-  position: relative;
-  height: 48px;
-  background-color: #FFF;
-  margin: 0 auto;
-  width: 100%;
-  white-space: nowrap;
-
-  li.tab {
-    display: block;
-    float: left;
-    text-align: center;
-    background-color: #fff;
-    line-height: 48px;
-    height: 48px;
-    padding: 0 20px;
-    margin: 0;
-    text-transform: uppercase;
-    letter-spacing: .8px;
-    width: 15%;
-
-    a {
-      color: $tabs-text-color;
-      display: block;
-      width: 100%;
-      height: 100%;
-      @include transition( color .28s ease);
-      &:hover {
-        color: lighten($tabs-text-color, 20%);
-      }
-    }
-  }
-  .indicator {
-    position: absolute;
-    bottom: 0;
-    height: 2px;
-    background-color: $tabs-underline-color;
-    will-change: left, right;
-  }
-}
-
-ul.tabs li.tab { padding: 0; }
-
+.tabs {
+  position: relative;
+  height: 48px;
+  background-color: #FFF;
+  margin: 0 auto;
+  width: 100%;
+  white-space: nowrap;
+
+  li.tab {
+    display: block;
+    float: left;
+    text-align: center;
+    background-color: #fff;
+    line-height: 48px;
+    height: 48px;
+    padding: 0 20px;
+    margin: 0;
+    text-transform: uppercase;
+    letter-spacing: .8px;
+    width: 15%;
+
+    a {
+      color: $tabs-text-color;
+      display: block;
+      width: 100%;
+      height: 100%;
+      @include transition( color .28s ease);
+      &:hover {
+        color: lighten($tabs-text-color, 20%);
+      }
+    }
+  }
+  .indicator {
+    position: absolute;
+    bottom: 0;
+    height: 2px;
+    background-color: $tabs-underline-color;
+    will-change: left, right;
+  }
+}
+
+ul.tabs li.tab { padding: 0; }
+

data/app/assets/stylesheets/materialize/components/_typography.scss

@@ -1,55 +1,55 @@
-a {
-  text-decoration: none;
-}
-
-html{
-  line-height: 1.5;
-
-  @media only screen and (min-width: 0) {
-    font-size: 14px;
-  }
-
-  @media only screen and (min-width: $medium-screen) {
-    font-size: 14.5px;
-  }
-
-  @media only screen and (min-width: $large-screen) {
-    font-size: 15px;
-  }
-
-  font-family: "Roboto", sans-serif;
-  font-weight: normal;
-  color: $off-black;
-}
-h1, h2, h3, h4, h5, h6 {
-  font-weight: 400;
-}
-
-// Header Styles
-h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
-h1 { font-size: $h1-fontsize; line-height: 1.1*$h1-fontsize; margin: ($h1-fontsize / 2) 0 ($h1-fontsize / 2.5) 0;}
-h2 { font-size: $h2-fontsize; line-height: 1.1*$h2-fontsize; margin: ($h2-fontsize / 2) 0 ($h2-fontsize / 2.5) 0;}
-h3 { font-size: $h3-fontsize; line-height: 1.1*$h3-fontsize; margin: ($h3-fontsize / 2) 0 ($h3-fontsize / 2.5) 0;}
-h4 { font-size: $h4-fontsize; line-height: 1.1*$h4-fontsize; margin: ($h4-fontsize / 2) 0 ($h4-fontsize / 2.5) 0;}
-h5 { font-size: $h5-fontsize; line-height: 1.1*$h5-fontsize; margin: ($h5-fontsize / 2) 0 ($h5-fontsize / 2.5) 0;}
-h6 { font-size: $h6-fontsize; line-height: 1.1*$h6-fontsize; margin: ($h6-fontsize / 2) 0 ($h6-fontsize / 2.5) 0;}
-
-// Text Styles
-em { font-style: italic; }
-strong { font-weight: 500; }
-small { font-size: 75%; }
-.light { font-weight: 300; }
-
-.flow-text{
-  font-weight: 300;
-  $i: 0;
-  @while $i <= $intervals {
-    @media only screen and (min-width : 360 + ($i * $interval-size)) {
-      font-size: 1.2rem * (1 + (.02 * $i));
-    }
-    @media only screen and (min-width : 0 + ($i * $interval-size)) {
-      line-height: .8rem * (1 + (.13 * $i));
-    }
-    $i: $i + 1;
-  }
-}
+a {
+  text-decoration: none;
+}
+
+html{
+  line-height: 1.5;
+  
+  @media only screen and (min-width: 0) {
+    font-size: 14px;
+  }
+  
+  @media only screen and (min-width: $medium-screen) {
+    font-size: 14.5px;
+  }
+  
+  @media only screen and (min-width: $large-screen) {
+    font-size: 15px;
+  }
+  
+  font-family: "Roboto", sans-serif;
+  font-weight: normal;
+  color: $off-black;
+}
+h1, h2, h3, h4, h5, h6 {
+	font-weight: 400;
+}
+
+// Header Styles
+h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
+h1 { font-size: $h1-fontsize; line-height: 1.1*$h1-fontsize; margin: ($h1-fontsize / 2) 0 ($h1-fontsize / 2.5) 0;}
+h2 { font-size: $h2-fontsize; line-height: 1.1*$h2-fontsize; margin: ($h2-fontsize / 2) 0 ($h2-fontsize / 2.5) 0;}
+h3 { font-size: $h3-fontsize; line-height: 1.1*$h3-fontsize; margin: ($h3-fontsize / 2) 0 ($h3-fontsize / 2.5) 0;}
+h4 { font-size: $h4-fontsize; line-height: 1.1*$h4-fontsize; margin: ($h4-fontsize / 2) 0 ($h4-fontsize / 2.5) 0;}
+h5 { font-size: $h5-fontsize; line-height: 1.1*$h5-fontsize; margin: ($h5-fontsize / 2) 0 ($h5-fontsize / 2.5) 0;}
+h6 { font-size: $h6-fontsize; line-height: 1.1*$h6-fontsize; margin: ($h6-fontsize / 2) 0 ($h6-fontsize / 2.5) 0;}
+
+// Text Styles
+em { font-style: italic; }
+strong { font-weight: 500; }
+small { font-size: 75%; }
+.light { font-weight: 300; }
+
+.flow-text{
+  font-weight: 300;
+  $i: 0;
+  @while $i <= $intervals {
+    @media only screen and (min-width : 360 + ($i * $interval-size)) {
+      font-size: 1.2rem * (1 + (.02 * $i));
+    }
+    @media only screen and (min-width : 0 + ($i * $interval-size)) {
+      line-height: .8rem * (1 + (.13 * $i));
+    }
+    $i: $i + 1;
+  }
+}