groundworkcss 0.2.2

data/vendor/assets/stylesheets/groundworkcss/type/_typography.scss

@@ -0,0 +1,360 @@
+// =============================================
+//                Typography
+//          Last Updated:2013-5-21
+// =============================================
+
+
+
+
+/* vertical rhythm */
+@include establish-baseline;
+
+%document {
+  font-family:$font-family;
+  color:$font-color;
+}
+
+@mixin _selection {
+  background:$selection-color;
+  color:$selection-text;
+  text-shadow:none;
+}
+
+%links {
+  color:$link-color;
+  @include transition(color 0.25s);
+  &:hover, &:focus {
+    color:$link-active;
+    text-decoration:underline;
+  }
+}
+
+%heading {
+  margin-bottom:15px;
+}
+
+%h1 {
+  @extend %heading;
+  font-weight:200;
+  @include adjust-font-size-to($base-font-size * 2.3333333333);
+}
+
+%h2 {
+  @extend %heading;
+  font-weight:200;
+  @include adjust-font-size-to($base-font-size * 2);
+}
+
+%h3 {
+  @extend %heading;
+  font-weight:500;
+  @include adjust-font-size-to($base-font-size * 1.5);
+}
+
+%h4 {
+  @extend %heading;
+  font-weight:500;
+  @include adjust-font-size-to($base-font-size * 1.3333333333);
+}
+
+%h5 {
+  @extend %heading;
+  font-weight:900;
+  @include adjust-font-size-to($base-font-size * 1.1666666667);
+}
+
+%h6 {
+  @extend %heading;
+  font-weight:900;
+  @include adjust-font-size-to($base-font-size * 1.1666666667);
+  text-transform:uppercase;
+}
+
+%p, %ul, %ol, %dl {
+  margin-bottom:10px;
+  font-weight:normal;
+}
+
+%list {
+  margin-left:20px;
+  %list-item {
+    display:list-item;
+  }
+}
+
+%dl {
+  %dt {
+    font-weight:bold;
+  }
+  %dd {
+    padding-left:1em;
+    margin-bottom:$gutter;
+  }
+}
+
+%unstyled {
+  list-style:none;
+}
+
+%ul-list {
+  @extend %unstyled;
+  margin-left:0;
+  %list-item {
+    &:before {
+      content:'\f00c';
+      display:inline-block;
+      width:1.1em;
+      margin-right:0.25em;
+      font-family:FontAwesome;
+      font-weight:normal;
+      font-style:normal;
+      @include adjust-font-size-to($base-font-size * 1.1);
+      text-decoration:inherit;
+      -webkit-font-smoothing:antialiased;
+      vertical-align:baseline;
+      background-image:none;
+      background-position:0% 0%;
+      background-repeat:repeat;
+      margin-top:0;
+    }
+  }
+}
+
+%ol-list {
+  @extend %unstyled;
+  counter-reset:li;
+  margin-left:1.5em;
+  @include adjust-font-size-to($base-font-size);
+  line-height:1.6;
+  %list-item {
+    position:relative;
+    padding:2px 6px 0;
+    &:before {
+      content:counter(li);
+      counter-increment:li;
+      position:absolute;
+      top:2px;
+      left:-2em;
+      width:2em;
+      text-align:center;
+      padding:2px;
+      font-size:0.8em;
+      line-height:1.5;
+      color:$background-color;
+      background:$font-color;
+      font-weight:bold;
+      @include rounded(4px);
+    }
+  }
+}
+
+%blockquote {
+  padding:1.3em 4em 1em;
+  color:$font-color;
+  @include adjust-font-size-to($base-font-size, 1.15);
+  font-weight:bold;
+  position:relative;
+  z-index:0;
+  background:darken($background-color, 10%);
+  @include border-radius($radius);
+  &:before {
+    content:'\201C';
+    color:darken($background-color, 20%);
+    font-size:6em;
+    display:block;
+    position:absolute;
+    top:0.4em;
+    left:0.1em;
+    z-index:-1;
+  }
+  &:after {
+    content:'\201D';
+    color:darken($background-color, 20%);
+    font-size:6em;
+    display:block;
+    position:absolute;
+    top:0.4em;
+    right:0.1em;
+    z-index:-1;
+  }
+}
+
+%cite {
+  display:block;
+  position:relative;
+  left:-1em;
+  margin-top:0.25em;
+  @include adjust-font-size-to($base-font-size, 0.95);
+  font-weight:normal;
+  font-style:normal;
+  color:lighten($font-color, 15%);
+  &:before {
+    content:'\2014';
+  }
+}
+
+%abbr {
+  border-bottom:1px dotted;
+  cursor:help;
+}
+
+%small              { @extend %small; }
+%big, %large        { @extend %large; }
+%em, %italic        { font-style:italic; }
+%b, %bold, %strong  { font-weight:900; }
+%sup                { @extend %small; }
+%sub                { @extend %small; }
+%monospace          { font-family:monospace; }
+%del, %strike       { text-decoration: line-through; }
+
+@for $i from 1 through length($modifier-name) {
+  %#{nth($modifier-name, $i)} {
+    color:#{nth($modifier-text, $i)};
+  }
+}
+
+%code {
+  @extend %monospace;
+	white-space:pre-wrap;
+	word-wrap:break-word;
+	min-height:1em;
+	display:inline-block;
+	background:lighten(gray, 30%);
+	border:none;
+	padding:0 0.3em;
+	margin:0 0.2em;
+	font-weight:normal;
+	line-height:inherit;
+}
+
+%pre {
+  @extend %monospace;
+	$border:2.6em;
+	color:darken(white, 5%);
+	background:#050505;
+  @include adjust-font-size-to($base-font-size, 1);
+	padding:0.5em;
+	display:block;
+	border-left:#{$border} solid lighten(#050505, 20%);
+	counter-reset:linenumber;
+	%code {
+    display:block;
+		background:inherit;
+		margin:0;
+		padding:0;
+		&:before {
+			text-align:right;
+			color:lighten(gray, 10%);
+			counter-increment:linenumber;
+			content:counter(linenumber) ".";
+			position:absolute;
+			left:0.65em;
+			width:#{$border};
+		}
+	}
+}
+
+%info             { color:$info-color; }
+%alert            { color:$alert-color; }
+%warning          { color:$warning-color; }
+%error, %invalid  { color:$error-color; }
+%success, %valid  { color:$success-color; }
+
+// responsive headings
+.js {
+  .responsive:not(table) {
+    @extend %truncate;
+    @include transition(font 0.25s);
+  }
+}
+
+@if $tags {
+  body {
+    @extend %document;
+  }
+  ::-moz-selection {
+    @include _selection;
+  }
+  ::selection {
+    @include _selection;
+  }
+  a, a:visited {
+    @extend %links;
+  }
+  ul, ol {
+    @extend %list;
+    li {
+      @extend %list-item;
+    }
+  }
+  dl {
+    @extend %dl;
+    dt {
+      @extend %dt;
+    }
+    dd {
+      @extend %dd;
+    }
+  }
+  abbr[title], dfn[title],
+  abbr[data-title], dfn[data-title] {
+    @extend %abbr;
+  }
+  $elements: h1 h2 h3 h4 h5 h6 p ul ol dl blockquote cite small big em b strong sup sub del strike code pre;
+  @for $i from 1 through length($elements) {
+		@if not index($tag-elements, nth($elements, $i)) == false {
+			#{nth($elements, $i)} {
+				@extend %#{nth($elements, $i)};
+			}
+		}
+  }
+}
+@if $classes {
+  $names: h1 h2 h3 h4 h5 h6 p blockquote cite small big large em italic b bold strong sup sub del strike code pre info alert warning error invalid success valid unstyled;
+  @for $i from 1 through length($names) {
+    .#{nth($names, $i)} {
+      @extend %#{nth($names, $i)};
+    }
+  }
+  @for $i from 1 through length($modifier-name) {
+    .#{nth($modifier-name, $i)} {
+      color:#{nth($modifier-code, $i)};
+    }
+  }
+  ul, ol {
+    &.unstyled {
+      @extend %unstyled;
+    }
+  }
+  ul.list {
+    @extend %ul-list;
+    > li {
+      @extend %list-item;
+    }
+  }
+  ol.list {
+    @extend %ol-list;
+
+    @for $i from 1 through length($modifier-name) {
+      &.#{nth($modifier-name, $i)} {
+        li {
+          &:before {
+            background:#{nth($modifier-code, $i)};
+          }
+        }
+      }
+    }
+    li {
+      @for $i from 1 through length($modifier-name) {
+        &.#{nth($modifier-name, $i)} {
+          &:before {
+            background:#{nth($modifier-code, $i)};
+          }
+        }
+      }
+    }
+    > li {
+      @extend %list-item;
+    }
+  }
+}

