Several bug fixes and new feature:

- Fixed broken link to local copy of jQuery - Modified .gitignore - Add pre-compiled versions of normalize.less, grid.less, and style.less for those who would rather not use LESS *** Fraction.less now features Holmes CSS Debugger *** Commit by Bill Patrianakos bill@chooseclever.com
WrtApp · Dec 22, 2011 · 093034b · 093034b
1 parent 6b8a7ef
commit 093034b
Show file tree

Hide file tree

Showing 8 changed files with 139 additions and 14 deletions.
diff --git a/.gitignore b/.gitignore
@@ -21,6 +21,6 @@
 
 # Individual Files
 
-# .gitignore # Uncomment this in your setup
 scratch.txt
-todo.txt
+todo.txt
+workinggrid.less
diff --git a/css/grid.css b/css/grid.css
@@ -0,0 +1,22 @@
+/**********************************************************\
+ * Fraction.less GRID - Compiled from grid.less			  *	
+ *														  *
+ * This is the compiled grid.less file. It is recommended *
+ * that you take advantage of the built in LESS support	  *
+ * but you are free to use this regular CSS file instead. *
+ * 														  *
+ * Please note that this file is minified. See the .less  *
+ * version for fully commented, readable, detailed code.  *
+ *														  *
+ \*********************************************************/
+
+.centered{margin-right:auto;margin-left:auto;}
+.full-width{display:block;width:1140px;padding-left:20px;padding-right:20px;margin-right:auto;margin-left:auto;}
+.one-half{display:block;width:540px;margin-right:20px;}
+.one-third{display:block;width:360px;margin-right:20px;}
+.two-thirds{display:block;width:720px;margin-right:20px;}
+.one-quarter{display:block;width:260px;margin-right:20px;}
+.three-quarters{display:block;width:840px;margin-right:20px;}
+.left{float:left;}
+.right{float:right;}
+.last{margin-right:0px;}
diff --git a/css/normalize.css b/css/normalize.css
@@ -0,0 +1,52 @@
+/****************************************************************\
+ * Fraction.less RESET - Compiled from normalize.less	  	 	*	
+ *														  	 	*
+ * This is the compiled normalize.less file. It is recommended  *
+ * that you take advantage of the built in LESS support	  		*
+ * but you are free to use this regular CSS file instead. 		*
+ * 														  		*
+ * Please note that this file is minified. See the .less  		*
+ * version for fully commented, readable, detailed code.  		*
+ *														  		*
+ \***************************************************************/
+
+article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block;}
+audio,canvas,video{display:inline-block;*display:inline;*zoom:1;}
+audio:not([controls]){display:none;}
+[hidden]{display:none;}
+html{font-size:100%;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
+body{margin:0;}
+body,button,input,select,textarea{font-family:sans-serif;}
+a:focus{outline:thin dotted;}
+a:hover,a:active{outline:0;}
+abbr[title]{border-bottom:1px dotted;}
+b,strong{font-weight:bold;}
+blockquote{margin:1em 40px;}
+dfn{font-style:italic;}
+mark{background:#ff0;color:#000;}
+pre,code,kbd,samp{font-family:monospace, serif;_font-family:'courier new',monospace;font-size:1em;}
+pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word;}
+q{quotes:none;}
+q:before,q:after{content:'';content:none;}
+small{font-size:75%;}
+sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
+sup{top:-0.5em;}
+sub{bottom:-0.25em;}
+ul,ol{margin:1em 0;padding:0 0 0 40px;}
+dd{margin:0 0 0 40px;}
+nav ul,nav ol{list-style:none;list-style-image:none;}
+img{border:0;-ms-interpolation-mode:bicubic;}
+svg:not(:root){overflow:hidden;}
+figure{margin:0;}
+form{margin:0;}
+fieldset{border:none;margin:0 2px;padding:0.35em 0.625em 0.75em;}
+legend{border:0;*margin-left:-7px;}
+button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle;}
+button,input{line-height:normal;}
+button,input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button;*overflow:visible;}
+input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}
+input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}
+input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}
+button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}
+textarea{overflow:auto;vertical-align:top;}
+table{border-collapse:collapse;border-spacing:0;}
diff --git a/css/style.css b/css/style.css
@@ -0,0 +1,35 @@
+/************************************************************\
+ * Fraction.less MAIN STYLESHEET - Compiled from style.less *	
+ *														  	*
+ * This is the compiled style.less file. It is recommended 	*
+ * that you take advantage of the built in LESS support	  	*
+ * but you are free to use this regular CSS file instead. 	*
+ * 														  	*
+ * Please note that this file is minified. See the .less  	*
+ * version for fully commented, readable, detailed code.  	*
+ *														  	*
+ \***********************************************************/
+
+@import url('normalize.css');
+@import url('grid.css');
+.screen-width{display:block;width:screen-width;padding:20px;}
+.centered{margin-left:auto;margin-right:auto;}
+h1,h2,h3,h4,h5,h6{font-family:Helvetica,Tahoma,sans-serif;font-weight:bold;line-height:30px;color:;}
+p{font-size:15px;line-height:24px;}
+h6{font-size:18px;line-height:29px;}
+h5{font-size:22px;line-height:35px;}
+h4{font-size:26px;line-height:42px;}
+h3{font-size:30px;line-height:48px;}
+h2{font-size:34px;line-height:55px;}
+h1{font-size:36px;line-height:58px;}
+.link-button{padding:10px;color:#ffffff;-moz-border-radius:10px;-o-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;border:1px solid #ffffff;}
+.ir{display:block;border:0;text-indent:-999em;overflow:hidden;background-color:transparent;background-repeat:no-repeat;text-align:left;direction:ltr;}
+.ir br{display:none;}
+.hidden{display:none !important;visibility:hidden;}
+.visuallyhidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;}
+.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto;}
+.invisible{visibility:hidden;}
+.clearfix:before,.clearfix:after{content:"";display:table;}
+.clearfix:after{clear:both;}
+.clearfix{zoom:1;}
+@media only screen and (min-width: 480px){}@media only screen and (min-width: 768px){}@media print{*{background:transparent !important;color:black !important;text-shadow:none !important;filter:none !important;-ms-filter:none !important;} a,a:visited{text-decoration:underline;} a[href]:after{content:" (" attr(href) ")";} abbr[title]:after{content:" (" attr(title) ")";} .ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after{content:"";} pre,blockquote{border:1px solid #999;page-break-inside:avoid;} thead{display:table-header-group;} tr,img{page-break-inside:avoid;} img{max-width:100% !important;} @page {margin:0.5cm;}p,h2,h3{orphans:3;widows:3;} h2,h3{page-break-after:avoid;}}
diff --git a/index.html b/index.html
@@ -10,27 +10,27 @@
 	<title></title>
 	<meta name="description" content="" />
 	<meta name="author" content="" />
-	<!-- Reference to humans.txt -->
+<!-- Reference to humans.txt -->
 	<link rel="author" href="humans.txt" />
 
-	<!-- Mobile viewpoer optimization -->
+<!-- Mobile viewport optimization -->
 	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-	<!-- Place your favicon.ico and apple-touch-icon.png in the site root folder instead of referencing them here -->
+<!-- Place your favicon.ico and apple-touch-icon.png in the site root folder instead of referencing them here -->
 
-	<!-- Your main stylesheet for all media. Remove version number for production mode -->
+<!-- Your main stylesheet for all media. Remove version number for production mode -->
 	<link rel="stylesheet" href="css/style.css?v=2" />
 
-	<!-- 
-	TO USE LESS WITHOUT A COMPILER, UNCOMMENT THIS AND DELETE THE PRECEEDING LINK TO 'style.css'
+<!-- 
+TO USE LESS WITHOUT A COMPILER, UNCOMMENT THIS AND DELETE THE PRECEEDING LINK TO 'style.css'
 
 	<link rel="stylesheet/less" type="text/css" href="less/normalize.less" />
 	<link rel="stylesheet/less" type="text/css" href="less/grid.less" />
 	<link rel="stylesheet/less" type="text/css" href="less/style.less" />
 	<script src="js/libs/less.min.js" type="text/javascript"></script>
-	-->
+-->
 
-	<!-- HTML5 SHIV FOR OLD IE COMPATIBILITY (ITS EASIER TO USE THAN MODERNIZR) -->
+<!-- HTML5 SHIV FOR OLD IE COMPATIBILITY (ITS EASIER TO USE THAN MODERNIZR) -->
 	<!--[if lt IE 9]>
 	<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
 	<![endif]-->
@@ -56,7 +56,7 @@
 
 	<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
 	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script>
-	<script>window.jQuery || document.write('<script src="js/libs/jquery-1.6.4.min.js">\x3C/script>')</script>
+	<script>window.jQuery || document.write('<script src="js/libs/jquery1.6.4.min.js">\x3C/script>')</script>
 	<script src="js/plugins.js"></script>
 	<script src="js/vanity.min.js"></script>
 	<script src="js/validate.min.js"></script>

diff --git a/less/grid.less b/less/grid.less
@@ -10,6 +10,8 @@
  /*:::: GRID VARIABLES ::::*/
 
 
+ @screen-width: 100%;
+
  @full: 1140px;
  @half: 540px;
  @1quarter: 260px;
@@ -25,8 +27,8 @@
  	margin-right: auto;
  	margin-left: auto;
  }
-
- /*:::: GRID LAYOUT ::::*/
+ 
+  /*:::: GRID LAYOUT ::::*/
 
   .full-width {
  	display: block;

diff --git a/less/normalize.less b/less/normalize.less
@@ -187,7 +187,7 @@ form {
 }
 
 fieldset {
-    border: 1px solid #c0c0c0;
+    border: none;
     margin: 0 2px;
     padding: 0.35em 0.625em 0.75em;
 }

diff --git a/less/style.less b/less/style.less
@@ -20,6 +20,12 @@
 @white: #fff;
 
 /*:::: MIXINS ::::*/
+.screen-width {
+	 display: block;
+	 width: screen-width;
+	 padding: 20px;
+ }
+
 .centered {
 	margin-left: auto;
 	margin-right: auto;
@@ -74,30 +80,37 @@ h1, h2, h3, h4, h5, h6 {
 
 p {
   font-size: 15px;
+  line-height: 24px;
 }
 
 h6 {
   font-size: 18px;
+  line-height: 29px;
 }
 
 h5 {
   font-size: 22px;
+  line-height: 35px;
 }
 
 h4 {
   font-size: 26px;
+  line-height: 42px;
 }
 
 h3 {
   font-size: 30px;
+  line-height: 48px;
 }
 
 h2 {
   font-size: 34px;
+  line-height: 55px;
 }
 
 h1 {
   font-size: 36px;
+  line-height: 58px;
 }
 
 /*:::: BUTTONS ::::*/
@@ -107,6 +120,7 @@ h1 {
   padding: 10px;
   color: @white;
   .border-radius(10px);
+  border: 1px solid @white;
 }
 
 /*:::: FORMs ::::*/