Update style and clean

src/code_manager/model/HtmlGenerator.js

@@ -7,12 +7,13 @@ define(['backbone'],
 
 			/** @inheritdoc */
 			build: function(model, cssc){
-				var inlineCss = 1;
 				var coll = model.get('components') || model,
 					code = '';
 
 				coll.each(function(m){
-					code += m.toHTML();
+					code += m.toHTML({
+						cssc: cssc
+					});
 				}, this);
 
 				return code;

src/dom_components/model/Component.js

@@ -143,10 +143,11 @@ define(['backbone','./Components', 'SelectorManager/model/Selectors', 'TraitMana
 
 			/**
 			 * Return HTML string of the component
+			 * @param {Object} opts Options
 			 * @return {string} HTML string
 			 * @private
 			 */
-			toHTML: function() {
+			toHTML: function(opts) {
 				var code = '';
 				var m = this;
 				var tag = m.get('tagName'),

styles/css/main.css

@@ -3699,6 +3699,9 @@ ol.example li.placeholder:before {
     right: 15px;
     top: 5px; }
 
+.gjs-mdl-active .gjs-mdl-dialog {
+  animation: gjs-mdl-slide-down 0.216s; }
+
 .gjs-mdl-header, .gjs-mdl-content {
   padding: 10px 15px;
   clear: both; }
@@ -3950,3 +3953,11 @@ ol.example li.placeholder:before {
 
 .gjs-hidden {
   display: none; }
+
+@keyframes gjs--slide-down {
+  0% {
+    margin-top: -3rem;
+    opacity: 0; }
+  100% {
+    margin-top: 0;
+    opacity: 1; } }

styles/scss/main.scss

@@ -1361,7 +1361,11 @@ $paddElClm: 5px 6px;
    		@extend .btn-cl;
    		position: absolute;
    		right: 15px; top: 5px;
-	}
+    }
+}
+
+.#{$mdl-prefix}active .#{$mdl-prefix}dialog {
+  animation: #{$mdl-prefix}slide-down .216s;
 }
 
 .#{$mdl-prefix}header, .#{$mdl-prefix}content{
@@ -1643,3 +1647,14 @@ $uploadPadding:	150px 10px;
 }
 
 .#{$app-prefix}hidden{ display: none; }
+
+@keyframes #{$app-prefix}-slide-down {
+  0% {
+      margin-top: -3rem;
+      opacity: 0;
+  }
+  100% {
+      margin-top: 0;
+      opacity: 1;
+  }
+}