summary refs log tree commit diff stats
diff options
context:
space:
mode:
-rw-r--r--todo.txt2
-rw-r--r--tools/nimweb.nim14
-rw-r--r--tools/website.tmpl213
-rw-r--r--web/assets/images/bg.jpgbin0 -> 94894 bytes
-rw-r--r--web/assets/images/foot.pngbin0 -> 784 bytes
-rw-r--r--web/assets/images/glow-arrow.pngbin0 -> 8657 bytes
-rw-r--r--web/assets/images/glow-line.pngbin0 -> 2261 bytes
-rw-r--r--web/assets/images/head-link.pngbin0 -> 203 bytes
-rw-r--r--web/assets/images/head-link_hover.pngbin0 -> 799 bytes
-rw-r--r--web/assets/images/head.pngbin0 -> 171 bytes
-rw-r--r--web/assets/images/logo.pngbin101053 -> 116562 bytes
-rw-r--r--web/assets/images/mascot.pngbin0 -> 18022 bytes
-rw-r--r--web/assets/images/more-links_editors.pngbin0 -> 852 bytes
-rw-r--r--web/assets/images/more-links_forum.pngbin0 -> 858 bytes
-rw-r--r--web/assets/images/more-links_github.pngbin0 -> 713 bytes
-rw-r--r--web/assets/images/more-links_nimbuild.pngbin0 -> 724 bytes
-rw-r--r--web/assets/images/quotes.pngbin0 -> 979 bytes
-rw-r--r--web/assets/images/sidebar.pngbin971 -> 109579 bytes
-rw-r--r--web/assets/images/slideshow-nav.pngbin0 -> 416 bytes
-rw-r--r--web/assets/images/slideshow-nav_active.pngbin0 -> 673 bytes
-rw-r--r--web/assets/images/tabEnd.pngbin0 -> 194 bytes
-rw-r--r--web/assets/style.css750
-rw-r--r--web/community.txt161
-rw-r--r--web/documentation.txt52
-rw-r--r--web/index.txt16
-rw-r--r--web/learn.txt44
-rw-r--r--web/news.txt16
-rw-r--r--web/nim.ini6
-rw-r--r--web/question.txt204
-rw-r--r--web/ticker.txt51
30 files changed, 1045 insertions, 484 deletions
diff --git a/todo.txt b/todo.txt
index 5b0d00e16..d301acdc3 100644
--- a/todo.txt
+++ b/todo.txt
@@ -1,8 +1,6 @@
 version 0.10
 ============
 
-  Repetition renders the ridiculous reasonable.
-
 - document 'converter'
 - document the tables module better
 
diff --git a/tools/nimweb.nim b/tools/nimweb.nim
index 46c1d0d85..6fc946552 100644
--- a/tools/nimweb.nim
+++ b/tools/nimweb.nim
@@ -418,14 +418,14 @@ proc main(c: var TConfigData) =
       quit("[Error] cannot write file: " & outfile)
     removeFile(temp)
   copyDir("web/assets", "web/upload/assets")
-  buildJS("web/upload")
+  #buildJS("web/upload")
   buildNewsRss(c, "web/upload")
-  buildAddDoc(c, "web/upload")
-  buildDocSamples(c, "web/upload")
-  buildDoc(c, "web/upload")
-  buildDocSamples(c, "doc")
-  buildDoc(c, "doc")
-  buildPdfDoc(c, "doc")
+  #buildAddDoc(c, "web/upload")
+  #buildDocSamples(c, "web/upload")
+  #buildDoc(c, "web/upload")
+  #buildDocSamples(c, "doc")
+  #buildDoc(c, "doc")
+  #buildPdfDoc(c, "doc")
 
 var c: TConfigData
 initConfigData(c)
diff --git a/tools/website.tmpl b/tools/website.tmpl
index f3cacdb64..b4dd2631c 100644
--- a/tools/website.tmpl
+++ b/tools/website.tmpl
@@ -1,27 +1,24 @@
 #! stdtmpl | standard
 #proc generateHTMLPage(c: var TConfigData, currentTab, content, rss: string): string = 
 #  result = ""
-<!doctype html>
+<!DOCTYPE html>

 <html>
+  <head>

+    <meta http-equiv="content-type" content="text/html; charset=utf-8">

+    <title>$c.projectTitle</title>

+    <link rel="stylesheet" type="text/css" href="assets/style.css" />
 
-<head>
-  <title>$c.projectTitle</title>
-  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
-  <link rel="stylesheet" type="text/css" href="assets/style.css" />
+    <link rel="shortcut icon" href="http://reign-studios.net/philipwitte/nim/favicon.ico">

   #if len(rss) > 0:
-  <link href="$rss" title="Recent changes" type="application/atom+xml" rel="alternate">
-  #end fi
-</head>
-
-<body>
-  <div id="site">
-    <!-- site_head -->
-    <div id="site_head">
-      <div id="logo"></div>
-    </div>
-
-    <!-- site_neck -->
-    <div id="site_neck">
+    <link href="$rss" title="Recent changes" type="application/atom+xml" rel="alternate">
+  #end if
+  </head>

+  <body>

+    <header id="head">

+      <div class="page-layout tall">

+        <div id="head-logo"></div>

+        <a id="head-logo-link" href="http://reign-studios.net/philipwitte/nim/home.htm"></a>

+        <nav id="head-links">
       #for i in 0.. c.tabs.len-1:
       #  var name = c.tabs[i].key
       #  var t = c.tabs[i].val
@@ -32,48 +29,124 @@
         #end if
         href="${t}.html" title = "$c.projectName - $name">$name</a>
       #end for
-    </div>
+        </nav>

+      </div>

+    </header>

 
-    <!-- site_body -->
-    <div id="site_body">
+#  if currentTab == "index":
+    <section id="neck" class="home">
+#  else:
+    <section id="neck">
+#  end

+      <div class="page-layout tall">

+        <div id="glow-arrow"></div>
 
-      <!-- sidebar_wrapper -->
-      <div id="sidebar_wrap">
-        <div id="sidebar">
-          <div id="sidebar_head"></div>
-          <h2>Latest News</h2>
-#  if len(c.ticker) > 0:
-          $c.ticker
-#  end if
+#  if currentTab == "index":

+        <div id="slideshow">

+          <!-- slides -->
+          <div id="slide0" class="">

+            <div>

+              <h2>nim looks like this..</h2>

+<pre><span class="cmt"># compute average line length</span>

+<span class="kwd">var</span>

+<span class="tab">  </span>sum = <span class="val">0</span>

+<span class="tab end">  </span>count = <span class="val">0</span>

+

+<span class="kwd">for</span> line <span class="kwd">in</span> stdin.lines:

+<span class="tab">  </span>sum += line.len

+<span class="tab end">  </span>count += <span class="val">1</span>

+

+echo(<span class="val">"Average line length: "</span>,

+  <span class="kwd">if</span> count: sum / count <span class="kwd">else</span>: <span class="val">0</span>)

+</pre>

+            </div>

+            <div>

+               <h2>..and this...</h2>

+<pre><span class="cmt"># create and greet someone</span>

+<span class="kwd">type</span> <span class="def">Person</span> = <span class="typ">object</span>

+<span class="tab">  </span>name: <span class="typ">string</span>

+<span class="tab end">  </span>age: <span class="typ">int</span>

+

+<span class="kwd">proc</span> <span class="def">greet</span>(p:<span class="typ">Person</span>) =

+<span class="tab">  </span>echo <span class="val">"Hi, I'm "</span>, p.name, <span class="val">"."</span>

+<span class="tab end">  </span>echo <span class="val">"I am "</span>, p.age, <span class="val">" years old."</span>

+

+<span class="kwd">var</span> p = <span class="typ">Person</span>(name:<span class="val">"Jon"</span>, age:<span class="val">18</span>)

+p.greet() <span class="cmt"># or greet(p)</span>

+</pre>

+             </div>

+           </div>  <!-- slide0 -->
+           <div id="slide1" class="active">
+        #let quoteIdx = if c.quotations.hasKey(currentTab): currentTab else: "index"
+             <div class="quote-image"></div>
+               <p class="quote">
+                 ${c.quotations[quoteIdx].quote}
+                 <br>
+                 <b style="float: right">-- ${c.quotations[quoteIdx].author}</b>
+               </p>
+               <br/>
+             </div>

+           </div>

+        <div id="slideshow-nav">

+          <div id="slideControl0" onclick="slideshow_click(0)"></div>

+          <div id="slideControl1" onclick="slideshow_click(1)" class="active"></div>

+        </div>
+#  end

+        <aside id="sidebar">

 
 #  if len(c.links) > 0:
-          <h2>More Links</h2>
+          <h3>More Links</h3>
+          <div id="sidebar-links">
 #         for i in 0..c.links.len-1:
-          <a class="link" href="${c.links[i].val}" id="${c.links[i].id}">${c.links[i].key}</a>
+          <a href="${c.links[i].val}" id="${c.links[i].id}">${c.links[i].key}</a>
 #         end for
+          </div>
 #  end if
