forever_style_guide 3.0.32 → 3.0.33

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: a8c8643a45e7b2be83063f9813171d77952e3560
-  data.tar.gz: e70d7578cd21e5ecf76712de4495bac50f6e26c0
+  metadata.gz: 5c7b76cfdc38597a25f79292a357027baaa2121c
+  data.tar.gz: 1c7fe4bffadd2846ad134e449df36804e282744a
 SHA512:
-  metadata.gz: f4137b73e41ba6be48f3ef1d2cf6f15f6cba0d771eb9f71244dcf4134b35e06f61662a9a441121285920d4182f27543c9c154f4d5196279a630047d6a71598dc
-  data.tar.gz: df122cc4dece11261a2098eee765a8c27d2a7d9416075af3c29e03c52167b4626d0cf9946fa224a054e456f5ee612fe556534e803a47349dbd5d8dcf3137e0ee
+  metadata.gz: '0399857bf0410aaed29297d8260b2ca78b7b252bc6faa11e932e002e4875716fdfc17fbdae01bccf57e99273657dfd2ebe7f9234445ca62404bf7c34197ab6bb'
+  data.tar.gz: '0410934a5313a4c94e5c1663c0925ec5b77c3627b2da285f3b71832bc63fbff7841f522f79438102f308659c1e2110de276c84ee50c13a6b6c95f6aff00ea40a'

data/app/assets/stylesheets/forever_style_guide/modules/_all.scss

@@ -24,6 +24,7 @@
 @import "popover";
 @import "progress";
 @import "promo_banner";
+@import "responsive_utilities";
 @import "select";
 @import "shame";
 @import "hero_simple";

data/app/assets/stylesheets/forever_style_guide/modules/_nav-dropdowns-account.scss

@@ -7,7 +7,7 @@
   .progress {
     margin-bottom: 10px;
   }
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     @include nav-border(bottom);
   }
   @media (min-width: $grid-float-breakpoint) {
@@ -28,7 +28,7 @@
   margin-bottom: 10px;
   @include nav-border(bottom);
 
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     border-color: color('gray-600');
   }
 }
@@ -45,14 +45,14 @@
   border: 0;
   box-shadow: none;
 
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     height: 40px; // avatar-xs
     width: 40px;
     margin-top: $padding-small-vertical;
   }
 }
 .dropdown-menu-account-storage {
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     font-size: $font-size-default;
   }
 }

data/app/assets/stylesheets/forever_style_guide/modules/_nav-dropdowns-ambassador.scss

@@ -4,7 +4,7 @@ $your-ambassador-intro-text-width: 110px;
   .dropdown-toggle {
     padding: 0 10px;
 
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       padding: 0 0 0 $offcanvas-padding !important; // overriding .navbar .nav.navbar-nav > li > a
     }
   }
@@ -13,30 +13,30 @@ $your-ambassador-intro-text-width: 110px;
     margin-left: 10px;
     top: -10px;
 
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       top: $offcanvas-padding;
     }
   }
   &:last-child {
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       @include nav-border(bottom);
       border-color: color('gray-600');
     }
   }
   .dropdown-ambassador-container {
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       width: $offcanvas-width - $offcanvas-padding;
       padding-left: 15px;
     }
   }
   .dropdown-menu-nav {
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       box-shadow: none;
     }
   }
   .btn.btn-ambassador.btn-lg {
     //preferring redunant button styling to redundant mobile markup for this one instance
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       display: block;
       height: $btn-size;
       padding: $padding-default-vertical $btn-padding-default-horizontal;
@@ -58,7 +58,10 @@ $your-ambassador-intro-text-width: 110px;
 }
 .dropdown-ambassador-edit_btn {
   display: block;
-  margin-top: -30px;
+
+  @media (min-width: $grid-float-breakpoint) {
+    margin-top: -30px;
+  }
 }
 .dropdown-ambassador-basic_info {
   overflow: hidden;

data/app/assets/stylesheets/forever_style_guide/modules/_nav-dropdowns.scss

@@ -12,7 +12,7 @@ $nav-icon-width: 60px;
   @media (min-width: $grid-float-breakpoint) {
     box-shadow: inset 0 3px 0 0 $color;
   }
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     box-shadow: inset 3px 0 0 0 $color;
   }
 }
