groundworkcss-rails 0.1 → 0.2

data/vendor/assets/javascripts/groundworkcss/coffee/plugins/jquery.responsiveText.coffee

@@ -0,0 +1,32 @@
+###
+ *
+ *  jQuery ResponsiveText by Gary Hepting - https://github.com/ghepting/responsiveText
+ *  
+ *  Open source under the BSD License. 
+ *
+ *  Copyright © 2013 Gary Hepting. All rights reserved.
+ *
+###
+
+(($) ->
+  elems = []
+  $.fn.responsiveText = (options) ->
+    settings =
+      compressor: options.compressor or 10
+      minSize: options.minSize or Number.NEGATIVE_INFINITY
+      maxSize: options.maxSize or Number.POSITIVE_INFINITY
+
+    @each ->
+    	elem = $(this)
+    	elem.attr('data-compression',settings.compressor)
+    	elem.attr('data-min',settings.minSize)
+    	elem.attr('data-max',settings.maxSize)
+    	elem.css "font-size", Math.floor(Math.max(Math.min(elem.width() / (settings.compressor), parseFloat(settings.maxSize)), parseFloat(settings.minSize)))
+    	elems.push elem
+
+  $(window).on "resize", ->
+   	$(elems).each ->
+   		elem = $(this)
+   		elem.css "font-size", Math.floor(Math.max(Math.min(elem.width() / (elem.attr('data-compression')), parseFloat(elem.attr('data-max'))), parseFloat(elem.attr('data-min'))))
+
+) jQuery

data/vendor/assets/javascripts/groundworkcss/coffee/plugins/jquery.tooltip.coffee

@@ -0,0 +1,121 @@
+###
+ *
+ *  jQuery Tooltips by Gary Hepting - https://github.com/ghepting/jquery-tooltips
+ *  
+ *  Open source under the BSD License. 
+ *
+ *  Copyright © 2013 Gary Hepting. All rights reserved.
+ *
+###
+
+(($) ->
+  $.fn.tooltip = (options) ->
+    defaults =
+      topOffset: 0
+      delay: 100                    # delay before showing (ms)
+      speed: 100                    # animation speed (ms)
+
+    options = $.extend(defaults, options)
+
+    tooltip = $('#tooltip')         # tooltip element
+    delayShow = ''                  # delayed open
+    trigger = ''                    # store trigger
+    
+    getElementPosition = (el) ->    # get element position
+      offset = el.offset()
+      win = $(window)
+      top: top = offset.top - win.scrollTop()
+      left: left = offset.left - win.scrollLeft()
+      bottom: bottom = win.height() - top - el.outerHeight()
+      right: right = win.width() - left - el.outerWidth()
+
+    setPosition = (trigger) ->
+      # get trigger element coordinates
+      coords = getElementPosition(trigger)
+      # tooltip dimensions
+      if tooltip.outerWidth() > ($(window).width() - 20)
+        tooltip.css('width',$(window).width() - 20)
+      attrs = {}
+      # adjust max width of tooltip
+      tooltip.css('max-width', 
+        Math.min(
+          ($(window).width()-parseInt($('body').css('padding-left'))-parseInt($('body').css('padding-right'))),
+          parseInt(tooltip.css('max-width'))
+        )
+      )
+      width = tooltip.outerWidth()
+      height = tooltip.outerHeight()
+      # horizontal positioning
+      if coords.left <= coords.right        # default position
+        tooltip.addClass('left')
+        attrs.left = coords.left
+      else                                  # pin from right side
+        tooltip.addClass('right')
+        attrs.right = coords.right
+      # veritcal positioning
+      if (coords.top-options.topOffset) > (height+20) # top positioned tooltip
+        tooltip.addClass('top')
+        attrs.top = (trigger.offset().top - height) - 20
+      else # bottom positioned tooltip
+        tooltip.addClass('bottom')
+        attrs.top = trigger.offset().top + trigger.outerHeight() - 4
+      tooltip.css attrs
+
+    closetooltip = ->
+      tooltip.stop().remove()                # remove tooltip
+      $('[role=tooltip]').removeClass('on')
+
+    showtooltip = (trigger) ->
+      closetooltip()           # close tooltip
+      clearTimeout(delayShow)         # cancel previous timeout
+      delayShow = setTimeout ->
+        if $('#tooltip').length != 1
+          # destroy any lingering tooltips
+          $('#tooltip').remove()
+          # create tooltip DOM element
+          tooltip = $("<div id=\"tooltip\"></div>")
+          # add tooltip element to DOM
+          tooltip.appendTo("body")
+        # set tooltip text
+        tooltip.css("opacity", 0).text(trigger.attr('data-title'))
+        # initialize tooltip
+        setPosition(trigger)
+        trigger.addClass('on')
+        tooltip.animate
+          top: "+=10"
+          opacity: 1
+        , options.speed
+      , options.delay
+
+    @each ->
+      $this = $(this)
+      $this.attr('role','tooltip').attr('data-title',$this.attr('title'))
+      $this.removeAttr "title"        # remove title attribute (disable browser tooltips)
+      
+    
+    # focus behavior
+    $('body').on(
+      'focus', '[role=tooltip]', ->
+        showtooltip($(this))
+    ).on(
+      'blur', '[role=tooltip]', ->
+        clearTimeout(delayShow)
+        closetooltip()
+    ).on(
+      'mouseenter', '[role=tooltip]:not(input,select,textarea)', ->
+        showtooltip($(this))
+    ).on(
+      'mouseleave', '[role=tooltip]:not(input,select,textarea)', ->
+        clearTimeout(delayShow)
+        closetooltip()
+    )
+
+    $(window).on
+      scroll: ->
+        trigger = $('[role=tooltip].on')
+        if trigger.length
+          setPosition(trigger)
+          $('#tooltip').css
+            top: "+=10"
+
+) jQuery