data/vendor/assets/stylesheets/groundworkcss/type/_webfonts.scss

@@ -0,0 +1,28 @@
+// =============================================
+//                 Web Fonts
+//          Last Updated:2013-4-25
+// =============================================
+
+
+
+
+@for $i from 1 through length($web-font-files) {
+  // @include font-face('#{nth($web-font-names, $i)}', inline-font-files("#{nth($web-font-files, $i)}.eot", "#{nth($web-font-files, $i)}.woff", "#{nth($web-font-files, $i)}.ttf"));
+  @font-face {
+    font-family: '#{nth($web-font-names, $i)}';
+    font-style: normal;
+    font-weight: normal;
+    src: url('#{$root_path}#{$fonts_path}#{nth($web-font-files, $i)}.eot');
+    src: url('#{$root_path}#{$fonts_path}#{nth($web-font-files, $i)}.eot#iefix') format('embedded-opentype'), 
+         url('#{$root_path}#{$fonts_path}#{nth($web-font-files, $i)}.woff') format('woff'), 
+         url('#{$root_path}#{$fonts_path}#{nth($web-font-files, $i)}.ttf') format('truetype');
+  }
+  %#{nth($web-font-names, $i)} {
+    @include font-stack(#{nth($web-font-names, $i)});
+  }
+  @if $classes {
+    .#{nth($web-font-names, $i)} {
+      @extend %#{nth($web-font-names, $i)};
+    }
+  }
+}

