From d64bbf305d43cfbea23386aa968cc0e76f093566 Mon Sep 17 00:00:00 2001
From: Jack Lukic <jack@quirky.com>
Date: Thu, 18 Apr 2013 18:06:19 -0400
Subject: [PATCH] aesthetic changes, adds responsive styles

---
 docs/button.html             |  3 +--
 docs/javascript/example.js   |  2 ++
 docs/module.html             |  4 ++--
 docs/stylesheets/example.css | 22 ++++++++++++++++++++--
 src/ui/flat/icons.css        | 10 +++++-----
 src/ui/flat/panel.css        |  2 --
 6 files changed, 30 insertions(+), 13 deletions(-)

diff --git a/docs/button.html b/docs/button.html
index 1ac90f561..2d198aa3a 100755
--- a/docs/button.html
+++ b/docs/button.html
@@ -109,7 +109,7 @@
   <div class="ui blue menu button">Menu</div>
 </div>
 <div class="segment">
-  <div class="text">
+  <div class="container">
   <h1>Button</h1>
   <p>Semantic is a set of standards designed to make front end development less arbitrary. This is the definition of a button.</p>
   </div>
@@ -117,7 +117,6 @@
 <div class="main container">
 
   <div class="peek">
-    <div class="top attached ui header">Overview</div>
     <div class="ui large vertical pointing bottom attached panel">
       <li class="active">Standard</li>
       <li>States</li>
diff --git a/docs/javascript/example.js b/docs/javascript/example.js
index ef9bbff0f..5e30a22d9 100755
--- a/docs/javascript/example.js
+++ b/docs/javascript/example.js
@@ -25,6 +25,7 @@ shape.ready = function() {
 
     peek: function() {
       $('html, body')
+        .stop()
         .animate({
           scrollTop: $waypoints.eq( $peekMenu.index( $(this) ) ).offset().top - 90
         }, 500, function(){
@@ -71,6 +72,7 @@ shape.ready = function() {
               ? ($waypoints.index(this) - 1)
               : 0
         ;
+        console.log(index, $waypoints.index(this));
         $peekMenu
           .removeClass('active')
           .eq( index )
diff --git a/docs/module.html b/docs/module.html
index 7b6a024ee..de282c11c 100755
--- a/docs/module.html
+++ b/docs/module.html
@@ -82,7 +82,7 @@
         <i class="icon left-dir"></i>
       </div>
       <div class="section dropdown item">
-        1 of 2
+        1 of 5
         <div class="menu">
           <div class="active item">1. Introduction</div>
           <div class="item">2. Download</div>
@@ -100,7 +100,7 @@
   <div class="ui blue menu button">Menu</div>
 </div>
 <div class="segment">
-  <div class="text">
+  <div class="container">
     <h1>Semantic</h1>
     <p>UI is the DNA of the web. Semantic empowers designers and developers by creating a shared vocabulary for UI.</p>
   </div>
diff --git a/docs/stylesheets/example.css b/docs/stylesheets/example.css
index a0d9dafaa..2317157bb 100755
--- a/docs/stylesheets/example.css
+++ b/docs/stylesheets/example.css
@@ -65,8 +65,7 @@ a:hover {
   padding: 50px 0px 5px;
   border-bottom: 1px solid #DDDDDD;
 }
-#example h1 .text {
-  width: 800px;
+#example h1 {
   margin: 0px auto;
 }
 #example h1:first-child {
@@ -179,4 +178,23 @@ a:hover {
   top: 75px;
   left: 50%;
   margin-left: -630px;
+}
+
+
+@media only screen and (max-width : 1320px) {
+
+  #example .container {
+    width: auto;
+    margin: 0px 0px 0px 355px;
+  }
+
+}
+
+
+@media only screen and (max-width : 1540px) {
+
+  #example .container {
+    width: 600px;
+  }
+
 }
\ No newline at end of file
diff --git a/src/ui/flat/icons.css b/src/ui/flat/icons.css
index 31a9ec6e0..c58341dee 100755
--- a/src/ui/flat/icons.css
+++ b/src/ui/flat/icons.css
@@ -4,12 +4,12 @@
 
 @font-face {
   font-family: 'Icons';
-  src: url("..//fonts/icons.eot");
+  src: url(../fonts/icons.eot);
   src:
-    url("../fonts/icons.eot?#iefix") format('embedded-opentype'),
-    url("../fonts/icons.woff") format('woff'),
-    url("../fonts/icons.ttf") format('truetype'),
-    url("../fonts/icons.svg#icons") format('svg')
+    url(../fonts/icons.eot?#iefix) format('embedded-opentype'),
+    url(../fonts/icons.woff) format('woff'),
+    url(../fonts/icons.ttf) format('truetype'),
+    url(../fonts/icons.svg#icons) format('svg')
   ;
   font-weight: normal;
   font-style: normal;
diff --git a/src/ui/flat/panel.css b/src/ui/flat/panel.css
index 16d33c31c..b20a2f8f7 100755
--- a/src/ui/flat/panel.css
+++ b/src/ui/flat/panel.css
@@ -29,7 +29,6 @@
   vertical-align: middle;
 
   font-size: 13px;
-  font-weight: bold;
 
   color: #555555;
 
@@ -490,7 +489,6 @@
 }
 .large.ui.panel li {
   font-size: 15px;
-  font-weight: bold;
   padding: 16px 35px;
 }
 .large.vertical.ui.panel li.active {