framous 0.2.5 → 0.3

data/stylesheets/framous/base/_tables.scss

@@ -1,120 +0,0 @@
-//
-// Tables
-//
-
-table {
-  position: relative;
-  margin-bottom: ms(1);
-  width: 100%;
-  border: 1px solid $border-color;
-}
-
-* html table,
-*:first-child+html table {
-  zoom: 1;
-}
-
-th,
-td {
-  padding: ms(0)/2 ms(0) ms(0)/2 ms(0)/2;
-  border-right: solid 1px $border-color;
-  text-align: left; /* LTR */
-  &:last-child {
-    border-right: 0 none;
-  }
-}
-
-thead {
-  th,
-  td {
-    padding-top: ms(0)/2;
-  }
-}
-
-tfoot {
-  th,
-  td {
-    padding-bottom: ms(0)/2;
-  }
-}
-
-tbody,
-tfoot {
-  th,
-  td {
-    border-top: solid 1px $border-color;
-  }
-}
-
-tr:nth-child(even) td { }
-tbody tr:nth-child(odd) {
-  th,
-  td {
-    background: $background-color;
-  }
-}
-
-tbody {
-  border-top: none;
-}
-
-@include breakpoint($small) {
-
-	table {
-	  position: relative;
-	  display: block;
-	  width: 100%;
-	}
-
-	table thead {
-	  display: block;
-	  float: left;
-
-	  tr th {
-	    border-right: 2px solid $border-color;
-	    border-bottom: 1px solid $border-color;
-	    
-	    &:last-child {
-	      border-right: 2px solid $border-color;
-	      border-bottom: 0 none;
-	    }
-	  }
-	}
-
-	table tbody {
-		display: -webkit-box;
-		overflow-x: auto;
-	}
-	
-	table th,
-	table tr,
-	table td {
-	  display: block;
-	}
-
-	tbody,
-	tfoot {
-	  th,
-	  td {
-	    &:first-child {
-	      border-top: 0 none;
-	    }
-	  }
-	}
-
-	// sort out borders
-	table th {
-		border-bottom: 0;
-	}
-
-	table td {
-		border-right: 0;
-		border-bottom: 0;
-		border-left: 0;
-	}
-	
-	table tbody tr {
-	  border-right: 1px solid $border-color;
-	}
-
-}

data/stylesheets/framous/base/_typography.scss