-        </div>
-      </div>
-      <!-- page -->
-      <div id="page">
-        #if c.quotations.hasKey(currentTab):
-          <div class="quote-image"></div>
-          <p class="quote">
-            ${c.quotations[currentTab].quote}
-            <br>
-            <b style="float: right">-- ${c.quotations[currentTab].author}</b>
-          </p>
-          <br/>
-        #end if
-      
-        $content
-      </div>
-    </div>
-    <!-- site_foot -->
-    <div id="site_foot">
-       <div id="legal">Copyright &copy; 2014 - Andreas Rumpf &amp; Contributors - All rights reserved - <a href="http://reign-studios.com/philipwitte/">Design by Philip Witte</a></div>
-    </div>
-  </div>
+					<h3 class="blue">Latest News</h3>

+					<div id="sidebar-news">
+#  if len(c.ticker) > 0:
+          $c.ticker
+#  end if

+					</div>

+				</aside>

+			</div>

+		</section>

+
+		<section id="body">

+			<div id="body-border"></div>

+			<div id="glow-line"></div>

+			<div class="page-layout">

+				<article id="content" class="page">
+				$content

+				</article>

+			</div>

+		</section>

+

+		<!--- #foot --->

+		<footer id="foot" class="home">

+			<div class="page-layout tall">

+				<div id="foot-links">

+					<div>

+						<h4>Documentation</h4>

+						<a href="documentation.html">Stable Documentation</a>

+					<!--	<a href="">Development Documentation</a> -->

+						<a href="https://github.com/Araq/Nimrod">Github Issues &amp; Requests</a>

+					</div>

+					<div>

+						<h4>Community</h4>

+						<a href="http://forum.nim-lang.org">User Forum</a>

+            <a href="http://webchat.freenode.net/?channels=nimlang">Online IRC</a>

+            <a href="http://irclogs.nim-lang.org/">IRC Logs</a>

+					</div>

+				</div>

+				<div id="foot-legal">

+					<h4>Written in Nim - Powered by <a href="#">Jester</a></h4>

+					Web Design by <a href="#">Philip Witte</a> &amp; <a href="#">Dominik Picheta</a><br>

+					Copyright © 2014 - <a href="#">Andreas Rumpf</a> &amp; <a href="#">Contributors</a>

+				</div>

+			</div>

+		</footer>

