Added Nim workshop banner to front page slider.

3 files changed, 67 insertions, 52 deletions

diff --git a/web/assets/index.js b/web/assets/index.js
index f10dc603d..376e606c5 100644
--- a/web/assets/index.js
+++ b/web/assets/index.js
@@ -4,12 +4,22 @@ var timer;
 var prevIndex = 0;
 var slideCount = 2;
 
+function modifyActive(el, add) {
+  var element = document.getElementById(el);
+  if (add) {
+    element.className = element.className + " active";
+  }
+  else {
+    element.className = element.className.replace("active", "");
+  }
+}
+
 function setSlideShow(index, short) {
   if (index >= slideCount) index = 0;
-  document.getElementById("slide"+prevIndex).className = "";
-  document.getElementById("slide"+index).className = "active";
-  document.getElementById("slideControl"+prevIndex).className = "";
-  document.getElementById("slideControl"+index).className = "active";
+  modifyActive("slide" + prevIndex, false);
+  modifyActive("slide" + index, true);
+  modifyActive("slideControl" + prevIndex, false);
+  modifyActive("slideControl" + index, true);
   prevIndex = index;
   startTimer(short ? 8000 : 32000);
 }
@@ -31,4 +41,4 @@ window.onload = function() {
   slideshow.onmouseleave = slideshow_exit;
   slideCount = slideshow.children.length;
   startTimer(8000);
-};
\ No newline at end of file
+};
diff --git a/web/assets/style.css b/web/assets/style.css
index 17541a118..15886ae2e 100644
--- a/web/assets/style.css
+++ b/web/assets/style.css
@@ -8,7 +8,7 @@ body {
 	min-width:1030px;
 	margin:0;
 	font:13pt "arial";
-	background:#152534 url("images/bg.png") no-repeat center top; 
+	background:#152534 url("images/bg.png") no-repeat center top;
 	color:rgba(0,0,0,.8); }
 
 pre {
@@ -48,7 +48,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 #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;
@@ -59,7 +59,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		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;
@@ -69,7 +69,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
     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; }
@@ -96,7 +96,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 #neck { z-index:0; height:40px; }
 #neck.home { height:370px; }
 #neck > div { position:relative }
-	
+
 	#glow-arrow {
 		position:absolute;
 		top:-9px;
@@ -105,7 +105,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		height:48px;
 		background:url("images/glow-arrow.png") no-repeat right; }
   #glow-arrow.docs { left:280px; }
-	
+
 	#glow-line-vert {
 		position:fixed;
 		top:100px;
@@ -113,7 +113,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		width:3px;
 		height:844px;
 		background:url("images/glow-line-vert.png") no-repeat; }
-	
+
 	#slideshow { position:absolute; top:10px; left:10px; width:700px; height: 1000px; }
 	#slideshow > div {
     position:absolute;
