Permalink
Browse files

Move sass example

  • Loading branch information...
1 parent 0fe9afb commit 0ed117ebd8e6f2f932f7e0dcadda1bd7185a2a17 @tamimitchell tamimitchell committed May 10, 2012
View
BIN .DS_Store
Binary file not shown.
View
Binary file not shown.
View
No changes.
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -0,0 +1,115 @@
+<!doctype html>
+<!--[if lt IE 7 ]> <html class="no-js ie6 ie" lang="en"> <![endif]-->
+<!--[if IE 7 ]> <html class="no-js ie7 ie" lang="en"> <![endif]-->
+<!--[if IE 8 ]> <html class="no-js ie8 ie" lang="en"> <![endif]-->
+<!--[if IE 9 ]> <html class="no-js ie9 ie" lang="en"> <![endif]-->
+<!--[if (gte IE 9)|!(IE)]><!--> <html class="no-js no-ie" lang="en"> <!--<![endif]-->
+<head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+
+ <title></title>
+ <meta name="description" content="">
+ <meta name="author" content="">
+
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+ <link rel="shortcut icon" href="/favicon.ico" />
+ <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
+ <link rel="apple-touch-icon" href="/apple-touch-icon-72x72.png" sizes="72x72" />
+ <link rel="apple-touch-icon" href="/apple-touch-icon-114x114.png" sizes="114x114" />
+
+ <link rel="stylesheet" type="text/css" href="style.css" />
+ <script src="javascripts/libs/modernizr-2.0.6.min.js"></script>
+
+</head>
+
+<body>
+
+ <div class="container">
+ <header>
+ <h1><a href="#"><img id="logo" src="ghtlogo.png"></a></h1>
+ </header>
+
+ <div id="main">
+
+ <article id="content">
+ <header>
+ <h1>Bonneville Shoreline</h1>
+ <h3>Northern Utah, USA</h3>
+ </header>
+
+ <figure>
+ <img src="trail.png">
+ <figcaption><h4>Along the Bonneville Shoreline Trail</h4></figcaption>
+ </figure>
+
+ <p>The Bonneville Shoreline Trail follows the shoreline of the ancient Lake Bonneville in Northern Utah. It is a mixed use (biking/hiking/horseback riding) recreation trail. It will total 305+ miles of dirt and paved trails when completed, but some parts of the trail are not developed yet. The Bonneville Shoreline Trail is a medium level hike with many drops and climbs near canyon openings. It is a hike best suited for early spring or late fall, since it is generally still warm and usable when higher elevation trails are covered in snow.</p>
+
+ <section id="reviews" class="cf">
+ <h2>Reviews</h2>
+ <article>
+ <h3>Loved it</h3>
+ <p>"This hike is super awesome. It offers really great views of the valley, and a good mix of sun and shade. Don't forget to bring your camera!"</p>
+ </article>
+ </section>
+
+ </article>
+
+ <aside>
+ <section>
+ <h2>Similar Hikes</h2>
+ <ul>
+ <li><a href="#">The River Trail</a></li>
+ <li><a href="#">Green Canyon</a></li>
+ <li><a href="#">Wind Caves</a></li>
+ </ul>
+ </section>
+
+ <section>
+ <h2>Made by the Phuse</h2>
+ <ul>
+ <li><a href="http://thephuse.com/blog/">Check out the Blog</a></li>
+ <li><a href="https://phuse.wufoo.com/forms/project-questionnaire/">Get a Quote Today</a></li>
+ <li><a href="http://thephuse.com/">Visit our Website</a></li>
+ </ul>
+ </section>
+
+ </aside>
+
+ </div><!-- end of #main -->
+
+ <footer class="cf">
+ <h4>More trails | Maps | Photos
+ <a href="http://thephuse.com/" id="phuse-logo"></a>
+ </h4>
+ </footer>
+ </div> <!-- end of .container -->
+
+
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
+ <script>!window.jQuery && document.write(unescape('%3Cscript src="/javascripts/libs/jquery.1.6.2.min.js"%3E%3C/script%3E'))</script>
+
+ <script src="javascripts/plugins.js"></script>
+ <script src="javascripts/script.js"></script>
+
+ <!--[if lt IE 7 ]>
+ <script src="/javascripts/libs/dd_belatedpng.js"></script>
+ <script> DD_belatedPNG.fix('img, .png_bg'); </script>
+ <![endif]-->
+
+
+ <!-- change the UA-XXXXX-X to be your site's ID -->
+ <script>
+ var _gaq = [['_setAccount', 'UA-XXXXX-X'], ['_trackPageview']];
+ (function(d, t) {
+ var g = d.createElement(t),
+ s = d.getElementsByTagName(t)[0];
+ g.async = true;
+ g.src = ('https:' == location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+ s.parentNode.insertBefore(g, s);
+ })(document, 'script');
+ </script>
+
+</body>
+</html>
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -0,0 +1,87 @@
+/* HTML5 Boilerplate
+ * ==|== normalize ==========================================================
+ */
+
+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; font-size: 13px; line-height: 1.231; }
+body, button, input, select, textarea { font-family: sans-serif; color: #222; }
+
+::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
+::selection { background: #fe57a1; color: #fff; text-shadow: none; }
+
+a { color: #00e; }
+a:visited { color: #551a8b; }
+a:hover { color: #06e; }
+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; }
+hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
+ins { background: #ff9; color: #000; text-decoration: none; }
+mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
+pre, code, kbd, samp { font-family: monospace, monospace; _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: 85%; }
+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; margin: 0; padding: 0; }
+img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
+svg:not(:root) { overflow: hidden; }
+figure { margin: 0; }
+
+form { margin: 0; }
+fieldset { border: 0; margin: 0; padding: 0; }
+label { cursor: pointer; }
+legend { border: 0; *margin-left: -7px; padding: 0; }
+button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
+button, input { line-height: normal; *overflow: visible; }
+table button, table input { *overflow: auto; }
+button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
+input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
+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; resize: vertical; }
+input:valid, textarea:valid { }
+input:invalid, textarea:invalid { background-color: #f0dddd; }
+
+table { border-collapse: collapse; border-spacing: 0; }
+td { vertical-align: top; }
+
+/* @group Helper Classes */
+.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
+.hidden { display: none; 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; }
+.cf { display:inline-block; }
+.cf:after { display:block; visibility:hidden; clear:both; height:0; content: "."; }
+/* @end */
+
+/* @group Wordpress */
+p img {
+ padding: 0;
+ max-width: 100%;
+}
+img.centered {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+}
+.alignright { float: right; }
+.alignleft { float: left; }
+/* @end */
View
@@ -0,0 +1,169 @@
+@import url(normalize.css);
+/**/
+@font-face {
+ font-family: 'ProximaNovaRegular';
+ src: url("type/proximanova-reg-webfont.eot");
+ src: url("type/proximanova-reg-webfont.eot?#iefix") format("embedded-opentype"), url("type/proximanova-reg-webfont.woff") format("woff"), url("type/proximanova-reg-webfont.ttf") format("truetype");
+ font-weight: normal;
+ font-style: normal; }
+
+@font-face {
+ font-family: 'ProximaNovaExtraBold';
+ src: url("type/proximanova-extrabold-webfont.eot");
+ src: url("type/proximanova-extrabold-webfont.eot?#iefix") format("embedded-opentype"), url("type/proximanova-extrabold-webfont.woff") format("woff"), url("type/proximanova-extrabold-webfont.ttf") format("truetype");
+ font-weight: normal;
+ font-style: normal; }
+
+@font-face {
+ font-family: 'BemioItalicRegular';
+ src: url("type/bemio_italic-webfont.eot");
+ src: url("type/bemio_italic-webfont.eot?#iefix") format("embedded-opentype"), url("type/bemio_italic-webfont.woff") format("woff"), url("type/bemio_italic-webfont.ttf") format("truetype");
+ font-weight: normal;
+ font-style: normal; }
+
+* {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box; }
+
+body {
+ font-size: 14px;
+ font-family: 'ProximaNovaRegular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ background-color: #333333;
+ color: #333333; }
+ body a, body a:visited {
+ color: #ff6644; }
+
+.container {
+ margin: 0 auto;
+ max-width: 1200px;
+ box-shadow: 0 0 2px #fff;
+ background-color: #fff; }
+
+header {
+ margin: 0;
+ width: 100%;
+ padding: 1.42rem;
+ border-bottom: 1px solid #dedede; }
+ header h1 {
+ margin: 0;
+ padding: 0; }
+
+h1, h2 {
+ font-family: "BemioItalicRegular", 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ text-transform: uppercase;
+ color: #000; }
+
+h1 {
+ font-size: 40px; }
+
+h2 {
+ font-size: 25px; }
+
+h3 {
+ font-family: 'ProximaNovaExtraBold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ text-transform: uppercase;
+ color: #ff6644; }
+
+h4 {
+ font-size: 12px;
+ text-transform: uppercase;
+ color: #CCC; }
+
+#main {
+ margin: 0;
+ float: left;
+ width: 100%;
+ padding: 0;
+ background-color: white; }
+
+#content {
+ float: left;
+ width: 66.667%;
+ padding: 0; }
+ @media only screen and (max-width: 770px) {
+ #content {
+ clear: left;
+ width: 100%;
+ padding: 0; } }
+ #content article {
+ width: 100%;
+ padding: 1.42rem; }
+ #content p {
+ padding: 1rem;
+ line-height: 1.4rem; }
+ #content figure {
+ width: 41.667%;
+ padding: 1.42rem;
+ min-width: 240px;
+ float: right;
+ border: .5rem solid #fff;
+ border-bottom: none; }
+ @media only screen and (max-width: 600px) {
+ #content figure {
+ min-width: 280px;
+ margin: 0 auto;
+ float: none; } }
+ #content figure img {
+ max-width: 100%;
+ margin: 0; }
+ #content figure figcaption {
+ padding: 0;
+ margin: 0;
+ text-align: center;
+ background-color: #fff; }
+ #content #reviews {
+ border-top: 3px double #dedede;
+ width: 100%;
+ padding: 1.42rem; }
+ #content #reviews article {
+ padding: 18px 20px 0 20px;
+ background-color: #fff;
+ border: 1px solid #dedede;
+ border-bottom: 4px double #dedede;
+ margin-bottom: 0rem; }
+ #content #reviews article h3 {
+ border-bottom: 1px solid #dedede;
+ padding-bottom: .78rem;
+ margin: 0; }
+ #content #reviews article p {
+ padding: 0; }
+
+aside {
+ height: 53rem;
+ float: left;
+ width: 33.333%;
+ padding: 1.42rem;
+ background-color: #F4F1EF;
+ border-left: 2px solid #dedede; }
+ aside h2 {
+ text-transform: uppercase; }
+ @media only screen and (max-width: 770px) {
+ aside {
+ height: auto;
+ clear: left;
+ width: 100%;
+ padding: 1.42rem;
+ border-top: 1px solid #dedede; } }
+ aside ul {
+ list-style: none;
+ padding: 0;
+ line-height: 1rem; }
+ aside ul li {
+ line-height: 1.3rem; }
+
+footer {
+ width: 100%;
+ padding: 1.42rem;
+ text-align: center;
+ background-color: white;
+ border-top: 1px solid #dedede; }
+ footer #phuse-logo {
+ float: right;
+ position: relative;
+ top: -6px;
+ width: 44px;
+ height: 30px;
+ background: url("logo.png") no-repeat; }
+ footer h4 {
+ margin: 0; }
Oops, something went wrong.

0 comments on commit 0ed117e

Please sign in to comment.