@@ -1,213 +0,0 @@
-//
-// Typography.scss
-// Base Type Styles Using Modular Scale
-// @credits http://thesassway.com/projects/modular-scale
-// https://github.com/scottkellum/modular-scale
-// Vertical Rhythm : http://drewish.com/tools/vertical-rhythm
-//
-
-@import "compass/typography/vertical_rhythm";
-@import "compass/reset/utilities";
-
-body,div,dl,dt,dd,ul,ol,li,
-h1,h2,h3,h4,h5,h6,
-pre,form,p,blockquote,th,td {
-  margin: 0;
-  padding: 0;
-  font-size: ms(0);
-  direction: $text-direction;
-}
-
-body {
-	position: relative;
-	background: $background-body-color;
-	color: $body-font-color;
-	font-size: ms(0);
-	font-family: $body-font-family;
-	line-height: $base-line-height;
-	-webkit-text-rendering: optimizeLegibility;
-  -moz-text-rendering: optimizeLegibility;
-  -ms-text-rendering: optimizeLegibility;
-  -o-text-rendering: optimizeLegibility;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-font-smoothing: antialiased;
-  -ms-font-smoothing: antialiased;
-  -o-font-smoothing: antialiased;
-  font-smoothing: antialiased;
-}
-
-// Links : link, visited, hover, active
-a {
-	color: $link-color;
-	text-decoration: none;
-	line-height: inherit;
-	word-wrap: break-word;
-
-	&:visited {
-		color: $link-color-hover;
-	}
-
-	&:hover {
-		color: $link-color-hover;
-	}
-
-	&:active {
-		color: $link-color-hover;
-	}
-
-	&:focus {
-		outline: none;
-		color: $link-color-hover;
-	}
-}
-
-p a,
-p a:visited {
-	line-height: inherit;
-}
-
-p {
-	margin-bottom: ms(1);
-	font-weight: $body-font-weight;
-	font-family: $body-font-family;
-	@include adjust-font-size-to(ms(0));
-}
-
-aside p {
-	font-size: ms(0) - 1;
-	@include adjust-font-size-to(ms(0) - 1);
-}
-
-h1, h2, h3, h4, h5, h6 {
-  margin-top: ms(0);
-  margin-bottom: ms(0);
-  color: $header-font-color;
-  font-weight: $header-font-weight;
-  font-family: $header-font-family;
-  text-rendering: optimizeLegibility;
-  
-  small {
-  	color: lighten($header-font-color, 30%);
-  	font-size: 75%;
-  	line-height: 0;
-  }
-}
-
-h1 { @include adjust-font-size-to(ms(5)); }
-h2 { @include adjust-font-size-to(ms(4)); }
-h3 { @include adjust-font-size-to(ms(3)); }
-h4 { @include adjust-font-size-to(ms(2)); }
-h5 { @include adjust-font-size-to(ms(1)); }
-h6 { @include adjust-font-size-to(ms(0)); }
-
-hr {
-	clear: both;
-	margin: ms(1) 0 ms(1);
-	height: 0;
-	border: solid #ddd;
-	border-width: 1px 0 0;
-}
-
-em, i {
-	font-style: italic;
-	line-height: inherit;
-}
-
-strong, b {
-	font-weight: bold;
-	line-height: inherit;
-}
-
-small {
-	font-size: 75%;
-	line-height: inherit;
-}
-
-code {
-	background: $highlight-color;
-	font-weight: bold;
-}
-
-// Lists
-ul, ol {
-	margin-bottom: ms(1);
-	margin-left: ms(1);
-	@include adjust-font-size-to(ms(0));
-}
-
-ul {
-  li {
-    ul, ol {
-    	margin-#{$default-float}: ms(1);
-    }
-  }
-}
-
-ol {
-  li {
-    ul, ol {
-    	margin-#{$default-float}: ms(1);
-    }
-  }
-}
-
-nav ul, nav ol,
-.nav li, .nav ol {
-	@include reset-list-style;
-  margin: 0;
-  padding: 0;
-}
-
-// Text Marking
-ins, mark {
-	background-color: $highlight-color;
-  color: invert($highlight-color);
-}
-
-ins {
-	text-decoration: none;
-}
-
-del {
-	text-decoration: line-through;
-}
-
-// Blockquote
-blockquote, blockquote p {
-	color: lighten($header-font-color, 30%);
-	font-style: italic;
-	line-height: 1.5;
-}
-
-blockquote {
-	margin: 0 0 ms(1) ms(1);
-	padding: 0px ms(1) 0 ms(1);
-	border-#{$default-float}: 1px solid $grey-set;
-  
-  cite {
-  	display: block;
-  	color: lighten($header-font-color, 20%);
-  	font-size: ms(0) - 1;
-    
-    &:before {
-    	content: "\2014 \0020";
-    }
-    
-    a, a:visited {
-    	color: lighten($header-font-color, 20%);
-    }
-  }
-}
-
-abbr, acronym {
-	border-bottom: 1px solid $grey-set;
-	color: $header-font-color;
-	text-transform: uppercase !important;
-	font-size: 90%;
-	cursor: help;
-}
-
-abbr {
-	text-transform: none;
-}

data/stylesheets/framous/grid/_framous-grid.scss

@@ -1,9 +0,0 @@
-//
-// Framous-grid.scss
-// A semantic, fluid grid framework
-// Based on http://neat.bourbon.io/ & http://susy.oddbird.net/
-//
-
-@import "settings";
-@import "functions";
-@import "grid";

data/stylesheets/framous/grid/_functions.scss

@@ -1,39 +0,0 @@
-//
-// Functions & Mixins
-//
-
-//
-// Flexible grid
-//
-
-@function flex-grid($columns, $container-columns: $fg-max-columns) {
-  $width: $columns * $fg-column + ($columns - 1) * $fg-gutter;
-  $container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
-  @return percentage($width / $container-width);
-}
-
-// Flexible gutter
-@function flex-gutter($container-columns: $fg-max-columns, $gutter: $fg-gutter) {
-  $container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
-  @return percentage($gutter / $container-width);
-}
-
-//
-// Container Span
-//
-
-@function container-span($span: $span) {
-  @if length($span) == 3 {
-    $container-columns: nth($span, 3);
-    @return $container-columns;
-  }
-
-  @else if length($span) == 2 {
-    $container-columns: nth($span, 2);
-    @return $container-columns;
-  }
-
-  @else {
-    @return $grid-columns;
-  }
-}