data/vendor/assets/javascripts/groundworkcss/groundwork.js

@@ -2,7 +2,7 @@
 
 /*
  *
- *  Groundwork JS by Gary Hepting - https://github.com/groundworkcss/groundwork
+ *  GroundworkCSS JS by Gary Hepting - https://github.com/groundworkcss/groundwork
  *  
  *  Open source under the BSD License. 
  *
@@ -824,19 +824,21 @@
     })();
     return $(window).resize(function() {
       return $('div.modal.active').each(function() {
-        $(this).removeClass('active').css({
-          top: '50%',
-          left: '50%',
-          'margin-top': ($(this).outerHeight() / -2) + 'px',
-          'margin-left': ($(this).outerWidth() / -2) + 'px'
-        }).addClass('active');
-        if (!$(this).hasClass('iframe')) {
-          $(this).css({
-            height: 'auto'
-          });
-          return $(this).css({
-            height: $(this).outerHeight()
-          });
+        if (!$(this).hasClass('fullscreen')) {
+          $(this).removeClass('active').css({
+            top: '50%',
+            left: '50%',
+            'margin-top': ($(this).outerHeight() / -2) + 'px',
+            'margin-left': ($(this).outerWidth() / -2) + 'px'
+          }).addClass('active');
+          if (!$(this).hasClass('iframe')) {
+            $(this).css({
+              height: 'auto'
+            });
+            return $(this).css({
+              height: $(this).outerHeight()
+            });
+          }
         }
       });
     });

data/vendor/assets/javascripts/groundworkcss/plugins/jquery.modals.js

@@ -162,19 +162,21 @@
     })();
     return $(window).resize(function() {
       return $('div.modal.active').each(function() {
-        $(this).removeClass('active').css({
-          top: '50%',
-          left: '50%',
-          'margin-top': ($(this).outerHeight() / -2) + 'px',
-          'margin-left': ($(this).outerWidth() / -2) + 'px'
-        }).addClass('active');
-        if (!$(this).hasClass('iframe')) {
-          $(this).css({
-            height: 'auto'
-          });
-          return $(this).css({
-            height: $(this).outerHeight()
-          });
+        if (!$(this).hasClass('fullscreen')) {
+          $(this).removeClass('active').css({
+            top: '50%',
+            left: '50%',
+            'margin-top': ($(this).outerHeight() / -2) + 'px',
+            'margin-left': ($(this).outerWidth() / -2) + 'px'
+          }).addClass('active');
+          if (!$(this).hasClass('iframe')) {
+            $(this).css({
+              height: 'auto'
+            });
+            return $(this).css({
+              height: $(this).outerHeight()
+            });
+          }
         }
       });
     });

data/vendor/assets/stylesheets/groundworkcss-scss/_buttons.scss

@@ -1,11 +1,11 @@
 // ===================================
-//         Groundwork Buttons
+//       GroundworkCSS Buttons
 // ===================================
 
 
 
 
-button, .button, a.button, a.button:link, a.button:visited, input[type=submit],  input[type=button], input[type=reset] {
+button, .button, a.button, a.button:visited, input[type=submit],  input[type=button], input[type=reset] {
   display:inline-block;
   word-wrap:break-word;
   padding:0.25em 1em;
@@ -103,7 +103,7 @@ button, .button, a.button, a.button:link, a.button:visited, input[type=submit],
       @include rounded(0 0 $radius $radius);
       li {
         display:block;
-        a, a:link, a:visited {
+        a, a:visited {
           display:block;
           padding:0.5em 1em;
           border:none;
@@ -116,10 +116,10 @@ button, .button, a.button, a.button:link, a.button:visited, input[type=submit],
         &:last-child {
           @include rounded(0 0 $radius $radius);
         }
-      }
-      hr {
-        margin:0;
-        border-color:#ececec;
+        hr {
+          margin:0;
+          border-color:#ececec;
+        }
       }
     }
   }

data/vendor/assets/stylesheets/groundworkcss-scss/_forms.scss

@@ -1,5 +1,5 @@
 // ===================================
-//         Groundwork Forms
+//        GroundworkCSS Forms
 // ===================================
 
 
@@ -140,6 +140,9 @@ ul.radio-list {
   position:relative;
   z-index:1;
   width:100%;
+  overflow:hidden;
+  white-space:nowrap;
+  text-overflow:ellipsis;
   margin:0;
   padding:0.4em;
   font-family:monospace;

data/vendor/assets/stylesheets/groundworkcss-scss/_mixins.scss

@@ -68,7 +68,7 @@
 // vertical gradient
 @mixin gradient($startColor:$white, $endColor:$gray-2) {
   background:$startColor; // fallback
-  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$startColor}', endColorstr='#{$endColor}',GradientType=0 ); // IE 6-8
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}',GradientType=0 ); // IE 6-8
   background:-ms-linear-gradient(top, $startColor 0%, $endColor 100%); // IE 10+
   background:-o-linear-gradient(top, $startColor 0%, $endColor 100%); // Opera
   background:-moz-linear-gradient(top, $startColor 0%, $endColor 100%); // Firefox
@@ -94,7 +94,7 @@
 }
 // filter drop shadow
 @mixin filter-shadow($color:rgba(0,0,0,0.2), $blur:0, $x:0, $y:0) { // color, blur, x, y
-  -ms-filter: drop-shadow($x $y $blur $color); // IE10+
+  -ms-filter: drop-shadow($x $y $blur $color); // IE9+
   -o-filter: drop-shadow($x $y $blur $color); // Opera
   -moz-filter: drop-shadow($x $y $blur $color); // Firefox
   -webkit-filter: drop-shadow($x $y $blur $color); // Webkit (Safari, Chrome, other)
@@ -104,8 +104,8 @@
 // inner box shadow
 @mixin inner-shadow($color, $blur:0, $x:0, $y:0) { // color, blur, x, y
   -ms-box-shadow:inset $x $y $blur $color; // IE10+
-  // -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=#{$blur}, Direction=135, Color='#{$color}')"; // IE8
-  // filter: progid:DXImageTransform.Microsoft.Shadow(Strength=#{$blur}, Direction=135, Color='#{$color}'); // IE7-
+  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=#{$blur}, Direction=135, Color='#{ie-hex-str($color)}')"; // IE8
+  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=#{$blur}, Direction=135, Color='#{ie-hex-str($color)}'); // IE7-
   -o-box-shadow:inset $x $y $blur $color; // Opera
   -moz-box-shadow:inset $x $y $blur $color; // Firefox
   -webkit-box-shadow:inset $x $y $blur $color; // Webkit (Safari, Chrome, other)
@@ -194,4 +194,4 @@
       font-family:#{$fallbackFonts};
     }
   }
-}
+}

data/vendor/assets/stylesheets/groundworkcss-scss/_mobile-reset.scss

@@ -1,5 +1,5 @@
 // ===================================
-//       Groundwork Components
+//       GroundworkCSS Components
 // ===================================
 
 

data/vendor/assets/stylesheets/groundworkcss-scss/_modals.scss

@@ -46,7 +46,7 @@
   z-index:98;
   width:100%;
   height:100%;
-  @include inner-shadow(#000, 200px, 0, 0);
+  @include inner-shadow(#000000, 200px, 0, 0);
   @include gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.9));
 }
 
@@ -77,7 +77,6 @@ div.modal {
     height:100%;
     background:#fff;
     padding:25px;
-    @include rounded($radius);
   }
   .close, .fullscreen {
     position:absolute;
@@ -87,14 +86,16 @@ div.modal {
     right:10px;
     padding:5px;
     cursor:pointer;
-    color:#888;
-    background:#fff;
-    @include rounded($radius);
+    color:#ddd;
+    background:#222;
+    background:rgba(0,0,0,0.8);
+    @include rounded(0 0 0 $radius);
     &:hover, &:focus {
-      color:black;
+      color:#fff;
     }
   }
   .fullscreen {
+    @include rounded(0 0 $radius 0);
     right:auto;
     left:10px;
   }

data/vendor/assets/stylesheets/groundworkcss-scss/_navigation.scss

@@ -14,7 +14,7 @@ nav {
     li {
       display:block;
       position:relative;
-      a, a:link, a:visited {
+      a, a:visited {
         display:block;
         width:100%;
         word-wrap:break-word;
@@ -72,12 +72,12 @@ nav {
         }
       }
       &:first-child {
-        a, a:link, a:visited {
+        a, a:visited {
           @include rounded($radius $radius 0 0);
         }
       }
       &:last-child {
-        a, a:link, a:visited {
+        a, a:visited {
           @include rounded(0 0 $radius $radius);
         }
       }
@@ -90,7 +90,7 @@ nav {
       width:auto;
       z-index:99;
       li {
-        a, a:link, a:visited {
+        a, a:visited {
           @include rounded(0 !important);
           background:lighten($button-color, 5%);
           &:hover, &:active {
@@ -98,12 +98,12 @@ nav {
           }
         }
         &:first-child {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded(0 $radius 0 0 !important);
           }
         }
         &:last-child {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded(0 0 $radius $radius !important);
           }
         }
@@ -112,16 +112,16 @@ nav {
     // horizontal grid navigation
     &.row {
       li {
-        a, a:link, a:visited {
+        a, a:visited {
           @include rounded(0);
         }
         &:first-child {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded($radius 0 0 $radius);
           }
         }
         &:last-child {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded(0 $radius $radius 0);
           }
         }
@@ -134,11 +134,11 @@ nav {
         min-width:100%;
         z-index:99;
         li {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded(0 !important);
           }
           &:last-child {
-            a, a:link, a:visited {
+            a, a:visited {
               @include rounded(0 0 $radius $radius !important);
             }
           }
@@ -146,6 +146,11 @@ nav {
       }
     }
   }
+  &:after {
+    content:'';
+    display:block;
+    clear:both;
+  }
   // horizontal inline navigation
   &.inline {
     width:auto;
@@ -157,16 +162,16 @@ nav {
         display:inline-block;
         white-space-collapse:discard;
         float:none;
-        a, a:link, a:visited {
+        a, a:visited {
 
         }
         &:first-child {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded($radius 0 0 $radius);
           }
         }
         &:last-child {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded(0 $radius $radius 0);
           }
         }
@@ -179,11 +184,11 @@ nav {
           z-index:99;
           li {
             display:block;
-            a, a:link, a:visited {
+            a, a:visited {
               @include rounded(0 !important);
             }
             &:last-child {
-              a, a:link, a:visited {
+              a, a:visited {
                 @include rounded(0 0 $radius $radius !important);
               }
             }
@@ -256,12 +261,12 @@ nav {
           }
         }
         &:first-child {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded($radius);
           }
         }
         &:last-child {
-          a, a:link, a:visited {
+          a, a:visited {
             @include rounded($radius);
           }
         }
@@ -282,3 +287,31 @@ nav {
     }
   }
 }
+ul.breadcrumbs {
+  list-style:none;
+  margin:0;
+  padding:0;
+  font-size:0.8em;
+  li {
+    display:inline-block;
+    padding:0.2em 0;
+    a, a:visited {
+      border:none;
+      color:gray;
+      &:before {
+        content:'>';
+        display:inline-block;
+        margin:0 0.5em;
+        color:gray !important;
+      }
+      &:hover, &:focus {
+        color:$link-color;
+      }
+    }
+    &:first-child a {
+      &:before {
+        display:none;
+      }
+    }
+  }
+}