active_frontend 16.1.7 → 16.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: ab420a9e6b904ee93686a276f84a3479cc9c0be7b04f9aa17c731199c6301140
-  data.tar.gz: 0e56e89daf58a7a5a4e611f8aa0ed38d775269a9c3ae0dea6a2b07c6c6f3ff80
+  metadata.gz: 18f082396a23bef9efc98e2d1e003f5ca6066a2b3b7659ac686c06a2c829493a
+  data.tar.gz: dc005e66664f06274a73dd89c3ef7decba68b39333b5c3734c90a3089b74f901
 SHA512:
-  metadata.gz: 998fb098d3d7f2956dc0b720958ebacaa46b22c6f9ae61e8b0be3a1ef9eb89951221916ca76fb7d7dd8a104a982e32544f1762080399d72e9ef11af22fe8b205
-  data.tar.gz: 0ce326f5e72c804832ca650a2e9e452082260412f88e008ae4360f87f14bb120af415e8ffac94d6d0864296cd97a52b7985edfe05cc4ff90af6f00edac101284
+  metadata.gz: bb4ee4734bf127add30163f26762eaf55e7c32b61f1d63f44e633f9e4bdc9c10603ee5f770b9254c2e0fbc0b29da59f80bc2fb2230cd975df6101c833f4c0418
+  data.tar.gz: 0b7c3c5da8760d8fe7633671d3f96cb6d1c836a9005e72f7433b74f672bb3d6ace99be8acf3427d9d38d5a90d1e709a8942522b65672167e9a117d860fc2527a

data/lib/active_frontend/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module ActiveFrontend
-  VERSION ||= '16.1.7'
+  VERSION ||= '16.2.0'
 end

data/vendor/assets/stylesheets/_utility.scss

@@ -26,6 +26,16 @@
 
 // Helper Funtions
 // ==================================================