+

   <script>
     (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
     (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
@@ -83,6 +156,40 @@
     ga('create', 'UA-48159761-1', 'nim-lang.org');
     ga('send', 'pageview');
 
+var timer;
+var prevIndex = 0;
+
+function setSlideShow(index, short) {
+  if (index > 1) index = 0;
+  for (var i = 0; i < 10; ++i) {
+    var x = document.getElementById("slide"+i);
+    if (!x) break;
+    x.className = "";
+    document.getElementById("slideControl"+i).className = "";
+  }
+  document.getElementById("slide"+index).className = "active";
+  document.getElementById("slideControl"+index).className = "active";
+  prevIndex = index;
+  startTimer(short ? 8000 : 32000);
+}
+
+function nextSlide() { setSlideShow(prevIndex + 1, true); }
+function startTimer(t) { timer = setTimeout(nextSlide, t); }
+
+function slideshow_enter() { clearTimeout(timer); }
+function slideshow_exit () { startTimer(16000); }
+
+function slideshow_click(index) {
+  clearTimeout(timer);
+  setSlideShow(index, false);
+}
+
+window.onload = function() {
+  var slideshow = document.getElementById("slideshow");
+  slideshow.onmouseenter = slideshow_enter;
+  slideshow.onmouseleave = slideshow_exit;
+  startTimer(8000);
+};
   </script>
 </body>
 </html>
diff --git a/web/assets/images/bg.jpg b/web/assets/images/bg.jpg
new file mode 100644
index 000000000..4e33a79ce
--- /dev/null
+++ b/web/assets/images/bg.jpg
Binary files differdiff --git a/web/assets/images/foot.png b/web/assets/images/foot.png
new file mode 100644
index 000000000..dc2561cf3
--- /dev/null
+++ b/web/assets/images/foot.png
Binary files differdiff --git a/web/assets/images/glow-arrow.png b/web/assets/images/glow-arrow.png
new file mode 100644
index 000000000..436d32f03
--- /dev/null
+++ b/web/assets/images/glow-arrow.png
Binary files differdiff --git a/web/assets/images/glow-line.png b/web/assets/images/glow-line.png
new file mode 100644
index 000000000..6607bdee9
--- /dev/null
+++ b/web/assets/images/glow-line.png
Binary files differdiff --git a/web/assets/images/head-link.png b/web/assets/images/head-link.png
new file mode 100644
index 000000000..d97cba5b8
--- /dev/null
+++ b/web/assets/images/head-link.png
Binary files differdiff --git a/web/assets/images/head-link_hover.png b/web/assets/images/head-link_hover.png
new file mode 100644
index 000000000..27edf3b05
--- /dev/null
+++ b/web/assets/images/head-link_hover.png
Binary files differdiff --git a/web/assets/images/head.png b/web/assets/images/head.png
new file mode 100644
index 000000000..009f86728
--- /dev/null
+++ b/web/assets/images/head.png
Binary files differdiff --git a/web/assets/images/logo.png b/web/assets/images/logo.png
index 31ee0a6e1..85d3d2e51 100644
--- a/web/assets/images/logo.png
+++ b/web/assets/images/logo.png
Binary files differdiff --git a/web/assets/images/mascot.png b/web/assets/images/mascot.png
new file mode 100644
index 000000000..9beb62c01
--- /dev/null
+++ b/web/assets/images/mascot.png
Binary files differdiff --git a/web/assets/images/more-links_editors.png b/web/assets/images/more-links_editors.png
new file mode 100644
index 000000000..f5970ff1f
--- /dev/null
+++ b/web/assets/images/more-links_editors.png
Binary files differdiff --git a/web/assets/images/more-links_forum.png b/web/assets/images/more-links_forum.png
new file mode 100644
index 000000000..f33277777
--- /dev/null
+++ b/web/assets/images/more-links_forum.png
Binary files differdiff --git a/web/assets/images/more-links_github.png b/web/assets/images/more-links_github.png
new file mode 100644
index 000000000..4a6a844f4
--- /dev/null
+++ b/web/assets/images/more-links_github.png
Binary files differdiff --git a/web/assets/images/more-links_nimbuild.png b/web/assets/images/more-links_nimbuild.png
new file mode 100644
index 000000000..473fbe4cd
--- /dev/null
+++ b/web/assets/images/more-links_nimbuild.png
Binary files differdiff --git a/web/assets/images/quotes.png b/web/assets/images/quotes.png
new file mode 100644
index 000000000..0d75b4cc2
--- /dev/null
+++ b/web/assets/images/quotes.png
Binary files differdiff --git a/web/assets/images/sidebar.png b/web/assets/images/sidebar.png
index 77624480e..142db93cf 100644
--- a/web/assets/images/sidebar.png
+++ b/web/assets/images/sidebar.png
Binary files differdiff --git a/web/assets/images/slideshow-nav.png b/web/assets/images/slideshow-nav.png
new file mode 100644
index 000000000..fbfff3e5d
--- /dev/null
+++ b/web/assets/images/slideshow-nav.png
Binary files differdiff --git a/web/assets/images/slideshow-nav_active.png b/web/assets/images/slideshow-nav_active.png
new file mode 100644
index 000000000..525caf355
--- /dev/null
+++ b/web/assets/images/slideshow-nav_active.png
Binary files differdiff --git a/web/assets/images/tabEnd.png b/web/assets/images/tabEnd.png
new file mode 100644
index 000000000..a94af90f1
--- /dev/null
+++ b/web/assets/images/tabEnd.png
Binary files differdiff --git a/web/assets/style.css b/web/assets/style.css
index 91bb4bd8a..60768f9e2 100644
--- a/web/assets/style.css
+++ b/web/assets/style.css
@@ -1,210 +1,566 @@
+
 * { cursor:default; }
-a, a * { cursor:pointer; text-decoration:none; }
+a, a * { cursor:pointer; }
 
-html, body {
-  margin:0;
-  padding:0;
-  width:100%;
-  height:100%;
-  background:#121220;
-  font:14px arial;
-  letter-spacing:1px;
-  line-height:22px;
-}
+html { margin:0; overflow-x:auto; }
+body {
+	overflow-x:hidden;
+	min-width:1030px;
+	margin:0;
+	font:13pt "arial";
+	background:#152534 url("images/bg.jpg") no-repeat fixed center top; }
+
+pre { color:#5997AF;}
+pre, pre * { cursor:text; }
+pre .cmt { color:#6D6D6D; font-style:italic; }
+pre .kwd { color:#43A8CF; font-weight:bold; }
+pre .typ { color:#128B7D; font-weight:bold; }
+pre .atr { color:#128B7D; font-weight:bold; font-style:italic; }
+pre .def { color:#CAD6E4; font-weight:bold; font-style:italic; }
+pre .prg { color:#854D6A; font-weight:bold; font-style:italic; }
+pre .val { color:#8AB647; font-style:italic; }
+pre .tab { border-left:1px dotted rgba(67,168,207,0.4); }
+pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
+
+.tall { height:100%; }
+.pre { padding:0 5px; font:11pt monospace; background:rgba(255,255,255,.15); border-radius:3px; }
+
+.page-layout { margin:0 auto; width:1000px; }
+.docs-layout { margin:0 40px; }
+.talk-layout { margin:0 40px; }
+.wide-layout { margin:0 auto; }
+
+#head { height:100px; background:url("images/head.png") repeat-x bottom; }
+#head.docs { margin-left:280px; background:rgba(0,0,0,.25) url("images/head-fade.png") no-repeat right top; }
+#head > div { position:relative }
+	
+	#head-logo {
+		position:absolute;
+		left:-390px;
+		top:0;
+		width:917px;
+		height:268px;
+		pointer-events:none;
+		background:url("images/logo.png") no-repeat; }
+	#head.docs #head-logo { left:-381px; position:fixed; }
+	#head.forum #head-logo { left:-370px; }
+	
+  #head-logo-link {
+    position:absolute;
+    display:block;
+    top:10px;
+    left:10px;
+    width:236px;
+    height:85px; }
+  #head.docs #head-logo-link { left:-260px; }
+  #head.forum #head-logo-link { left:30px; }
+	
+	#head-links { position:absolute; right:0; bottom:13px; }
+	#head.docs #head-links,
+	#head.forum #head-links { right:20px; }
+	#head-links > a {
+		display:block;
+		float:left;
+		padding:10px 25px 25px 25px;
+		color:rgba(255,255,255,.5);
+		font-size:14pt;
+		text-decoration:none;
+		letter-spacing:1px;
+		background:url("images/head-link.png") no-repeat center bottom;
+		transition:
+			color 0.3s ease-in-out,
+			text-shadow 0.4s ease-in-out; }
+	#head-links > a:hover,
+	#head-links > a.active {
+		color:#1cb3ec;
+		text-shadow:0 0 4px rgba(28,179,236,.8);
+		background-image:url("images/head-link_hover.png"); }
 
-#site { z-index:0; position:relative; margin:0 auto; width:960px; }
-#site > dive { position:relative; }
+	#head-banner { width:200px; height:100px; background:#000; }
 
-  /* site_head */
-  #site_head { z-index:0; height:200px; }
+#neck { z-index:0; height:40px; }
+#neck.home { height:370px; }
+#neck > div { position:relative }
+	
+	#glow-arrow {
+		position:absolute;
+		top:-9px;
+		left:0;
+		right:-16px;
+		height:48px;
+		background:url("images/glow-arrow.png") no-repeat right; }
+  glow-arrow.docs { left:280px; }
+	
+	#glow-line-vert {
+		position:fixed;
+		top:100px;
+		left:280px;
+		width:3px;
+		height:844px;
+		background:url("images/glow-line-vert.png") no-repeat; }
+	
+	#slideshow { position:absolute; top:10px; left:10px; width:700px; }
+	#slideshow > div { visibility:hidden; opacity:0; position:absolute; transition:visibility 0s linear 1s, opacity 1s ease-in-out; }
+	#slideshow > div.active { visibility:visible; opacity:1; transition-delay:0s; }
+	#slideshow > div.init { transition-delay:0s; }
+	#slideshow-nav { z-index:3; position:absolute; top:110px;; right:-12px; }
+	#slideshow-nav > div { margin:5px 0; width:23px; height:23px; background:url("images/slideshow-nav.png") no-repeat; }
+	#slideshow-nav > div:hover { background-image:url("images/slideshow-nav_active.png"); opacity:0.5; }
+	#slideshow-nav > div.active { background-image:url("images/slideshow-nav_active.png"); opacity:1; }
+		
+		#slide0 { margin:30px 0 0 10px; }
+		#slide0 > div { float:left; width:320px; font:10pt monospace; }
+		#slide0 > div:first-child { margin:0 40px 0 0; }
+		#slide0 > div > h2 { margin:0 0 5px 0; color:rgba(162,198,223,.78); }
+		#slide0 > div > pre {
+			margin:0;
+			padding:15px 10px;
+			line-height:14pt;
+			background:rgba(0,0,0,.4);
+			border-left:8px solid rgba(0,0,0,.3);
+			box-shadow:1px 2px 16px rgba(28,180,236,.4); }
+		
+		#slide1 { margin-top:50px; }
+		#slide1 > p {
+			padding:40px 20px 0 20px;
+			font-style:italic;
+			color:rgba(162,198,223,.78);
+			letter-spacing:1px;
+			line-height:25pt;
+			background:url("images/quotes.png") top left no-repeat; }
+		#slide1 > div {
+			float:right;
+			margin-right:40px;
+			font-style:italic;
+			font-weight:bold;
+			color:rgba(93,155,199,.44); }
+	
+	#sidebar {
+		z-index:2;
+		position:absolute;
+		top:5px; right:0;
+		width:275px;
+		height:726px;
+		padding:210px 0 0 0;
+		background:url("images/sidebar.png") no-repeat; }
+	#sidebar > h3 { margin:0 30px 0 30px; color:rgba(255,255,255,.5); }
+	#sidebar > h3.blue { color:rgba(28,180,236,.5); }
+	#sidebar-links,
+	#sidebar-news {
+		margin:10px 30px 50px 30px;
+		padding:10px 0;
+		background:rgba(0,0,0,.6); }
+	#sidebar-links { box-shadow:1px 2px 12px rgba(255,255,255,.4); }
+	#sidebar-news { box-shadow:1px 2px 12px rgba(28,180,236,.6); }
+	#sidebar-links > a {
+		display:block;
+		margin-left:15px;
+		padding:12px 20px 12px 45px;
+		font-weight:bold;
+		text-decoration:none;
+		letter-spacing:1px;
+		color:rgba(255,255,255,.4);
+		transition:
+			color 0.1s ease-in-out,
+			text-shadow 0.2s ease-in-out; }
+	#sidebar-news > a { transition: color 0.3s ease-in-out; }
+	#sidebar-news > a > h4 { transition: color 0.1s ease-in-out, text-shadow 0.2s ease-in-out; }
+	#sidebar-links > a:hover { color:#fff; text-shadow:0 0 6px #fff; }
+	#sidebar-news > a { display:block; padding:15px; color:rgba(255,255,255,.4); text-decoration:none; }
+	#sidebar-news > a > h4 { margin:0 0 5px 0; color:rgba(28,180,236,.5); }
+	#sidebar-news > a:hover > h4 { margin:0 0 5px 0; color:rgba(28,180,236,.8); text-shadow:0 0 6px rgba(28,180,236,.6); }
+	#sidebar-news > a:hover { color:rgba(255,255,255,1); }
+	#sidebar-news > a.blue { color:rgba(28,180,236,.5); font-weight:bold; }
+	#sidebar-news > a.blue:hover { color:#fff; }
+		
+		#link_forum { background:url("images/more-links_forum.png") no-repeat left center; }
+		#link_github { background:url("images/more-links_github.png") no-repeat left center; }
+		#link_editors { background:url("images/more-links_editors.png") no-repeat left center; }
+		#link_aporia { background:url("images/more-links_editors.png") no-repeat left center; }
+		#link_nimbuild { background:url("images/more-links_nimbuild.png") no-repeat left center; }
+	
+	#overview-bg {
+		position:fixed;
+		top:0;
+		bottom:0;
+		left:0;
+		width:280px;
+		background:rgba(0,0,0,0.25); }
+	#overview {
+		z-index:3;
+		position:fixed;
+		overflow:auto;
+		top:115px;
+		bottom:20px;
+		left:20px;
+		width:245px; }
+	#overview::-webkit-scrollbar { width:5px; }
+	#overview::-webkit-scrollbar-track { border-radius:2px; background:rgba(255,255,255,.03); }
+	#overview::-webkit-scrollbar-thumb { border-radius:2px; background:rgba(28,179,236,.5); }
+	#overview > div { overflow:auto; margin-bottom:40px; }
+	#overview a {
+		display:block;
+		padding:0 10px;
+		margin:2px 5px 2px 0;
+		color:rgba(255,255,255,.6);
+		background:rgba(255,255,255,0.03);
+    border-radius:2px;
+		letter-spacing:1px;
+		text-decoration:none; }
+	#overview a:hover { color:#fff; background:rgba(255,255,255,0.05); }
+	#overview > .types a { border-left:2px solid rgba(28,179,236,.4); }
+	#overview > .procs a { border-left:2px solid rgba(255,223,53,.4); }
+	#overview > .iters a { border-left:2px solid rgba(255,134,53,.4); }
+	#overview > div > h4 {
+		margin:0 5px 10px 0;
+		padding:5px 10px;
+		letter-spacing:1px;
+		color:#fff;
+		border-left:2px solid #fff;
+    border-radius:2px;
+		background:rgba(255,255,255,0.1); }
+	#overview > .types h4 { color:#1cb3ec; border-color:#1cb3ec; }
+	#overview > .procs h4 { color:#ffdf35; border-color:#ffdf35; }
+	#overview > .iters h4 { color:#ff8635; border-color:#ff8635; }
+	#overview h5 {
+		color:rgba(28,179,236,.6);
+		margin:10px 0 5px 0;
+		padding:5px 5px;
+		letter-spacing:1px; }
+
+#body { z-index:1; position:relative; background:rgba(220,231,248,.6); }
+#body.docs { margin:0 40px 20px 320px; }
+#body.forum { margin:0 40px 20px 40px; }
+	
+	#body-border {
+		position:absolute;
+		top:-25px;
+		left:0;
+		right:0;
+		height:35px;
+		background:rgba(0,0,0,.25); }
+	
+	#body-border-left {
+		position:absolute;
+		left:-25px;
+		top:-25px;
+		bottom:-25px;
+		width:35px;
+		background:rgba(0,0,0,.25); }
+	
+	#body-border-right {
+		position:absolute;
+		right:-25px;
+		top:-25px;
+		bottom:-25px;
+		width:35px;
+		background:rgba(0,0,0,.25); }
+	
+	#body-border-bottom {
+		position:absolute;
+		left:10px;
+		right:10px;
+		bottom:-25px;
+		height:35px;
+		background:rgba(0,0,0,.25); }
+	
+	#body.docs #body-border,
+	#body.forum #body-border { left:10px; right:10px; }
+	
+	#glow-line {
+		position:absolute;
+		top:-27px;
+		left:100px;
+		right:-25px;
+		height:3px;
+		background:url("images/glow-line.png") no-repeat left; }
+	#glow-line-bottom {
+		position:absolute;
+		bottom:-27px;
+		left:-25px;
+		right:100px;
+		height:3px;
+		background:url("images/glow-line2.png") no-repeat right; }
+	
+	#content { padding:40px 0; line-height:150%; }
+	#content.page { width:680px; min-height:800px; padding-left:20px; }
+	#content h1 { font-size:20pt; letter-spacing:1px; color:rgba(0,0,0,.75); }
+	#content h2 { font-size:16pt; letter-spacing:1px; color:rgba(0,0,0,.7); margin-top:40px; }
+	#content p { text-align:justify; color:rgba(0,0,0,.8); }
+	#content a { color:#CEDAE9; text-decoration:none; }
+	#content a:hover { color:#fff;  }
+	#content ul { padding-left:20px; }
+	#content li { margin-bottom:10px; text-align:justify; }
+	
+		#body.docs #content > div { margin-top:40px; padding-top:40px; border-top:1px dashed rgba(0,0,0,.25); }
+		#body.docs #content > div:first-child { margin-top:0; padding-top:0; border:none; }
+		#body.docs #content > div > h3 {
+			color:#fff;
+			margin:0 0 10px 0;
+			padding:10px 20px;
+			letter-spacing:1px;
+			border-left:8px solid #fff;
+      border-radius:3px;
+			background:rgba(0,0,0,.7);
+			box-shadow:1px 3px 12px rgba(0,0,0,.4); }
+		#body.docs #content > #types-wrap > h3 { color:#1cb3ec; border-color:#1cb3ec; }
+		#body.docs #content > #procs-wrap > h3 { color:#ffdf35; border-color:#ffdf35; }
+		#body.docs #content > #iters-wrap > h3 { color:#ff8635; border-color:#ff8635; }
+		#body.docs #content > div > div > div {
+			overflow:auto;
+			margin:10px 0;
+			border-left:8px solid #fff;
+      border-radius:3px;
+			background:rgba(0,0,0,.1); }
+		#body.docs #content > #types-wrap > div > div { border-color:rgba(28,179,236,.5); }
+		#body.docs #content > #procs-wrap > div > div { border-color:rgba(255,223,53,.5); }
+		#body.docs #content > #iters-wrap > div > div { border-color:rgba(255,134,53,.5); }
+		#body.docs #content > #procs-wrap > div > div.overload-head { margin-bottom:0; }
+		#body.docs #content > #procs-wrap > div > div.overload-tail { margin-top:0; border-top:1px dashed rgba(255,223,53,.5); }
+		#body.docs #content > #procs-wrap > div > div.overload { margin-top:0; margin-bottom:0; border-top:1px dashed rgba(255,223,53,.5); }
+		#body.docs #content > #iters-wrap > div > div.overload-head { margin-bottom:0; }
+		#body.docs #content > #iters-wrap > div > div.overload-tail { margin-top:0; border-top:1px dashed rgba(255,134,53,.5); }
+		#body.docs #content > #iters-wrap > div > div.overload { margin-top:0; margin-bottom:0; border-top:1px dashed rgba(255,134,53,.5); }
+		#body.docs #content > div > div > p { margin:20px 10px 10px 10px; }
+		
+		#body.docs #content > div > div > div > div { float:left; }
+		#body.docs #content > div > div > div > div.head { width:60%; }
+		#body.docs #content > div > div > div > div.data { width:40%; }
     