data/vendor/assets/stylesheets/groundworkcss/ui/_all.scss

@@ -0,0 +1,13 @@
+// ===================================
+//             UI Elements
+// ===================================
+
+
+
+
+// ui elements
+@import "messages";
+@import "callouts";
+@import "tables";
+@import "tooltips";
+@import "modals";

data/vendor/assets/stylesheets/groundworkcss/ui/_callouts.scss

@@ -0,0 +1,130 @@
+// =============================================
+//              Callout Panels
+//          Last Updated:2013-4-24
+// =============================================
+
+
+
+
+%callout {
+  position:relative;
+  word-wrap:break-word;
+  padding:1em;
+  background:$button-color;
+  border:1px solid $button-active;
+  color:$button-text;
+  margin-bottom:15px;
+  @include rounded($radius);
+  // content overrides
+  h1, h2, h3, h4, h5, h6, p {
+    color:inherit;
+  }
+  *:last-child {
+    margin-bottom:0;
+  }
+}
+
+%callout-small { @include _small; }
+%callout-large { @include _large; }
+%callout-square { @include _square; }
+%callout-round { @include _round; }
+%callout-disabled { @include state(disabled,normal,desaturate($button-color,20%)); }
+
+%callout-info {
+  background-color:$info-background;
+  color:$info-color;
+  border-color:$info-border;
+  &%callout-disabled {
+    @include state(disabled,normal,desaturate($info-color,20%));
+  }
+}
+
+%callout-alert{
+  background-color:$alert-background;
+  color:$alert-color;
+  border-color:$alert-border;
+  &%callout-disabled {
+    @include state(disabled,normal,desaturate($alert-color,20%));
+  }
+}
+
+%callout-warning {
+  background:$warning-background;
+  color:$warning-color;
+  border-color:$warning-border;
+  &%callout-disabled {
+    @include state(disabled,normal,desaturate($warning-color,20%));
+  }
+}
+
+%callout-error {
+  background:$error-background;
+  color:$error-color;
+  border-color:$error-border;
+  &%callout-disabled {
+    @include state(disabled,normal,desaturate($error-color,20%));
+  }
+}
+
+%callout-success {
+  background:$success-background;
+  color:$success-color;
+  border-color:$success-border;
+  &%callout-disabled {
+    @include state(disabled,normal,desaturate($success-color,20%));
+  }
+}
+
+%callout-dismissible {
+  padding-right:3em;
+  &:after {
+    content:'X';
+    display:block;
+    padding:0.5em 0;
+    font-size:0.8em;
+    text-align:center;
+    position:absolute;
+    top:0;
+    right:1em;
+    line-height:1.5;
+  }
+}
+
+@for $i from 1 through length($modifier-name) {
+  %callout-#{nth($modifier-name, $i)} {
+    border-color:nth($modifier-code, $i);
+    background-color:lighten(nth($modifier-code, $i), 10%);
+    color:nth($modifier-text, $i);
+  }
+}
+
+@mixin callout_modifiers() {
+  $modifiers: small large info alert warning error success square round disabled;
+  @for $i from 1 through length($modifiers) {
+    &.#{nth($modifiers, $i)} {
+      @extend %callout-#{nth($modifiers, $i)};
+    }
+  }
+  @for $i from 1 through length($modifier-name) {
+    &.#{nth($modifier-name, $i)} {
+      @extend %callout-#{nth($modifier-name, $i)};
+    }
+  }
+}
+
+@if $classes {
+  .callout {
+    @extend %callout;
+    @include callout_modifiers;
+  }
+}
+
+@if $aria {
+  [role~=status] {
+    @extend %callout;
+    
+    @if $classes {
+      @include callout_modifiers;
+    }
+  }
+}