+@function breakpoint-min-width($size) {
+  $widths: map-get($grid-container-widths, $size);
+
+  @return nth($widths, 2);
+}
+@function breakpoint-max-width($size) {
+  $width: breakpoint-min-width($size);
+
+  @return $width - 1px;
+}
 @function text-color-on($color) {
   @if index($colors-black-text, $color) {
     @return color(slate);

data/vendor/assets/stylesheets/_variable.scss

@@ -206,7 +206,7 @@ $grid-container-widths: (
   l: (calc(100% - 260px), 1360px),
   m: (calc(100% - 140px), 1180px),
   b: (calc(100% - 60px), 960px),
-  s: (calc(100% - 20px), 760px),
+  s: (calc(100% - 20px), 813px),
   null: (100%, null)
 );
 $grid-row-margins: (

data/vendor/assets/stylesheets/blocks/_button.scss

@@ -318,7 +318,7 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .btn-block-responsive {
     display: block;
     min-width: 100%;

data/vendor/assets/stylesheets/blocks/_form.scss

@@ -67,11 +67,18 @@ textarea,
   &:focus,
   &.focus {
     border-color: color(blue);
+    box-shadow: inset 0 0 4px color(blue);
 
     &:invalid,
-    &.invalid { border-color: color(red); }
+    &.invalid {
+      border-color: color(red);
+      box-shadow: inset 0 0 4px color(red);
+    }
 
-    &.without-border { border-color: color(transparent); }
+    &.without-border {
+      border-color: color(transparent);
+      box-shadow: none;
+    }
   }
 
   &.dark {
@@ -448,6 +455,7 @@ textarea {
   input:focus {
     background: color(transparent);
     border: 0;
+    box-shadow: none;
     display: inline-block;
     outline: none;
     margin: 0;
@@ -569,6 +577,8 @@ textarea {
     display: table-cell;
     margin: 0;
     vertical-align: middle;
+
+    + .form-addon { border-left: 0; }
   }
 
   .form-addon {
@@ -581,6 +591,8 @@ textarea {
     white-space: nowrap;
     width: 1%;
 
+    &:not(:last-child) { border-right: 0; }
+
     i {
       display: inline-block;
       margin-top: -2px;
@@ -614,7 +626,6 @@ textarea {
     }
   }
 
-  *:not(:first-child) { border-left: 0; }
   *:first-child {
     border-bottom-left-radius: border-radius(b);
     border-top-left-radius: border-radius(b);

data/vendor/assets/stylesheets/blocks/_multimedia.scss

@@ -63,6 +63,6 @@ svg:not(:root) {
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .img-responsive { max-width: 60%; }
 }

data/vendor/assets/stylesheets/blocks/_table.scss

@@ -195,7 +195,19 @@ thead {
 // ==================================================
 @each $name, $color in $colors {
   .table-row-color-#{$name} {
-    > td { color: color($name); }
+    td {
+      background: tint($name, 87.5%);
+      color: color($name);
+    }
+  }
+}
+.table-hover {
+  tbody {
+    @each $name, $color in $colors {
+      tr.table-row-color-#{$name}:hover {
+        td { background: tint($name, 82.5%); }
+      }
+    }
   }
 }
 
@@ -210,7 +222,7 @@ thead {
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 960px) {
+@media only screen and (max-width: breakpoint-max-width(b)) {
   .table-responsive {
     @include overflow-scrolling(touch);
     background: color(transparent);

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

@@ -85,7 +85,7 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .ad {
     &.responsive {
       height: 60px;

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

@@ -250,7 +250,7 @@ table.calendar-border-separate {
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .calendar-header td { display: block; }
   .calendar-header-left,
   .calendar-header-center,

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

@@ -125,7 +125,7 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .carousel-control {
     .icon-prev,
     .icon-next {

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

@@ -102,7 +102,7 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 960px) {
+@media only screen and (max-width: breakpoint-max-width(b)) {
   .cohort-container {
     .table-responsive {
       border-radius: 0;

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

@@ -82,7 +82,7 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (min-width: 960px) and (max-width: 1365px) {
+@media only screen and (min-width: breakpoint-min-width(b)) and (max-width: breakpoint-max-width(l)) {
   @each $name, $widths in $grid-container-widths {
     $width: nth($widths, 2);
 
@@ -94,7 +94,7 @@
   .hidden-desktop { display: inherit; }
   .hidden-laptop { display: none; }
 }
-@media only screen and (min-width: 813px) and (max-width: 959px) {
+@media only screen and (min-width: breakpoint-min-width(s)) and (max-width: breakpoint-max-width(b)) {
   @each $name, $widths in $grid-container-widths {
     $width: nth($widths, 2);
 
@@ -106,7 +106,7 @@
   .hidden-desktop { display: inherit; }
   .hidden-tablet { display: none; }
 }
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   @each $name, $margin in $grid-row-margins {
     .#{dasherize(row-responsive, $name)} { margin-bottom: $margin; }
   }

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

@@ -126,10 +126,10 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (min-width: 813px) and (max-width: 959px) {
+@media only screen and (min-width: breakpoint-min-width(s)) and (max-width: breakpoint-max-width(b)) {
   .header-search { width: 220px; }
 }
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .header {
     height: 54px;
     padding: 12px 0;

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

@@ -41,7 +41,7 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (min-width: 960px) and (max-width: 1365px) {
+@media only screen and (min-width: breakpoint-min-width(b)) and (max-width: breakpoint-max-width(l)) {
   .layout-sidebar {
     width: 260px;
 
@@ -49,7 +49,7 @@
     &.fixed + .layout-body { width: 100%; }
   }
 }
-@media only screen and (min-width: 813px) and (max-width: 959px) {
+@media only screen and (min-width: breakpoint-min-width(s)) and (max-width: breakpoint-max-width(b)) {
   .layout-sidebar {
     width: 220px;
 
@@ -57,7 +57,7 @@
     &.fixed + .layout-body { width: 100%; }
   }
 }
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .layout-body,
   .layout-sidebar {
     height: initial;

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

@@ -137,11 +137,11 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .modal { width: calc(100% - 20px); }
   .modal-body { max-height: 280px; }
 }
-@media only screen and (min-width: 480px) and (max-width: 812px) {
+@media only screen and (min-width: (breakpoint-min-width(b) / 2)) and (max-width: breakpoint-max-width(s)) {
   .modal { width: calc(100% - 120px); }
   .modal-body { max-height: 140px; }
 }

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

@@ -56,6 +56,6 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (min-width: 813px) {
+@media only screen and (min-width: breakpoint-min-width(s)) {
   .navbar { display: none; }
 }

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

@@ -56,7 +56,7 @@
 
 // Media Queries
 // ==================================================
-@media only screen and (max-width: 812px) {
+@media only screen and (max-width: breakpoint-max-width(s)) {
   .subheader {
     &.absolute,
     &.fixed {

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

@@ -2,6 +2,7 @@
 // ==================================================
 // Typeahead
 
+// scss-lint:disable NestingDepth
 // scss-lint:disable SelectorDepth
 
 // Typeahead
@@ -9,11 +10,20 @@
 .typeahead {
   margin-top: 10px;
   z-index: 1061;
+  font-weight: text-weight(semilight);
 
-  > li > a b,
+  > li > a b {
+    color: color(secondary);
+    font-weight: inherit;
+    text-decoration: underline;
+  }
   > li.active > a {
     color: color(primary);
-    font-weight: text-weight(normal);
+
+    &:hover,
+    &:active,
+    &:focus {
+      > b { color: inherit; }
+    }
   }
-  > li > a b { text-decoration: underline; }
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: active_frontend
 version: !ruby/object:Gem::Version
-  version: 16.1.7
+  version: 16.2.0
 platform: ruby
 authors:
 - Juan Gomez
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2018-05-26 00:00:00.000000000 Z
+date: 2018-05-30 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -824,7 +824,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.7.6
+rubygems_version: 2.7.7
 signing_key: 
 specification_version: 4
 summary: ActiveFrontend Responsive Web Framework