From 5605e0694cc31609ca7970a74336cecef0011af6 Mon Sep 17 00:00:00 2001
From: Artur Arseniev <artur.catch@hotmail.it>
Date: Fri, 14 Oct 2016 14:03:06 +0200
Subject: [PATCH] Update OpenTraitManager command

---
 src/commands/view/OpenStyleManager.js |  9 ++++-----
 src/commands/view/OpenTraitManager.js |  5 ++++-
 src/style_manager/main.js             | 11 ++++++++++-
 src/trait_manager/config/config.js    |  1 +
 src/trait_manager/main.js             |  9 +++++++++
 styles/css/main.css                   |  8 ++++++++
 styles/scss/main.scss                 |  8 ++++++++
 7 files changed, 44 insertions(+), 7 deletions(-)

diff --git a/src/commands/view/OpenStyleManager.js b/src/commands/view/OpenStyleManager.js
index b435825f0..8b60e61c7 100644
--- a/src/commands/view/OpenStyleManager.js
+++ b/src/commands/view/OpenStyleManager.js
@@ -10,7 +10,6 @@ define(['StyleManager'], function(StyleManager) {
 				if(!this.$cn){
 					var config		= em.getConfig(),
 							panels		= em.Panels;
-
 					// Main container
 					this.$cn = $('<div/>');
 					// Secondary container
@@ -30,11 +29,11 @@ define(['StyleManager'], function(StyleManager) {
 						this.$cn2.append(clm.render([]));
 
 					this.$cn2.append(em.StyleManager.render());
-
+					var smConfig = em.StyleManager.getConfig();
 					// Create header
 					this.$header	= $('<div>', {
-						class	: config.styleManager.stylePrefix + 'header',
-						text 	: config.styleManager.textNoElement,
+						class: smConfig.stylePrefix + 'header',
+						text: smConfig.textNoElement,
 					});
 					//this.$cn = this.$cn.add(this.$header);
 					this.$cn.append(this.$header);
@@ -80,4 +79,4 @@ define(['StyleManager'], function(StyleManager) {
 					this.$header.hide();
 			}
 		};
-	});
\ No newline at end of file
+	});
diff --git a/src/commands/view/OpenTraitManager.js b/src/commands/view/OpenTraitManager.js
index dfd11e886..e64d63857 100644
--- a/src/commands/view/OpenTraitManager.js
+++ b/src/commands/view/OpenTraitManager.js
@@ -8,7 +8,10 @@ define(function() {
 				var tm = editor.TraitManager;
 				if(!this.obj){
           var tmView = tm.getTraitsViewer();
-					this.obj = $('<div/>').get(0);
+					var confTm = tm.getConfig();
+					this.obj = $('<div/>')
+					.append('<div class="'+pfx+'traits-label">' + confTm.labelContainer + '</div>')
+					.get(0);
 					this.obj.appendChild(tmView.render().el);
 					var panels = editor.Panels;
 					if(!panels.getPanel('views-container'))
diff --git a/src/style_manager/main.js b/src/style_manager/main.js
index 3b886c99e..152bcf949 100644
--- a/src/style_manager/main.js
+++ b/src/style_manager/main.js
@@ -65,6 +65,15 @@ define(function(require) {
        */
       name: 'StyleManager',
 
+			/**
+			 * Get configuration object
+			 * @return {Object}
+			 * @private
+			 */
+			getConfig: function(){
+        return c;
+      },
+
       /**
        * Initialize module. Automatically called with a new instance of the editor
        * @param {Object} config Configurations
@@ -226,4 +235,4 @@ define(function(require) {
 
 		};
 	};
-});
\ No newline at end of file
+});
diff --git a/src/trait_manager/config/config.js b/src/trait_manager/config/config.js
index db4a103f7..a08e5a58a 100644
--- a/src/trait_manager/config/config.js
+++ b/src/trait_manager/config/config.js
@@ -1,5 +1,6 @@
 define(function () {
 	return {
 		stylePrefix: 'trt-',
+		labelContainer: 'Component settings',
 	};
 });
diff --git a/src/trait_manager/main.js b/src/trait_manager/main.js
index 29b544c72..3ce7f054b 100644
--- a/src/trait_manager/main.js
+++ b/src/trait_manager/main.js
@@ -18,6 +18,15 @@ define(function(require) {
        */
       name: 'TraitManager',
 
+			/**
+			 * Get configuration object
+			 * @return {Object}
+			 * @private
+			 */
+			getConfig: function(){
+        return c;
+      },
+
       /**
        * Initialize module. Automatically called with a new instance of the editor
        * @param {Object} config Configurations
diff --git a/styles/css/main.css b/styles/css/main.css
index 75ce24db6..d82823742 100644
--- a/styles/css/main.css
+++ b/styles/css/main.css
@@ -2718,6 +2718,14 @@ div.gjs-select {
   outline: none; }
 
 /*************  TRAITS  ****************/
+.gjs-traits-label {
+  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
+  font-size: 13px;
+  font-weight: lighter;
+  margin-bottom: 5px;
+  padding: 10px;
+  text-align: left; }
+
 .gjs-trt-trait {
   display: flex;
   justify-content: space-between;
diff --git a/styles/scss/main.scss b/styles/scss/main.scss
index 51a1543dd..f1cbd039f 100644
--- a/styles/scss/main.scss
+++ b/styles/scss/main.scss
@@ -225,6 +225,14 @@ div.#{$app-prefix}select {
 }
 
 /*************  TRAITS  ****************/
+.#{$app-prefix}traits-label {
+  border-bottom: 1px solid $mainDkColor;
+  font-size: 13px;
+  font-weight: lighter;
+  margin-bottom: 5px;
+  padding: 10px;
+  text-align: left;
+}
 .#{$trt-prefix}trait {
   display: flex;
   justify-content: space-between;