-    #logo {
-      z-index:-1;
-      position:absolute;
-      top:-35px;
-      left:-330px;
-      width:868px;
-      height:334px;
-      background:url("images/logo.png") no-repeat;
-    }
-  
-  /* site_neck */
-  #site_neck { z-index:1; float:left; width:100%; height:40px; background:url("images/site_neck.png") bottom no-repeat; }
-  
-    #site_neck > a {
-      display:block;
-      float:left;
-      margin-top:3px;
-      margin-right:10px;
-      padding:4px 20px 0 20px;
-      height:28px;
-      color:#959a9b;
-      background:#394649;
-      font-size:18px;
-    }
+    #body.docs #content > h1 > .symbol {
+      padding:0 8px;
+      border-radius:5px;
+      background:rgba(206,218,233,.4); }
+    
+		#body.docs #content > div > div > div > div.head > .sign {
+			margin:0 10px 5px 10px;
+			padding:10px 10px 0 10px;
+			font-weight:bold;
+			border-bottom:1px dashed rgba(0,0,0,.25); }
+		#body.docs #content > div > div > div > div.head > .desc {
+			padding:0 20px 10px 20px;
+			color:rgba(0,0,0,.75); }
+		#body.docs #content > div > #types > div > div.head > .sign > .symbol {
+			padding:0 5px;
+			border-radius:3px;
+			background:rgba(28,179,236,.4); }
+		#body.docs #content > div > #procs > div > div.head > .sign > .symbol {
+			padding:0 5px;
+			border-radius:3px;
+			background:rgba(255,223,53,.3); }
+		#body.docs #content > div > #iters > div > div.head > .sign > .symbol {
+			padding:0 5px;
+			border-radius:3px;
+			background:rgba(255,134,53,.3); }
+			
+		#body.docs #content > div > div > div > div.data > div {
+			margin:0 20px 5px 10px;
+			padding:10px 0 0 10px;
+			font-style:italic;
+			color:rgba(0,0,0,.6);
+			border-bottom:1px dashed rgba(0,0,0,.25); }
+		#body.docs #content > div > div > div > div.data > ul { margin:0; padding:0 10px; }
+		#body.docs #content > div > div > div > div.data > ul:last-child { margin-bottom:5px; padding-bottom:10px; }
+		#body.docs #content > div > div > div > div.data > ul .symbol { padding:0 5px; border-radius:3px; background:rgba(23,192,23,.25); }
+		#body.docs #content > div > div > div > div.data > ul.pragmas .symbol { background:rgba(106,50,145,.25); }
+		#body.docs #content > div > div > div > div.data > ul > li { margin:0; padding:0 10px; list-style:none; }
+		
+		#body.docs #content pre {
+			overflow:auto;
+			margin:10px 0;
+			padding:15px 10px;
+			font-size:10pt;
+			font-style:normal;
+			line-height:14pt;
+			background:rgba(0,0,0,.75);
+			border-left:8px solid rgba(0,0,0,.3); }
     
-    #site_neck > a:hover {
-      margin-top:0;
-      border-top:3px solid #1cb4ec;
-    }
-  
-    #site_neck > a.active {
-      margin-top:0;
-      padding-top:7px;
-      color:#fff;
-      background:#1cb4ec;
-      text-shadow:0 0 4px rgba(255,255,255,0.75);
-    }
+    #docs-sort { float:right; font-size:75%; }
+    #docs-sort > a {
+      cursor:default;
+      margin:0 0 0 10px;
+      padding:2px 10px;
+      border-radius:5px;
+      color:rgba(0,0,0,.25);
+      background:rgba(0,0,0,.1);
+      box-shadow:inset 0 1px 8px rgba(0,0,0,.4); }
+    #docs-sort > a:hover,
+    #docs-sort > a.active { color:#000; background:rgba(0,0,0,.2); }
     
-    #site_neck > a.active:hover {
+    #talk-heads { overflow:auto; margin:0 8px 0 8px; }
+    #talk-heads > div { float:left; font-size:120%; font-weight:bold; }
+    #talk-heads > .topic { width:55%; }
+    #talk-heads > .detail { width:15%; }
+    #talk-heads > .author { width:15%; }
+    #talk-heads > .reply { width:15%; }
+    #talk-heads > div > div { margin:0 10px 10px 10px; padding:0 10px 10px 10px; border-bottom:1px dashed rgba(0,0,0,0.4); }
+    #talk-heads > .topic > div { margin-left:0; }
+    #talk-heads > .author > div { margin-right:0; }
+    
+    #talk-thread  > div,
+    #talk-threads > div {
+      position:relative;
+      margin:5px 0;
+      overflow:auto;
+      border-radius:3px;
+      border:8px solid rgba(0,0,0,.8);
       border-top:none;