data/stylesheets/framous/grid/_grid.scss

@@ -1,201 +0,0 @@
-//
-// Grid.scss 
-// The default grid uses 12 columns.
-//
-
-//
-// Imports
-//
-
-@import "compass/css3/box-sizing";
-@import "compass/utilities/general";
-
-// $border-box-sizing: true !default;
-// Makes all elements have a border-box layout
-
-@if $border-box-sizing == true {
-  * {
-    @include box-sizing(border-box);
-  }
-}
-
-$fg-column: $column;
-$fg-gutter: $gutter;
-$fg-max-columns: $grid-columns;
-$fg-max-width: $max-width;
-$parent-columns: $grid-columns !default;
-
-// outer wrapper center container
-@mixin outer-container() {
-  @include clearfix;
-  max-width: $fg-max-width;
-  text-align: left;
-  margin: {
-    left: auto;
-    right: auto;
-  }
-}
-
-// Grid span columns
-// Use the span-columns mixin to specify the number of columns an element:
-// @include span-columns($span: $columns of $container-columns, $display: block)
-// eg. Element that spans across 6 columns (out of the default 12)
-// div.element { @include span-columns(6 of 8); }
-@mixin span-columns($span: $columns of $container-columns, $display: block) {
-
-  $columns: nth($span, 1);
-  $container-columns: container-span($span);
-
-  @if $container-columns != $grid-columns {
-    $parent-columns: $container-columns;
-  }
-
-  @if $display == table {
-    display: table-cell;
-    padding-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns) + flex-gutter($container-columns);
-
-    &:last-child {
-      padding-right: 0;
-    }
-  }
-
-  @else if $display == inline-block {
-    @include inline-block;
-    margin-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns);
-
-    &:last-child {
-      margin-right: 0;
-    }
-  }
-
-  @else {
-    display: block;
-    float: left;
-    margin-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns);
-
-    &:last-child {
-      margin-right: 0;
-    }
-  }
-}
-
-// Clearfix / row container
-// In order to clear floated or table-cell columns:
-@mixin row($display: block) {
-  @include clearfix;
-  @if $display == table {
-    display: table;
-  }
-
-  @else {
-    display: block;
-  }
-}
-
-// Shift
-// To move an element to the left or right by a number of columns:
-@mixin shift($n-columns: 1) {
-  margin-left: $n-columns * flex-grid(1, $parent-columns) + $n-columns * flex-gutter($parent-columns);
-}
-
-// Pad
-// To add padding around the entire column use pad().
-// By default it adds the same value as the grid's gutter.
-@mixin pad($padding: flex-gutter()) {
-  padding: $padding;
-}
-
-// Remove element gutter
-@mixin omega($display: block, $direction: right) {
-  @if $display == table {
-    padding-#{$direction}: 0;
-  }
-
-  @else {
-    margin-#{$direction}: 0;
-  }
-}
-
-// You can also use nth-omega to remove the gutter of a specific column or set of columns
-@mixin nth-omega($nth, $display: block, $direction: right) {
-  @if $display == table {
-    &:nth-child(#{$nth}) {
-      padding-#{$direction}: 0;
-    }
-  }
-
-  @else {
-    &:nth-child(#{$nth}) {
-      margin-#{$direction}: 0;
-    }
-  }
-}
-
-// Fill 100% of parent
-// This makes sure that the child fills 100% of its parent
-@mixin fill-parent() {
-  width: 100%;
-
-  @if $border-box-sizing == false {
-    @include box-sizing(border-box);
-  }
-}
-
-// Breakpoints
-// The breakpoint() mixin allows you to use media-queries to modify both the grid and the layout.
-// It takes two arguments:
-@mixin breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) {
-
-  @if length($query) == 1 {
-    @media screen and ($default-feature: nth($query, 1)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 2 {
-    @media screen and (nth($query, 1): nth($query, 2)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 3 {
-    @media screen and (nth($query, 1): nth($query, 2)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: nth($query, 3);
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 4 {
-    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 5 {
-    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: nth($query, 5);
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else {
-    @warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
-  }
-}
-