@@ -129,22 +129,27 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 	#slideshow-nav > div { display:inline-block; 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 { float:left; width:680px; font:10pt monospace; }
-		#slide0 > div:first-child { margin:0 40px 0 0; }
-		#slide0 h2 { margin:0 0 5px 0; color:rgba(162,198,223,.78); }
-		#slide0 .desc { margin:0 0 5px 0; color:rgba(162,198,223,.78); font:13pt "arial"; }
-		
-		#slide1 > div { float:left; width:320px; font:10pt monospace; }
-		#slide1 > div:first-child { margin:0 40px 0 0; }
-		#slide1 h2 { margin:0 0 5px 0; color:rgba(162,198,223,.78); }
-    
-		#slide2 > div { float:left; width:320px; font:10pt monospace; }
-		#slide2 > div:first-child { margin:0 40px 0 0; }
-		#slide2 h2 { margin:0 0 5px 0; color:rgba(162,198,223,.78); }
-    
-		#slide2 .desc { margin:0 0 5px 0; color:rgba(162,198,223,.78); font:13pt "arial"; }
-    
+
+                .zeoslide img {
+                  box-shadow: 1px 2px 16px rgba(28, 180, 236, 0.4);
+                  width: 705px;
+                }
+
+		.codeslide1 { float:left; width:680px; font:10pt monospace; }
+		.codeslide1 > div:first-child { margin:0 40px 0 0; }
+		.codeslide1 h2 { margin:0 0 5px 0; color:rgba(162,198,223,.78); }
+		.codeslide1 .desc { margin:0 0 5px 0; color:rgba(162,198,223,.78); font:13pt "arial"; }
+
+		.codeslide2 > div { float:left; width:320px; font:10pt monospace; }
+		.codeslide2 > div:first-child { margin:0 40px 0 0; }
+		.codeslide2 h2 { margin:0 0 5px 0; color:rgba(162,198,223,.78); }
+
+		.codeslide3 > div { float:left; width:320px; font:10pt monospace; }
+		.codeslide3 > div:first-child { margin:0 40px 0 0; }
+		.codeslide3 h2 { margin:0 0 5px 0; color:rgba(162,198,223,.78); }
+
+		.codeslide3 .desc { margin:0 0 5px 0; color:rgba(162,198,223,.78); font:13pt "arial"; }
+
 		/* back when slide1 was the quote:
 		#slide1 { margin-top:50px; }
 		#slide1 > p {
@@ -198,13 +203,13 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 	#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;
@@ -257,7 +262,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 #body { z-index:1; position:relative; background:rgba(220,231,248,0.8); }
 #body.docs { margin:0 40px 20px 320px; }
 #body.forum { margin:0 40px 20px 40px; }
-	
+
 	#body-border {
 		position:absolute;
 		top:-25px;
@@ -265,7 +270,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		right:0;
 		height:35px;
 		background:rgba(0,0,0,.25); }
-	
+
 	#body-border-left {
 		position:absolute;
 		left:-25px;
@@ -273,7 +278,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		bottom:-25px;
 		width:35px;
 		background:rgba(0,0,0,.25); }
-	
+
 	#body-border-right {
 		position:absolute;
 		right:-25px;
@@ -281,7 +286,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		bottom:-25px;
 		width:35px;
 		background:rgba(0,0,0,.25); }
-	
+
 	#body-border-bottom {
 		position:absolute;
 		left:10px;
@@ -289,10 +294,10 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		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;
@@ -307,7 +312,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		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); }
@@ -317,7 +322,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 	#content a:hover { text-decoration:underline; }
 	#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 {
@@ -348,16 +353,16 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		#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%; }
-    
+
     #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;
@@ -378,7 +383,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 			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;
@@ -390,7 +395,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 		#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;
@@ -400,7 +405,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 			line-height:14pt;
 			background:rgba(0,0,0,.75);
 			border-left:8px solid rgba(0,0,0,.3); }
-    
+
     #docs-sort { float:right; font-size:75%; }
     #docs-sort > a {
       cursor:default;
@@ -412,7 +417,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
       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); }
-    
+
     #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%; }
@@ -422,7 +427,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
     #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;
@@ -462,7 +467,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
     #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; }
-    
+
     #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; }
@@ -477,7 +482,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
       line-height:14pt;
       background:rgba(0,0,0,.75);
       border-left:8px solid rgba(0,0,0,.3); }
-    
+
     #talk-head,
     #talk-info {
       overflow:auto;
@@ -501,10 +506,10 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
     #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; }
-    
+
     #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; }
-    
+
     .standout {
       padding:5px 30px;
       margin-bottom:20px;
@@ -527,7 +532,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
     .standout li:first-child { padding-top:0; border-top:none; }
     .standout li p { margin:0 0 10px 0 !important; line-height:130%; }
     .standout li p > a { font-weight:bold; }
-    
+
     .forum-user-info,
     .forum-user-info * { cursor:help }
 
@@ -539,7 +544,7 @@ pre .end { background:url("images/tabEnd.png") no-repeat left bottom; }
 #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; }
diff --git a/web/assets/zeo/banner.jpg b/web/assets/zeo/banner.jpg
new file mode 100644
index 000000000..f09b000de
--- /dev/null
+++ b/web/assets/zeo/banner.jpg
Binary files differ