-    }
-  
-  /* site_body */
-  #site_body { z-index:2; float:left; clear:both; width:100%; background:#d1dbe3; }
+      border-bottom:none;
+      background:rgba(0,0,0,0.1); }
+    #talk-thread  > div:nth-child(odd) { background:rgba(255,255,255,0.1); }
+    #talk-threads > div:nth-child(odd) { background:rgba(0,0,0,0.2); }
+    #talk-thread  > div > div,
+    #talk-threads > div > div { float:left; }
+    #talk-thread  > div > div > div,
+    #talk-threads > div > div > div { margin:10px 20px; }
+    #talk-threads > div > .topic { width:55%; }
+    #talk-threads > div > .reply { width:15%; overflow:hidden; }
+    #talk-threads > div > .detail { width:15%; overflow:hidden; }
+    #talk-thread  > div > .author,
+    #talk-threads > div > .author {
+      position:absolute;
+      right:0;
+      top:0;
+      bottom:0;
+      width:15%;
+      overflow:hidden;
+      background:rgba(0,0,0,0.8); }
+    #talk-thread  > div > .author a,
+    #talk-threads > div > .author a { color:#1cb3ec !important; }
+    #talk-thread  > div > .author a:hover,
+    #talk-threads > div > .author a:hover { color:#fff !important; }
+    #talk-threads > div > .topic .pages { float:right; }
+    #talk-threads > div > .topic > div > a { font-weight:bold; }
+    #talk-threads > div > .detail > div { float:left; margin:0; }
+    #talk-threads > div > .detail > div > div { margin-left:20px; padding:10px 10px 10px 22px; }
+    #talk-threads > div > .detail > div { width:50%; }
+    #talk-threads > div > .detail > div:first-child > div { background:url("images/forum-views.png") no-repeat left; }
+    #talk-threads > div > .detail > div:last-child > div { background:url("images/forum-posts.png") no-repeat left; }
     
-    #page { position:relative; float:left; padding:20px 30px 50px 50px; width:620px; color:#343739; }
-      
-      #page h1 { margin-top:40px; line-height: 28px; }
-      #page h2 { margin-top:40px; }
-      
-      #page p { text-align:justify; }
-      
-      #page .quote-image {
-        z-index:0;
-        position:absolute;
-        top:15px;
-        left:20px;
-        width:59px;
-        height:42px;
-        background:url("images/quote.png") no-repeat;
-      }
-      
-      #page p.quote {
-        position:relative;
-        color:#6187a2;
-        font-style:italic;
-        letter-spacing:2px;
-        word-spacing:1px;
-      }
-      
-      #page pre {
-        padding:20px;
-        border-left:10px solid #8f9698;
-        background:#f3f6f8;
-        font-size:15px;
-        font-family:courier, monospace;
-        letter-spacing:0;
-        line-height:17px;
-      }
-      
-      #page span.pre {
-        background-color: #E6EDF2;
-        padding: 1pt 3pt;
-        border-radius: 2pt;
-        -moz-border-radius: 2pt;
-        -webkit-border-radius: 2pt;
-      }
-      
-      #page pre > .Comment { color:#858686; font-style:italic; }
-      #page pre > .Keyword { color:#1cb4ec; font-weight:bold; }
-      #page pre > .Operator { color:#777; }
-      #page pre > .StringLit, #page pre > .DecNumber { color:#ff7302; }
-      
-      #page li { margin-top:10px; }
-      
-      #page a:hover { text-decoration: underline; }
+    #talk-thread > div {  margin:20px 0; min-height:150px; box-shadow:1px 3px 12px rgba(0,0,0,.4) }
+    #talk-thread > div > .author > div > .avatar { margin-top:20px; }
+    #talk-thread > div > .author > div > .avatar > img { box-shadow:0 0 12px #1cb3ec; }
+    #talk-thread > div > .author > div > .name { }
+    #talk-thread > div > .topic { width:85%; padding-bottom:10px; }
+    #talk-thread > div > .topic pre {
+      overflow:auto;
+      margin:0;
+      padding:15px 10px;
+      font-size:10pt;
+      font-style:normal;
+      line-height:14pt;
+      background:rgba(0,0,0,.75);
+      border-left:8px solid rgba(0,0,0,.3); }
     
-      #page table.docutils {
-        background: none repeat scroll 0 0 #F3F6F8;
-        border-collapse: collapse;
-        font-size: 8pt;
-        text-align: left;
-        width: 480px;
-        border-spacing: 0;
-      }
-      
-      #page .docutils th {
-        border-bottom: 2px solid #1a1a1a;
-        font-size: 14px;
-        font-weight: normal;
-        padding: 8px 8px;
-      }
-      
-      #page .docutils td {
-        padding: 3px 8px;
-        color: #4d4d4d;
-      }
+    #talk-head,
+    #talk-info {
+      overflow:auto;
+      border-radius:3px;
+      border:8px solid rgba(0,0,0,.2);
+      border-top:none;
+      border-bottom:none;
+      background:rgba(0,0,0,0.1); }
+    #talk-head { margin-bottom:20px; }
+    #talk-info { margin-top:20px; }
+    #talk-head > div,
+    #talk-info > div { float:left; }
+    #talk-head > .info,
+    #talk-info > .info { width:85%; }
+    #talk-head > .user,
+    #talk-info > .user { width:15%; background:rgba(0,0,0,.2); }
+    #talk-info > .user > div > .reply { font-weight:bold; padding-left:22px; background:url("images/forum-reply.png") no-repeat left; }
+    #talk-head > div > div,
+    #talk-info > div > div { padding:5px 20px; }
+    #talk-head > .detail > div { float:left; margin:0; }
+    #talk-head > .detail > div > div { padding-left:22px; }
+    #talk-head > .detail > div:first-child > div { background:url("images/forum-views.png") no-repeat left; }
+    #talk-head > .detail > div:last-child > div { background:url("images/forum-posts.png") no-repeat left; }
     
-    #sidebar_wrap { float:right; width:260px; }
-      #sidebar {
-        z-index:0;
-        position:relative;
-        left:20px;
-        padding:0 10px 60px 10px;
-        width:200px;
-        background:#394649 url("images/sidebar.png") bottom no-repeat;
-      }
-        
-        #sidebar_head {
-          z-index:-1;
-          position:absolute;
-          top:-220px;
-          left:-30px;
-          width:282px;
-          height:400px;
-          background:url("images/sidebar_head.png") top no-repeat;
-        }
-        
-        #sidebar > h2 {
-          position:relative;
-          left:-40px;
-          margin:20px 0 0 0;
-          padding:19px 0 0 48px;
-          width:204px;
-          height:47px;
-          color:#fff;
-          background:url("images/sidebar_h2.png") no-repeat;
-          text-shadow:0 0 4px rgba(255,255,255,0.75);
-          letter-spacing:2px;
-        }
-        
-        #sidebar > .news { display:block; margin-bottom:20px; padding:0 10px; }
-        #sidebar > .news > h3 { margin:0; color:#cdd1d1; font-size:18px; letter-spacing:2px; }
-        #sidebar > .news > p { margin:0; color:#99a0a1; }
-        #sidebar > .news:hover > h3 { color:#fff; text-shadow:0 0 4px rgba(255,255,255,0.75); }
-        #sidebar > .news:hover > p { color:#eee; text-shadow:0 0 4px rgba(255,255,255,0.5); }
-        
-        #sidebar > .link {
-          display:block;
-          margin:0;
-          padding:15px 20px 0 20px;
-          height:41px;
-          color:#cdd1d1;
-          font-size:18px;
-          font-weight:bold;
-        }
-        
-        #sidebar > .link:hover {
-          color:#fff;
-          text-shadow:0 0 4px rgba(255,255,255,0.75);
-        }
-        
-        #link_forum { background:url("images/link_forum.png") top right no-repeat; }
-        #link_aporia { background:url("images/link_aporia.png") top right no-repeat; }
-        #link_nimbuild { background:url("images/link_nimbuild.png")  top right no-repeat; }
-  
-  /* site_foot */
-  #site_foot { z-index:3; clear:both; padding-top:40px; height:150px; background:url("images/site_foot.png") top no-repeat; }
+    #talk-nav { margin:20px 8px 0 8px; padding-top:10px; border-top:1px dashed rgba(0,0,0,0.4); text-align:center; }
+    #talk-nav > a.active { text-decoration:underline !important; }
     
-    #legal {
-      float:right;
-      margin-top:10px;
-      color:#88888f;
-      font-size:12px;
-      letter-spacing:1px;
-    }
+    .standout {
+      padding:5px 30px;
+      margin-bottom:20px;
+      border:8px solid rgba(0,0,0,.8);
+      border-right-width:16px;
+      border-top-width:0;
+      border-bottom-width:0;
+      border-radius:3px;
+      background:rgba(0,0,0,0.1);
+      box-shadow:1px 3px 12px rgba(0,0,0,.4); }
+    .standout h2 { margin-bottom:10px; padding-bottom:10px; border-bottom:1px dashed rgba(0,0,0,.8); }
+    .standout li { margin:0 !important; padding-top:10px; border-top:1px dashed rgba(0,0,0,.2); }
+    .standout ul { padding-bottom:5px; }
+    .standout ul.tools { list-style:url("images/docs-tools.png"); }
+    .standout ul.library { list-style:url("images/docs-library.png"); }
+    .standout ul.internal { list-style:url("images/docs-internal.png"); }
+    .standout ul.tutorial { list-style:url("images/docs-tutorial.png"); }
+    .standout ul.example { list-style:url("images/docs-example.png"); }
+    .standout li:first-child { padding-top:0; border-top:none; }
+    .standout li p { margin:0 0 10px 0 !important; line-height:130%; }
+    .standout li > a { font-weight:bold; }
     