@@ -43,14 +43,14 @@ $nav-icon-width: 60px;
     }
   }
   .dropdown-menu-nav {
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       padding-bottom: 20px;
     }
   }
 }
 
 // Override bootstrap default to show dropdowns at custom breakpoint
-@media (max-width: $grid-float-breakpoint) {
+@media (max-width: $grid-float-breakpoint-max) {
   .navbar-nav .open .dropdown-menu {
     position: static;
   }
@@ -74,7 +74,7 @@ $nav-icon-width: 60px;
   color: color('gray-400');
   background-color: $nav-bg-color;
 
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     &.dropdown-toggle-my_forever {
       @include mobile-active-dropdown-bg($color-primary);
     }
@@ -101,7 +101,7 @@ $nav-icon-width: 60px;
   border-radius: 0;
   @extend %card-shadow;
 
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     padding-left: 5px;
   }
 
@@ -113,7 +113,7 @@ $nav-icon-width: 60px;
 }
 
 .dropdown-menu-nav-extra_column {
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     margin-top: -10px; // compensate for l-padded-thin
     padding-top: 0;
   }
@@ -138,7 +138,7 @@ a.dropdown-menu-nav-link {
 }
 .dropdown-menu-account-item {
   .dropdown-menu-nav-link {
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       margin-top: $padding-small-vertical;
     }
   }
@@ -151,7 +151,7 @@ a.dropdown-menu-nav-link {
   font-size: $font-size-200;
 }
 .dropdown-menu-nav-bullets {
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     margin-left: 10px;
   }
   a.dropdown-menu-nav-link {
@@ -161,7 +161,7 @@ a.dropdown-menu-nav-link {
 .dropdown-menu-nav-description {
   @include dropdown-content-style;
 
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     font-size: $font-size-300;
   }
 }

data/app/assets/stylesheets/forever_style_guide/modules/_nav-icons.scss

@@ -30,7 +30,7 @@ $cart-count-width: 20px;
 }
 
 // Style offcanvas account icons consistent w/ product dropdowns
