Update style of select options

src/trait_manager/view/TraitView.js

@@ -16,7 +16,7 @@ define(['backbone'], function (Backbone) {
 		 * @param {Object} el Test
 		 * @private
 		 */
-		onChange: function(elView) {
+		onChange: function(elView) { //<-- TraitRenderer
 			var m = this.model;
 			var attrs = elView.model.get('attributes');
 			attrs[m.get('name')] = m.get('value');

styles/css/main.css

@@ -2631,7 +2631,10 @@ $fontColorActive: #4f8ef7;
 .gjs-checker-bg, .checker-bg, .gjs-sm-sector .gjs-sm-property .gjs-sm-layer > #gjs-sm-preview-box, .gjs-clm-tags .gjs-sm-property .gjs-sm-layer > #gjs-sm-preview-box {
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg=="); }
 
-.gjs-bg-main, .gjs-off-prv, .gjs-pn-panel, .gjs-nv-item .gjs-nv-title-c, .gjs-sm-sector .gjs-sm-colorp-c, .gjs-clm-tags .gjs-sm-colorp-c, .gjs-mdl-dialog, #gjs-rte-toolbar, .sp-container {
+.gjs-bg-main, .gjs-off-prv, .gjs-select option,
+.gjs-clm-select option,
+.gjs-sm-select option,
+.gjs-sm-unit option, .gjs-pn-panel, .gjs-nv-item .gjs-nv-title-c, .gjs-sm-sector .gjs-sm-colorp-c, .gjs-clm-tags .gjs-sm-colorp-c, .gjs-mdl-dialog, #gjs-rte-toolbar, .sp-container {
   background-color: #444; }
 
 .gjs-color-main, .gjs-off-prv, .gjs-btn-prim, .gjs-pn-panel, .gjs-pn-btn, .gjs-btnt, .gjs-sm-sector .gjs-sm-field.gjs-sm-composite, .gjs-clm-tags .gjs-sm-field.gjs-sm-composite, .gjs-sm-sector .gjs-sm-composite.gjs-clm-field, .gjs-clm-tags .gjs-sm-composite.gjs-clm-field, .gjs-sm-sector .gjs-sm-stack #gjs-sm-add, .gjs-clm-tags .gjs-sm-stack #gjs-sm-add, .gjs-mdl-dialog, #gjs-rte-toolbar .gjs-rte-btn {
@@ -3107,7 +3110,7 @@ ol.example li.placeholder:before {
   .gjs-field select {
     height: 20px; }
   .gjs-field option {
-    margin: 5px 0; }
+    padding: 5px 0; }
   .gjs-field .gjs-sel-arrow {
     height: 100%;
     width: 9px;

styles/scss/main.scss

@@ -210,6 +210,14 @@ div.#{$app-prefix}select{
 .#{$app-prefix}select select:focus {
   outline: none;
 }
+
+.#{$app-prefix}select option,
+.#{$clm-prefix}select option,
+.#{$sm-prefix}select option,
+.#{$sm-prefix}unit option{
+  @extend .#{$app-prefix}bg-main;
+  //background-color: $mainDkColor;
+}
 /*************  CANVAS  ****************/
 .#{$cv-prefix}canvas {
   background-color: rgba(0, 0, 0, 0.15);
@@ -638,7 +646,7 @@ $arrowColor:    $mainLhlColor; /*b1b1b1*/
   }
 
   option{
-    margin: 5px 0;
+    padding: 5px 0;
   }
 
   .#{$app-prefix}sel-arrow {
@@ -1494,4 +1502,4 @@ $uploadPadding:	150px 10px;
   border: 1px solid rgba(0, 0, 0, 0.8);
 }
 
-.#{$app-prefix}hidden{ display: none; }
+.#{$app-prefix}hidden{ display: none; }