Changed homepage content, added sticker banner

oldfu · Feb 9, 2016 · e6662ac · e6662ac
1 parent 1512405
commit e6662ac
Show file tree

Hide file tree

Showing 11 changed files with 24 additions and 28 deletions.
diff --git a/assets/combined.css b/assets/combined.css
diff --git a/assets/combined.gz.css b/assets/combined.gz.css
diff --git a/assets/combined.min.css b/assets/combined.min.css
diff --git a/example/index.html b/example/index.html
@@ -6,6 +6,7 @@
 	<title>Gutenberg — Meaningful Web Typography Starter Kit</title>
 	<link rel="stylesheet" href="assets/combined.min.css">
 	<script src="assets/combined.min.js"></script>
+	<link href='https://fonts.googleapis.com/css?family=Merriweather:400,700,400italic' rel='stylesheet' type='text/css'>
 </head>
 <body>
 	<div class="toggleWrapper">

diff --git a/gutenberg.jpg b/gutenberg.jpg
diff --git a/gutenberg.png b/gutenberg.png
diff --git a/index.html b/index.html
@@ -45,6 +45,7 @@
 	<link href='https://fonts.googleapis.com/css?family=Roboto+Mono' rel='stylesheet' type='text/css'>
 	<script src="https://use.typekit.net/gib4suc.js"></script>
 	<script>try{Typekit.load({ async: true });}catch(e){}</script>
+	<script src="//cdn.optimizely.com/js/2441010273.js"></script>
 </head>
 <body>
 	<div class="toggleWrapper">
@@ -116,15 +117,15 @@ <h5>Heading 5</h5>
 			<h6>Heading 6</h6>
 		</div>
 
-		<h3>Mobile first</h3>
+<!-- 		<h3>Mobile first</h3>
 		<p>Gutenberg sets base type size, line-height and calculates the leading for the mobile screens first. The break point is calculated based on maximum (ideal) width of elements. When a screen is wider than that, it resets and recalculates all the sizes so they better fit for desktop screens.</p>
 		<pre><code>// Base sizes
 $base-font-size: 100; // Converts to 16px
 $base-font-size-desktop: 112.5; // Converts to 18px
 $line-height: 1.625;
 $line-height-desktop: 1.8;
 $max-width: 35;</code></pre>
-
+ -->
 		<h3>Themes &amp; customization</h3>
 		<p>Gutenberg comes with two beautiful predefined themes based on two typefaces provided by Google Fonts: Merriweather and Open Sans.</p>
 		<p>There is a <em>custom</em> option that allows loading custom typefaces for body text and headings.</p>
@@ -156,35 +157,17 @@ <h2>Why Gutenberg?</h2>
 		<h2 class="alignCenter">Gutenberg v1.1</h2>
 		<p class="alignCenter">Gutenberg is an open source project licensed under <a href="https://creativecommons.org/licenses/by-sa/3.0/" target="_blank">Creative Commons 3.0</a>. Feel free to use, adapt or contribute.</p>
 		<div class="buttons alignCenter"><a href="https://github.com/matejlatin/Gutenberg" target="_blank" class="github" onclick="ga('send', 'event', 'Buttons', 'github');"><div>Fork on Github</div></a> <a class="tweet" href="javascript:void(0)" onclick="fbs_click(); ga('send', 'event', 'Buttons', 'twitter');"><div class="twitter">Tweet this</div></a></div>
+		<h5 class="alignCenter">More coming soon</h5>
+		<p class="alignCenter">New elements like tables and side comments will be added soon. Looking for people to translate this project to <strong>Less</strong> and <strong>Stylus</strong>. <a href="mailto:matejlatin@gmail.com">Get in touch</a>.</p>
 		<hr>
-		<h3>Future upgrades</h3>
-		<p>New elements like tables and side comments will be added soon. Looking for people to translate this project to <strong>Less</strong> and <strong>Stylus</strong>. <a href="mailto:matejlatin@gmail.com">Get in touch</a>.</p>
-		<h3>History</h3>
-		<p><strong>Gutenberg v1.1</strong> — <em>Jan 20, 2016</em></p>
-		<ul>
-			<li>Code optimized and simplified by use of mixins,</li>
-			<li>horizontal rule styling now more flexible with its own configuration,</li>
-			<li>Attention Grabber — a new element,</li>
-			<li>quotes — an alternative to blockquotes; can be floated,</li>
-			<li>added an option for paragraph indenting.</li>
-		</ul>
-		<p><strong>Gutenberg v1.0</strong> — <em>Dec 23, 2015</em></p>
-		<ul>
-			<li>Includes the basic elements: headings, paragraph, figure, blockquote & cite, horizontal rule, code, sub, sup, ul, ol, small,</li>
-			<li>Gutenberg reset — based on Normalize,</li>
-			<li>headings, body and links colors,</li>
-			<li>two default themes & custom theme options,</li>
-			<li>mobile first with a breakpoint for desktop screens,</li>
-			<li>sizes based on Perfect Fifth modular scale,</li>
-			<li>fixImgHeight.js — a small & lightweight script that resizes images so they fit the baseline grid.</li>
-		</ul>
+		<a href="#"><img src="sticker.jpg" alt="Gutenberg Sticker" class="sticker"></a>
 	</article>
 	<footer class="alignCenter clearfix">
-			<img src="gutenberg.png" alt="Gutenberg" height="64">
-			<h2>Gutenberg</h2>
+			<!-- <img src="gutenberg.png" alt="Gutenberg" height="64"> -->
+			<!-- <h5>Gutenberg</h5> -->
 			<p>
 				<small>
-					<em>A Meaningful Web Typography Starter Kit</em><br>
+					<!-- <em>A Meaningful Web Typography Starter Kit</em><br> -->
 					Handcrafted by <a href="http://matejlatin.co.uk" onclick="ga('send', 'event', 'Links', 'matejlatin.co.uk');" target="_blank">Matej Latin</a>.
 				</small>
 			</p>

diff --git a/src/style/_gutenberg-responsive.scss b/src/style/_gutenberg-responsive.scss
@@ -242,4 +242,8 @@
 	.img-spacing {
 		@include margin-top(9);
 	}
+
+	.sticker {
+		max-width: 428px;
+	}
 }
diff --git a/src/style/gutenberg.css b/src/style/gutenberg.css
diff --git a/src/style/gutenberg.css.map b/src/style/gutenberg.css.map
diff --git a/sticker.jpg b/sticker.jpg