Pages update

README.md

@@ -0,0 +1,2 @@
+# Quodo 2
+[Demo](http://ruslanchek.github.io/Quodo-2/index.html)

config.codekit

@@ -65,6 +65,15 @@
 		"outputPathIsOutsideProject": 0,
 		"outputPathIsSetByUser": 0
 		},
+	"\/components.html": {
+		"fileType": 8192,
+		"ignore": 1,
+		"ignoreWasSetByUser": 0,
+		"inputAbbreviatedPath": "\/components.html",
+		"outputAbbreviatedPath": "No Output Path",
+		"outputPathIsOutsideProject": 0,
+		"outputPathIsSetByUser": 0
+		},
 	"\/config.rb": {
 		"fileType": 131072,
 		"ignore": 0,
@@ -353,20 +362,20 @@
 		"outputPathIsOutsideProject": 0,
 		"outputPathIsSetByUser": 0
 		},
-	"\/glossary.html": {
+	"\/grid.html": {
 		"fileType": 8192,
 		"ignore": 1,
 		"ignoreWasSetByUser": 0,
-		"inputAbbreviatedPath": "\/glossary.html",
+		"inputAbbreviatedPath": "\/grid.html",
 		"outputAbbreviatedPath": "No Output Path",
 		"outputPathIsOutsideProject": 0,
 		"outputPathIsSetByUser": 0
 		},
-	"\/grid.html": {
+	"\/index.html": {
 		"fileType": 8192,
 		"ignore": 1,
 		"ignoreWasSetByUser": 0,
-		"inputAbbreviatedPath": "\/grid.html",
+		"inputAbbreviatedPath": "\/index.html",
 		"outputAbbreviatedPath": "No Output Path",
 		"outputPathIsOutsideProject": 0,
 		"outputPathIsSetByUser": 0
@@ -583,7 +592,7 @@
 	"\/jade\/partials\/colorable.jade": {
 		"compileDebug": 1,
 		"fileType": 512,
-		"ignore": 0,
+		"ignore": 1,
 		"ignoreWasSetByUser": 0,
 		"inputAbbreviatedPath": "\/jade\/partials\/colorable.jade",
 		"outputAbbreviatedPath": "\/jade\/colorable.html",
@@ -803,6 +812,18 @@
 		"outputPathIsOutsideProject": 0,
 		"outputPathIsSetByUser": 0
 		},
+	"\/README.md": {
+		"enableFootnoteSupport": 0,
+		"enableSmartyPants": 1,
+		"expandTabs": 1,
+		"fileType": 4096,
+		"ignore": 0,
+		"ignoreWasSetByUser": 0,
+		"inputAbbreviatedPath": "\/README.md",
+		"outputAbbreviatedPath": "\/README.html",
+		"outputPathIsOutsideProject": 0,
+		"outputPathIsSetByUser": 0
+		},
 	"\/roadmap.html": {
 		"fileType": 8192,
 		"ignore": 1,

css/screen.css

@@ -3034,7 +3034,8 @@ main {
   margin-left: 0; }
 .grid [class^="col-"],
 .grid [class*=" col-"] {
-  margin-bottom: 40px; }
+  margin-bottom: 40px;
+  min-height: 1px; }
   @media (min-width: 0) and (max-width: 569px) {
     .grid [class^="col-"],
     .grid [class*=" col-"] {
@@ -4677,6 +4678,7 @@ html, body {
         margin-left: -16px;
         border-radius: 2.5px; }
   .fullscreen .overlay {
+    opacity: 0;
     width: 100%;
     height: 100%;
     z-index: 1001;

glossary.html

@@ -39,7 +39,7 @@ <h2>Coloured glossary</h2>
                   <div class="col-6"><a href="#stayhere" class="item"><span class="icon bg-cold-light"><i class="fa fa-camera"></i></span><span class="text">Cameras</span></a></div>
                   <div class="col-6"><a href="#stayhere" class="item"><span class="icon bg-cold-light"><i class="fa fa-gamepad"></i></span><span class="text">Games</span></a></div>
                 </div>
-              </div>
+              </div><br>
               <div class="grid marginless">
                 <div class="col-4"><a href="#" class="code"><i class="fa fa-code"></i>&nbsp;The code</a></div>
                 <div class="col-4"><a href="#" class="colorable"><i class="fa fa-paint-brush"></i>&nbsp;Colorable</a></div>
@@ -58,7 +58,7 @@ <h2>Yes, transparent style is applicable too</h2>
                   <div class="col-6"><a href="#stayhere" class="item"><span class="icon"><i class="fa fa-camera color-dark-gray-light"></i></span><span class="text">Cameras</span></a></div>
                   <div class="col-6"><a href="#stayhere" class="item"><span class="icon"><i class="fa fa-gamepad color-dark-gray-light"></i></span><span class="text">Games</span></a></div>
                 </div>
-              </div>
+              </div><br>
               <div class="grid marginless">
                 <div class="col-4"><a href="#" class="code"><i class="fa fa-code"></i>&nbsp;The code</a></div>
                 <div class="col-4"><a href="#" class="colorable"><i class="fa fa-paint-brush"></i>&nbsp;Colorable</a></div>

jade/glossary.jade

@@ -57,6 +57,8 @@ block content
 								i.fa.fa-gamepad
 							span.text Games
 
+			br
+
 			.grid.marginless
 				include partials/code
 				include partials/colorable
@@ -99,6 +101,8 @@ block content
 							span.icon: i.fa.fa-gamepad.color-dark-gray-light
 							span.text Games
 
+			br
+
 			.grid.marginless
 				include partials/code
 				include partials/colorable

js/ui.js

@@ -139,25 +139,32 @@ UI.Animate = function(options){
 
 
 UI.Template = function(templateName){
-	var _this = this;
+	var _this = this,
+		template;
 
 	_.templateSettings = UI.settings.templateSettings;
 
+	var warn = function(){
+		console.warn('UI.Template', 'Template is empty', templateName);
+	};
+
 	var getTemplate = function(){
-		var template = $('#' + templateName).html();
+		var t = $('#' + templateName).html();
 
-		if(template){
-			return template;
-		}else{
-			console.error('UI.Template', 'Template is empty', templateName);
+		if(t){
+			template = _.template(t);
 		}
 	};
 
 	this.render = function(data){
-		var template = _.template(getTemplate());
-
-		return template(data);
+		if(template){
+			return template(data);
+		}else{
+			warn();
+		}
 	};
+
+	getTemplate();
 };
 
 
@@ -698,7 +705,7 @@ UI.Fullscreen = function(options){
 	};
 
 	this.prepare = function(){
-		this.hide(function(){		
+		this.hide(function(){
 	        _this.options.onBeforeShow(_this);
 
 	        prepareContainer();

sass/components/grid.scss

@@ -44,6 +44,7 @@ $one_col: (100% - ($grid-gutter-width * ($grid-cols - 1))) / $grid-cols;
 	[class^="col-"], 
 	[class*=" col-"] {
         margin-bottom: $margin-vertical-space;
+        min-height: 1px;
 
 		@include breakpoint($bp-iphone) {
 			float: none !important;