-@media (max-width: $grid-float-breakpoint) {
+@media (max-width: $grid-float-breakpoint-max) {
   .navbar-account_item .nav-icon-stack {
     width: auto;
     padding: 15px !important; // override .navbar .nav.navbar-nav > li > a
@@ -55,7 +55,7 @@ $cart-count-width: 20px;
     font-size: 9px;
     @include transition(transform 0.2s ease-in-out);
 
-    @media(max-width: $grid-float-breakpoint) {
+    @media(max-width: $grid-float-breakpoint-max) {
       @include chevron-style;
     }
   }
@@ -102,7 +102,7 @@ a.cart-icon {
   }
 }
 a.cart-icon {
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     position: absolute;
     right: 0;
     @include nav-border(left);

data/app/assets/stylesheets/forever_style_guide/modules/_nav-offcanvas.scss

@@ -1,9 +1,8 @@
 // https://github.com/iamphill/Bootstrap-Offcanvas
 $offcanvas-width:                 270px !default;
 $offcanvas-animation-time:        .15s !default;
-$offcanvas-media:                 $grid-float-breakpoint!default;
 
-@media (max-width: $offcanvas-media) {
+@media (max-width: $grid-float-breakpoint-max) {
   .offcanvas-stop-scrolling {
     height: 100%;
     overflow: hidden;
@@ -47,7 +46,7 @@ $offcanvas-media:                 $grid-float-breakpoint!default;
   @media (min-width: $grid-float-breakpoint) {
     display: none !important;
   }
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     display: block !important;
   }
 }
@@ -55,7 +54,7 @@ $offcanvas-media:                 $grid-float-breakpoint!default;
   @media (min-width: $grid-float-breakpoint) {
     display: block !important;
   }
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     display: none !important;
   }
 }

data/app/assets/stylesheets/forever_style_guide/modules/_nav.scss

@@ -10,7 +10,7 @@ $nav-bg-color: color('gray-700');
 
 // Basic styles - A lot of overriding Bootstrap defaults
 .navbar-toggle {
-  @media (max-width: $grid-float-breakpoint) {
+  @media (max-width: $grid-float-breakpoint-max) {
     display: block;
   }
 }
@@ -49,7 +49,7 @@ $nav-bg-color: color('gray-700');
     margin-top: 0;
     margin-bottom: 0;
 
-    @media (max-width: $grid-float-breakpoint) {
+    @media (max-width: $grid-float-breakpoint-max) {
       margin-left: 0;
       margin-right: 0;
     }
@@ -59,7 +59,7 @@ $nav-bg-color: color('gray-700');
       color: color('gray-400');
       font-size: $font-size-500;
 
-      @media (max-width: $grid-float-breakpoint) {
+      @media (max-width: $grid-float-breakpoint-max) {
         padding-top: $offcanvas-padding;
         @include nav-border(top);
         border-color: color('gray-600')
@@ -88,7 +88,7 @@ $nav-bg-color: color('gray-700');
 
       &:hover,
       &:focus {
-        @media (max-width: $grid-float-breakpoint) {
+        @media (max-width: $grid-float-breakpoint-max) {
           color: color('gray-400');
         }
       }

data/app/assets/stylesheets/forever_style_guide/modules/_responsive_utilities.scss

@@ -0,0 +1,53 @@
+// TODO - this could be more dynamic w/ an @each, but I was having trouble w/ the syntax
+
+.pull-right-xs {
+  @media (max-width: $screen-xs-max) {
+    float: right !important;
+  }
+}
+.pull-right-sm {
+  @media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
+    float: right !important;
+  }
+}
+.pull-right-md {
+  @media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
+    float: right !important;
+  }
+}
+.pull-right-lg {
+  @media (min-width: $screen-lg-min) {
+    float: right !important;
+  }
+}
+.pull-right-grid-float-breakpoint {
+  @media (min-width: $grid-float-breakpoint) {
+    float: right !important;
+  }
+}
+
+.pull-left-xs {
+  @media (max-width: $screen-xs-max) {
+    float: left !important;
+  }
+}
+.pull-left-sm {
+  @media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
+    float: left !important;
+  }
+}
+.pull-left-md {
+  @media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
+    float: left !important;
+  }
+}
+.pull-left-lg {
+  @media (min-width: $screen-lg-min) {
+    float: left !important;
+  }
+}
+.pull-left-grid-float-breakpoint {
+  @media (min-width: $grid-float-breakpoint) {
+    float: left !important;
+  }
+}

data/app/assets/stylesheets/forever_style_guide/modules/_shame.scss

@@ -1,5 +1,5 @@
 // overrides bootstraps collapse breakpoint
-@media (max-width: $grid-float-breakpoint) {
+@media (max-width: $grid-float-breakpoint-max) {
   .navbar-header {
     float: none;
   }

data/app/helpers/forever_style_guide/application_helper.rb

@@ -32,6 +32,16 @@ module ForeverStyleGuide
       url = URI.decode(url.to_s)
     end
 
+    def absolute_url(url_str)
+      return  unless url_str.present?
+
+      url_str = url_str.strip
+
+      return url_str if url_str =~ /https?\:/i
+
+      "http://" + url_str
+    end
+
     def has_item_in_cart?
       defined?(current_order) && current_order.product_count > 0
     end
@@ -120,6 +130,10 @@ module ForeverStyleGuide
       web_app_url('/#/settings')
     end
 
+    def ambassador_settings_url
+      www_url('/settings/my_ambassador')
+    end
+
     # Combined Store/WWW Paths - now all available at www.forever.com
     def login_url
       www_url('/sign_in')

data/app/views/forever_style_guide/sections/components/navigation/_nav_ambassador_dropdown.erb

@@ -20,7 +20,7 @@
 
           <% if has_ambassador? %>
 
-            <%= link_to 'change', find_ambassador_url, title: 'Change Your Forever Ambassador', class: 'pull-right dropdown-ambassador-edit_btn' %>
+            <%= link_to 'Manage Ambassador', ambassador_settings_url, title: 'Manage Your Forever Ambassador', class: 'pull-right-grid-float-breakpoint dropdown-ambassador-edit_btn' %>
             <div class='dropdown-menu-account-divider'></div>
 
             <div>
@@ -56,33 +56,33 @@
                 </div>
               <% end %>
 
-              <% if current_ambassador.website %>
+              <% if current_ambassador.website.present? %>
                 <div class="col-grid-float-6">
-                  <%= link_to '//' + current_ambassador.website, title: current_ambassador.website, class: 'btn btn-default btn-link btn-action dropdown-ambassador-contact_btn', target: '_blank' do %>
+                  <%= link_to absolute_url(current_ambassador.website), title: absolute_url(current_ambassador.website), class: 'btn btn-default btn-link btn-action dropdown-ambassador-contact_btn', target: '_blank' do %>
                     <i class="fa fa-fw fa-link btn-action-icon"></i><span class="btn-action-label">My Website</span>
                   <% end %>
                 </div>
               <% end %>
 
-              <% if current_ambassador.facebook_url %>
+              <% if current_ambassador.facebook_url.present? %>
                 <div class="col-grid-float-6">
-                  <%= link_to '//' + current_ambassador.facebook_url, title: current_ambassador.facebook_url, class: 'btn btn-default btn-link btn-action dropdown-ambassador-contact_btn', target: '_blank' do %>
+                  <%= link_to absolute_url(current_ambassador.facebook_url), title: absolute_url(current_ambassador.facebook_url), class: 'btn btn-default btn-link btn-action dropdown-ambassador-contact_btn', target: '_blank' do %>
                     <i class="fa fa-fw fa-facebook btn-action-icon"></i><span class="btn-action-label">My Facebook Page</span>
                   <% end %>
                 </div>
               <% end %>
 
-              <% if current_ambassador.twitter_handle %>
+              <% if current_ambassador.twitter_handle.present? %>
                 <div class="col-grid-float-6">
-                  <%= link_to '//' + current_ambassador.twitter_handle, title: current_ambassador.twitter_handle, class: 'btn btn-default btn-link btn-action dropdown-ambassador-contact_btn', target: '_blank' do %>
+                  <%= link_to absolute_url(current_ambassador.twitter_handle), title: absolute_url(current_ambassador.twitter_handle), class: 'btn btn-default btn-link btn-action dropdown-ambassador-contact_btn', target: '_blank' do %>
                     <i class="fa fa-fw fa-twitter btn-action-icon"></i><span class="btn-action-label">Follow me on Twitter</span>
                   <% end %>
                 </div>
               <% end %>
 
-              <% if current_ambassador.instagram_url %>
+              <% if current_ambassador.instagram_url.present? %>
                 <div class="col-grid-float-6">
-                  <%= link_to '//' + current_ambassador.instagram_url, title: current_ambassador.instagram_url, class: 'btn btn-default btn-link btn-action dropdown-ambassador-contact_btn', target: '_blank' do %>
+                  <%= link_to absolute_url(current_ambassador.instagram_url), title: absolute_url(current_ambassador.instagram_url), class: 'btn btn-default btn-link btn-action dropdown-ambassador-contact_btn', target: '_blank' do %>
                     <i class="fa fa-fw fa-instagram btn-action-icon"></i><span class="btn-action-label">Follow me on Instagram</span>
                   <% end %>
                 </div>

data/lib/forever_style_guide/version.rb

@@ -1,3 +1,3 @@
 module ForeverStyleGuide
-  VERSION = "3.0.32"
+  VERSION = "3.0.33"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: forever_style_guide
 version: !ruby/object:Gem::Version
-  version: 3.0.32
+  version: 3.0.33
 platform: ruby
 authors:
 - Nicholas McClay
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2016-10-31 00:00:00.000000000 Z
+date: 2016-11-10 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -266,6 +266,7 @@ files:
 - app/assets/stylesheets/forever_style_guide/modules/_popover.scss
 - app/assets/stylesheets/forever_style_guide/modules/_progress.scss
 - app/assets/stylesheets/forever_style_guide/modules/_promo_banner.scss
+- app/assets/stylesheets/forever_style_guide/modules/_responsive_utilities.scss
 - app/assets/stylesheets/forever_style_guide/modules/_select.scss
 - app/assets/stylesheets/forever_style_guide/modules/_shame.scss
 - app/assets/stylesheets/forever_style_guide/modules/_signin.scss
@@ -314,7 +315,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.2.2
+rubygems_version: 2.5.1
 signing_key: 
 specification_version: 4
 summary: A live style guide and component API for the Forever brand