-    #legal > a { color:#88888f; }
-    #legal > a:visited { color:#88888f; }
-    #legal > a:hover { color:#fff; }
+    .forum-user-info,
+    .forum-user-info * { cursor:help }
+
+#foot { height:150px; position:relative; top:-10px; letter-spacing:1px; }
+#foot.home { background:url("images/foot.png") repeat-x top; height:200px; }
+#foot.docs { margin-left:320px; margin-right:40px; }
+#foot.forum { margin-left:40px; margin-right:40px; }
+#foot > div { position:relative; }
+#foot.home > div { width:960px; }
+#foot h4 { font-size:11pt; color:rgba(255,255,255,.4); margin:40px 0 6px 0; }
+#foot a:hover { color:#fff; }
+	
+	#foot-links { float:left; }
+	#foot-links > div { float:left; padding:0 40px 0 0; line-height:120%; }
+	#foot-links a { display:block; font-size:10pt; color:rgba(255,255,255,.3); text-decoration:none; }
+	#foot-legal { float:right; font-size:10pt; color:rgba(255,255,255,.3); line-height:150%; text-align:right; }
+	#foot-legal a { color:inherit; text-decoration:none; }
+	#foot-legal > h4 > a { color:inherit; }
+	
+	#mascot {
+    z-index:2;
+		position:absolute;
+		top:-340px;
+		right:25px;
+		width:202px;
+		height:319px;
+		background:url("images/mascot.png") no-repeat; }
+
+
+#body pre {
+  padding:20px;
+  border-left:10px solid #8f9698;
+  background:#f3f6f8;
+  font-size:15px;
+  font-family:courier, monospace;
+  letter-spacing:0;
+  line-height:17px;
+  color: #343739;
+}
+
+#body span.pre {
+  background-color: #8396A4; /* #E6EDF2; */
+  padding: 1pt 3pt;
+  border-radius: 2pt;
+  -moz-border-radius: 2pt;
+  -webkit-border-radius: 2pt;
+}
+
+#body pre > .Comment { color:#858686; font-style:italic; }
+#body pre > .Keyword { color:#1cb4ec; font-weight:bold; }
+#body pre > .Operator { color:#777; }
+#body pre > .StringLit, #page pre > .DecNumber { color:#ff7302; }
+
+#body .docutils th {
+    border-bottom: 2px solid #1A1A1A;
+    font-weight: normal;
+    padding: 8px;
+}
+#body table.docutils {
+    border-collapse: collapse;
+    text-align: left;
+    border-spacing: 0px;
+}
diff --git a/web/community.txt b/web/community.txt
index bac5e0ada..c5b025067 100644
--- a/web/community.txt
+++ b/web/community.txt
@@ -1,97 +1,114 @@
-Forum
-=====
+Nim's Community
+===============
 
-The `Nim forum <http://forum.nim-lang.org/>`_ is the place where most 
-discussions related to the language happen. It not only includes discussions
-relating to the design of Nim but also allows for beginners to ask questions
-relating to Nim.
+.. container:: standout
 
-IRC
-====
+  Forum
+  -----
 
-Many Nim developers are a part of the
-`#nim IRC channel <http://webchat.freenode.net/?channels=nim>`_ on
-Freenode. That is the place where the rest of the discussion relating to Nim
-occurs. Be sure to join us there if you wish to discuss Nim in real-time.
-IRC is the perfect place for people just starting to learn Nim and we
-welcome any questions that you may have!
+  The `Nim forum <http://forum.nim-lang.org/>`_ is the place where most 
+  discussions related to the language happen. It not only includes discussions
+  relating to the design of Nim but also allows for beginners to ask questions
+  relating to Nim.
 
-You may also be interested in reading the
-`IRC logs <http://build.nim-lang.org/irclogs/>`_ which are an archive of all
-of the previous discussions that took place in the IRC channel.
 
-Github
-======
+.. container:: standout
 
-Nim's `source code <http://github.com/Araq/Nim>`_ is hosted on Github.
-Together with the `wiki <http://github.com/Araq/Nim/wiki>`_ and
-`issue tracker <http://github.com/Araq/Nim/issues>`_.
+  IRC
+  ----
 
-Github also hosts other projects relating to Nim. These projects are a part
-of the `nim-lang organisation <http://github.com/nim-lang>`_.
-This includes the `Babel package manager <http://github.com/nim-lang/babel>`_
-and its `package repository <http://github.com/nim-lang/packages>`_. 
+  Many Nim developers are a part of the
+  `#nim IRC channel <http://webchat.freenode.net/?channels=nim>`_ on
+  Freenode. That is the place where the rest of the discussion relating to Nim
+  occurs. Be sure to join us there if you wish to discuss Nim in real-time.
+  IRC is the perfect place for people just starting to learn Nim and we
+  welcome any questions that you may have!
 
-Twitter
-=======
+  You may also be interested in reading the
+  `IRC logs <http://irclogs.nim-lang.org/>`_ which are an archive of all
+  of the previous discussions that took place in the IRC channel.
 
-Follow us `@nimlang <http://twitter.com/nimlang>`_ for latest news about
-Nim.
 
-Reddit
-======
+.. container:: standout
 
-Subscribe to `/r/nim <http://reddit.com/r/nim>`_ for latest news about
-Nim.
+  Github
+  ------
 
-StackOverflow
-=============
+  Nim's `source code <http://github.com/Araq/Nim>`_ is hosted on Github.
+  Together with the `wiki <http://github.com/Araq/Nim/wiki>`_ and
+  `issue tracker <http://github.com/Araq/Nim/issues>`_.
 
-When asking a question relating to Nim, be sure to use the
-`Nim <http://stackoverflow.com/questions/tagged/nim>`_ tag in your 
-question.
+  Github also hosts other projects relating to Nim. These projects are a part
+  of the `nim-lang organisation <http://github.com/nim-lang>`_.
+  This includes the `Babel package manager <http://github.com/nim-lang/babel>`_
+  and its `package repository <http://github.com/nim-lang/packages>`_. 
 
-How to help
-===========
 
-There are always many things to be done in the main
-`Nim repository <https://github.com/Araq/Nim>`_, check out the 
-`issues <https://github.com/Araq/Nim/issues>`_ for 
-things to do; pull requests are always welcome. You can
-also contribute to the many other projects hosted by the
-`nim-lang <https://github.com/nim-lang>`_ organisation on github. If you
-can't find anything you fancy doing, you can always ask for inspiration on IRC
-(irc.freenode.net #nim) or on the `Nim forums <http://forum.nim-lang.org>`_.
+.. container:: standout
 
-Donations
----------
+  Twitter
+  -------
 
-If you love what we do and are feeling generous then you can always donate.
-Contributions of any quantity are greatly appreciated and will contribute to
-making Nim even better!
+  Follow us `@nimlang <http://twitter.com/nimlang>`_ for latest news about
+  Nim.
 
-Gittip
-``````
+.. container:: standout
 
-  .. raw:: html
+  Reddit
+  ------
 
-    <iframe style="border: 0; margin: 0; padding: 0;"
-             src="https://www.gittip.com/Araq/widget.html"
-             width="48pt" height="22pt"></iframe>
+  Subscribe to `/r/nim <http://reddit.com/r/nim>`_ for latest news about
+  Nim.
 
-Paypal
-``````
+.. container:: standout
 
-  .. raw:: html
+  StackOverflow
+  -------------
 
-    <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
-    <input type="hidden" name="cmd" value="_s-xclick">
-    <input type="hidden" name="hosted_button_id" value="ZQC6CVEEYNTLN">
-    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
-    <img alt="" border="0" src="https://www.paypalobjects.com/de_DE/i/scr/pixel.gif" width="1" height="1">
-    </form>
+  When asking a question relating to Nim, be sure to use the
+  `Nim <http://stackoverflow.com/questions/tagged/nim>`_ tag in your 
+  question.
 
-Bitcoin
-```````
+.. container:: standout
 
-  Bitcoin address: 1BXfuKM2uvoD6mbx4g5xM3eQhLzkCK77tJ
+  How to help
+  -----------
+
+  There are always many things to be done in the main
+  `Nim repository <https://github.com/Araq/Nim>`_, check out the 
+  `issues <https://github.com/Araq/Nim/issues>`_ for 
+  things to do; pull requests are always welcome. You can
+  also contribute to the many other projects hosted by the
+  `nim-lang <https://github.com/nim-lang>`_ organisation on github. If you
+  can't find anything you fancy doing, you can always ask for inspiration on IRC
+  (irc.freenode.net #nim) or on the `Nim forums <http://forum.nim-lang.org>`_.
+
+
+.. container:: standout
+
+  Donations
+  ---------
+
+  If you love what we do and are feeling generous then you can always donate.
+  Contributions of any quantity are greatly appreciated and will contribute to
+  making Nim even better!
+
+  Gittip
+    .. raw:: html
+
+      <iframe style="border: 0; margin: 0; padding: 0;"
+               src="https://www.gittip.com/Araq/widget.html"
+               width="48pt" height="22pt"></iframe>
+
+  Paypal
+    .. raw:: html
+
+      <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+      <input type="hidden" name="cmd" value="_s-xclick">
+      <input type="hidden" name="hosted_button_id" value="ZQC6CVEEYNTLN">
+      <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
+      <img alt="" border="0" src="https://www.paypalobjects.com/de_DE/i/scr/pixel.gif" width="1" height="1">
+      </form>
+
+  Bitcoin
+    Bitcoin address: 1BXfuKM2uvoD6mbx4g5xM3eQhLzkCK77tJ
diff --git a/web/documentation.txt b/web/documentation.txt
index da0313c32..0bb2b8a0f 100644
--- a/web/documentation.txt
+++ b/web/documentation.txt
@@ -1 +1,51 @@
-.. include:: ../doc/docs.txt
+Nim's Documentation
+===================
+
+.. container:: standout
+
+  Standards & Guides
+  ------------------
+
+
+  - | `Standard Library <lib.html>`_
+    | This document describes Nim's standard library.
+
+  - | `Language Manual <manual.html>`_
+    | The Nim manual is a draft that will evolve into a proper specification.
+
+  - | `Compiler user guide <nimc.html>`_
+    | The user guide lists command line arguments, special features of the
+      compiler, etc.
+
+
+.. container:: standout
+
+  Tools & Features
+  ----------------
+
+  - | `Source code filters <filters.html>`_
+    | The Nim compiler supports source code filters as a simple yet powerful
+      builtin templating system.
+
+  - | `Tools documentation <tools.html>`_
+    | Description of some tools that come with the standard distribution.
+
+
+.. container:: standout
+
+  Internal Details
+  ----------------
+
+  - | `Garbage Collector <gc.html>`_
+    | Additional documentation about Nim's GC and how to operate it in a
+    | realtime setting.
+
+  - | `Internal documentation <intern.html>`_
+    | The internal documentation describes how the compiler is implemented. Read
+      this if you want to hack the compiler.
+
+
+Search Options
+--------------
+
+`Documentation Index <theindex.html>`_ - The generated index. **Index + (Ctrl+F) == Joy**
diff --git a/web/index.txt b/web/index.txt
index e48c54f17..3317ba940 100644
--- a/web/index.txt
+++ b/web/index.txt
@@ -18,22 +18,6 @@ shared memory heap is also provided for the increased efficiency that results
 from that model.
 
 
-Nim looks like this:
-====================
-
-.. code-block:: nim
-  # compute average line length
-  var count = 0
-  var sum = 0
-   
-  for line in stdin.lines:
-    count += 1
-    sum += line.len
-   
-  echo "Average line length: ",
-    if count > 0: sum / count else: 0
-
-
 Nim is efficient
 ================
 
diff --git a/web/learn.txt b/web/learn.txt
new file mode 100644
index 000000000..1b0984cda
--- /dev/null
+++ b/web/learn.txt
@@ -0,0 +1,44 @@
+Nim's Learning Resources
+========================
+
+.. container:: standout
+
+  Tutorials
+  ---------
+
+  - | `Tutorial (part I) <tut1.html>`_
+    | Learn the basics of Nim's types, variables, procedures, control flow, etc...
+
+  - | `Tutorial (part II) <tut2.html>`_
+    | Learn Nim's more advanced features such as OOP, generics, macros, etc...
+
+
+.. container:: standout
+
+  Examples
+  --------
+
+  - | `Nim by Example <http://nimrod-by-example.github.io/>`_
+    | Nim by Example is an excellent starting place for beginners.
+
+  - | `Nim on Rosetta Code <http://rosettacode.org/wiki/Category:Nimrod>`_
+    | Many different Nim code examples comparible to other langues for reference.
+
+  - | `Nim for C/C++ Programmers <https://github.com/Araq/Nimrod/wiki/Nimrod-for-C-programmers>`_
+    | A useful cheat-sheet for those most familiar with C/C++ languages.
+
+
+.. container:: standout
+
+  Articles
+  --------
+
+  - `Dr Dobbs Nimrod Publication <http://www.drdobbs.com/open-source/nimrod-a-new-systems-programming-languag/240165321>`_
+  - `Bootstrapping Nim <http://goran.krampe.se/2014/10/15/bootstrapping-nim/>`_
+
+
+Documentation
+-------------
+
+More examples of Nim code can be found in the `Nim Language Documenation <manual.html>`_.
+
diff --git a/web/news.txt b/web/news.txt
index 76541560c..d345526c4 100644
--- a/web/news.txt
+++ b/web/news.txt
@@ -78,8 +78,20 @@ News
     exceptions (overflow, division by zero, etc.).
 
 
-2014-10-19 Nimrod version 0.9.6 released
-========================================
+2014-12-09 New website design!
+==============================
+
+A brand new website including an improved forum is now live. 
+All thanks go to Philip Witte and 
+Dominik Picheta, Philip Witte for the design of the website (together with
+the logo) as well as the HTML and CSS code for his template, and Dominik Picheta
+for integrating Philip's design with Nim's forum. We're sure you will
+agree that Philip's design is beautiful.
+
+
+
+2014-10-19 Version 0.9.6 released
+=================================
 
 **Note: 0.9.6 is the last release of Nimrod. The language is being renamed to
 Nim. Nim slightly breaks compatibility.**
diff --git a/web/nim.ini b/web/nim.ini
index 6624910d1..83705e8ce 100644
--- a/web/nim.ini
+++ b/web/nim.ini
@@ -9,13 +9,15 @@ Authors: "Andreas Rumpf and contributors"
 # Everything after ; is the ID
 User_Forum: "http://forum.nim-lang.org;link_forum"
 Aporia_IDE: "https://github.com/nimrod-code/Aporia;link_aporia"
-Nimbuild: "http://build.nim-lang.org;link_nimbuild"
+Github_Repo: "http://github.com/Araq/Nimrod;link_github"
+
 
 [Tabs]
 # Menu entry: filename
 home: index
 news: news
 docs: documentation
+learn: learn
 download: download
 community: community
 FAQ: question
@@ -34,7 +36,7 @@ documentation: """Incorrect documentation is often worse than no documentation.
 - Bertrand Meyer"""
 download: """There are two major products that come out of Berkeley: LSD and
 UNIX. We don't believe this to be a coincidence. - Jeremy S. Anderson."""
-
+learn: """Repetition renders the ridiculous reasonable. - Norman Wildberger"""
 
 [Documentation]
 doc: "endb;intern;apis;lib;manual.txt;tut1;tut2;nimc;overview;filters"
diff --git a/web/question.txt b/web/question.txt
index 52809ff90..23d3b9b67 100644
--- a/web/question.txt
+++ b/web/question.txt
@@ -6,136 +6,160 @@
 General
 =======
 
-What is Nim?
-------------
+.. container:: standout
 
-Nim (formerly known as "Nimrod") is a statically typed, imperative programming
-language that tries to give the programmer ultimate power without compromises
-on runtime efficiency.
-This means it focuses on compile-time mechanisms in all their
-various forms. Beneath a nice infix/indentation based syntax with a 
-powerful (AST based, hygienic) macro system lies a semantic model that supports 
-a soft realtime GC on thread local heaps. Asynchronous message passing is used 
-between threads, so no "stop the world" mechanism is necessary. An unsafe 
-shared memory heap is also provided for the increased efficiency that results 
-from that model.
+  What is Nim?
+  ------------
 
+  Nim (formerly known as "Nimrod") is a statically typed, imperative programming
+  language that tries to give the programmer ultimate power without compromises
+  on runtime efficiency.
+  This means it focuses on compile-time mechanisms in all their
+  various forms. Beneath a nice infix/indentation based syntax with a 
+  powerful (AST based, hygienic) macro system lies a semantic model that supports 
+  a soft realtime GC on thread local heaps. Asynchronous message passing is used 
+  between threads, so no "stop the world" mechanism is necessary. An unsafe 
+  shared memory heap is also provided for the increased efficiency that results 
+  from that model.
 
-Why yet another programming language?
--------------------------------------
 
-Nim is one of the very few *programmable* statically typed languages, and 
-one of the even fewer that produces native binaries that require no 
-runtime or interpreter.
+.. container:: standout
 
+  Why yet another programming language?
+  -------------------------------------
 
-What have been the major influences in the language's design?
--------------------------------------------------------------
+  Nim is one of the very few *programmable* statically typed languages, and 
+  one of the even fewer that produces native binaries that require no 
+  runtime or interpreter.
 
-The language borrows heavily from (in order of impact): Modula 3, Delphi, Ada,
-C++, Python, Lisp, Oberon.
 
+.. container:: standout
 
+  What have been the major influences in the language's design?
+  -------------------------------------------------------------
 
-What is Nim's take on concurrency?
-----------------------------------
+  The language borrows heavily from (in order of impact): Modula 3, Delphi, Ada,
+  C++, Python, Lisp, Oberon.
 
-Nim primarily focusses on thread local (and garbage collected) heaps and 
-message passing between threads. Each thread has its own GC, so no 
-"stop the world" mechanism is necessary. An unsafe shared memory heap is also
-provided.
 
-Future versions will additionally include a GC "per thread group" 
-and Nim's type system will be enhanced to accurately model this shared
-memory heap.
+.. container:: standout
 
+  What is Nim's take on concurrency?
+  ----------------------------------
 
-How is Nim licensed?
---------------------
+  Nim primarily focusses on thread local (and garbage collected) heaps and 
+  message passing between threads. Each thread has its own GC, so no 
+  "stop the world" mechanism is necessary. An unsafe shared memory heap is also
+  provided.
 
-The Nim compiler and the library are MIT licensed.
-This means that you can use any license for your own programs developed with
-Nim.
+  Future versions will additionally include a GC "per thread group" 
+  and Nim's type system will be enhanced to accurately model this shared
+  memory heap.
 
 
-How stable is Nim?
-------------------
+.. container:: standout
 
-The compiler is in development and some important features are still missing.
-However, the compiler is quite stable already: It is able to compile itself 
-and a substantial body of other code. Until version 1.0.0 is released,
-minor incompatibilities with older versions of the compiler will be introduced.
+  How is Nim licensed?
+  --------------------
 
+  The Nim compiler and the library are MIT licensed.
+  This means that you can use any license for your own programs developed with
+  Nim.
 
-How fast is Nim?
-----------------
-Benchmarks show it to be comparable to C. Some language features (methods, 
-closures, message passing) are not yet as optimized as they could and will be.
-The only overhead Nim has over C is the GC which has been tuned 
-for years but still needs some work.
 
+.. container:: standout
 
-What about JVM/CLR backends?
-----------------------------
+  How stable is Nim?
+  ------------------
 
-A JVM backend is almost impossible. The JVM is not expressive enough. It has
-never been designed as a general purpose VM anyway. A CLR backend is possible
-but would require much work. 
+  The compiler is in development and some important features are still missing.
+  However, the compiler is quite stable already: It is able to compile itself 
+  and a substantial body of other code. Until version 1.0.0 is released,
+  minor incompatibilities with older versions of the compiler will be introduced.
 
-What about editor support?
---------------------------
 
-- Nim IDE: https://github.com/nimrod-code/Aporia
-- Emacs: https://github.com/Tass/nimrod-mode
-- Vim: https://github.com/zah/nimrod.vim/
-- Scite: Included
-- Gedit: The `Aporia .lang file <https://github.com/nimrod-code/Aporia/blob/master/share/gtksourceview-2.0/language-specs/nimrod.lang>`_
-- jEdit: https://github.com/exhu/nimrod-misc/tree/master/jedit
+.. container:: standout
 
+  How fast is Nim?
+  ----------------
+  Benchmarks show it to be comparable to C. Some language features (methods, 
+  closures, message passing) are not yet as optimized as they could and will be.
+  The only overhead Nim has over C is the GC which has been tuned 
+  for years but still needs some work.
 
-Why is it named ``proc``?
--------------------------
 
-*Procedure* used to be the common term as opposed to a *function* which is a
-mathematical entity that has no side effects. It was planned to have ``func``
-as syntactic sugar for ``proc {.noSideEffect.}`` but with the more fine-grained
-effect system it is not yet clear what ``func`` should be a shortcut for.
+.. container:: standout
+
+  What about JVM/CLR backends?
+  ----------------------------
+
+  A JVM backend is almost impossible. The JVM is not expressive enough. It has
+  never been designed as a general purpose VM anyway. A CLR backend is possible
+  but would require much work. 
+
+
+.. container:: standout
+
+  What about editor support?
+  --------------------------
+
+  - Nim IDE: https://github.com/nimrod-code/Aporia
+  - Emacs: https://github.com/Tass/nimrod-mode
+  - Vim: https://github.com/zah/nimrod.vim/
+  - Scite: Included
+  - Gedit: The `Aporia .lang file <https://github.com/nimrod-code/Aporia/blob/master/share/gtksourceview-2.0/language-specs/nimrod.lang>`_
+  - jEdit: https://github.com/exhu/nimrod-misc/tree/master/jedit
+
+
+.. container:: standout
+
+  Why is it named ``proc``?
+  -------------------------
+
+  *Procedure* used to be the common term as opposed to a *function* which is a
+  mathematical entity that has no side effects. It was planned to have ``func``
+  as syntactic sugar for ``proc {.noSideEffect.}`` but with the more fine-grained
+  effect system it is not yet clear what ``func`` should be a shortcut for.
 
 
 Compilation
 ===========
 
-Which option to use for the fastest executable?
------------------------------------------------
+.. container:: standout
+
+  Which option to use for the fastest executable?
+  -----------------------------------------------
 
-For the standard configuration file, ``-d:release`` does the trick.
+  For the standard configuration file, ``-d:release`` does the trick.
 
+.. container:: standout
 
-Which option to use for the smallest executable?
-------------------------------------------------
+  Which option to use for the smallest executable?
+  ------------------------------------------------
 
-For the standard configuration file, ``-d:quick --opt:size`` does the trick.
+  For the standard configuration file, ``-d:quick --opt:size`` does the trick.
 
+.. container:: standout
 
-How do I use a different C compiler than the default one?
----------------------------------------------------------
+  How do I use a different C compiler than the default one?
+  ---------------------------------------------------------
 
-Edit the ``config/nimrod.cfg`` file.
-Change the value of the ``cc`` variable to one of the following:
+  Edit the ``config/nimrod.cfg`` file.
+  Change the value of the ``cc`` variable to one of the following:
 
-==============  ============================================
-Abbreviation    C/C++ Compiler
-==============  ============================================
-``vcc``         Microsoft's Visual C++
-``gcc``         Gnu C
-``llvm_gcc``    LLVM-GCC compiler
-``icc``         Intel C++ compiler
-``clang``       Clang compiler
-``ucc``         Generic UNIX C compiler
-==============  ============================================
+  ==============  ============================================
+  Abbreviation    C/C++ Compiler
+  ==============  ============================================
+  ``vcc``         Microsoft's Visual C++
+  ``gcc``         Gnu C
+  ``llvm_gcc``    LLVM-GCC compiler
+  ``icc``         Intel C++ compiler
+  ``clang``       Clang compiler
+  ``ucc``         Generic UNIX C compiler
+  ==============  ============================================
 
-Other C compilers are not officially supported, but might work too.
+  Other C compilers are not officially supported, but might work too.
 
-If your C compiler is not in the above list, try using the
-*generic UNIX C compiler* (``ucc``). If the C compiler needs
-different command line arguments try the ``--passc`` and ``--passl`` switches.
+  If your C compiler is not in the above list, try using the
+  *generic UNIX C compiler* (``ucc``). If the C compiler needs
+  different command line arguments try the ``--passc`` and ``--passl`` switches.
diff --git a/web/ticker.txt b/web/ticker.txt
index 98ad25905..a0d2f0a78 100644
--- a/web/ticker.txt
+++ b/web/ticker.txt
@@ -1,54 +1,21 @@
-<a class="news" href="news.html#Z2014-10-19-version-0-9-6-released">
-  <h3>Oct 19, 2014</h3>
-  <p>Nimrod version 0.9.6 has been released!</p>
+<a class="news" href="news.html#Z2014-12-09-new-website-design">
+  <h4>Dec 9, 2014</h4>
+  <p>The new website design and forum are now online!</p>
 </a>
 
-<a class="news" href="news.html#Z2014-04-21-version-0-9-4-released">
-  <h3>Apr 21, 2014</h3>
-  <p>Nimrod version 0.9.4 has been released!</p>
+<a class="news" href="news.html#Z2014-10-19-version-0-9-6-released">
+  <h4>Oct 19, 2014</h4>
+  <p>Nimrod version 0.9.6 has been released!</p>
 </a>
 
 <a class="news" href="news.html#Z2014-02-11-nimrod-featured-in-dr-dobb-s-journal">
-  <h3>Feb 11, 2014</h3>
+  <h4>Feb 11, 2014</h4>
   <p>Nimrod featured in Dr. Dobb's Journal</p>
 </a>
 
 <a class="news" href="news.html#Z2014-01-15-andreas-rumpf-s-talk-on-nimrod-at-strange-loop-2013-is-now-online">
-  <h3>Jan 15, 2014</h3>
+  <h4>Jan 15, 2014</h4>
   <p>Andreas Rumpf's talk on Nimrod at Strange Loop 2013 is now online.</p>
 </a>
 
-<a class="news" href="news.html#Z2013-05-20-new-website-design">
-  <h3>May 20, 2013</h3>
-  <p>New website design!</p>
-</a>
-
-<a class="news" href="news.html#Z2013-05-20-version-0-9-2-released">
-  <h3>May 20, 2013</h3>
-  <p>Nimrod version 0.9.2 has been released!</p>
-</a>
-
-<a class="news" href="news.html#Z2012-09-23-version-0-9-0-released">
-  <h3>Sep 23, 2012</h3>
-  <p>Nimrod version 0.9.0 has been released!</p>
-</a>
-
-<a class="news" href="news.html#Z2012-02-09-version-0-8-14-released">
-  <h3>Feb 9, 2012</h3>
-  <p>Nimrod version 0.8.14 has been released!</p>
-</a>
-
-<a class="news" href="news.html#Z2011-07-10-version-0-8-12-released">
-  <h3>Jul 10, 2011</h3>
-  <p>Nimrod version 0.8.12 has been released!</p>
-</a>
-
-<a class="news" href="news.html#Z2010-10-20-version-0-8-10-released">
-  <h3>Oct 20, 2010</h3>
-  <p>Nimrod version 0.8.10 has been released!</p>
-</a>
-
-<a class="news" href="news.html#Z2010-03-14-version-0-8-8-released">
-  <h3>Mar 14, 2010</h3>
-  <p>Nimrod version 0.8.8 has been released!</p>
-</a>
+<a href="news.html" class="blue">See All News...</a>