AMBARI-4423. Add Services > Assign Masters: distinguish new masters vs existing masters. (Mikhail Bayuk via akovalenko)

ambari-web/app/styles/application.less

@@ -3335,12 +3335,22 @@ background: url(	data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByU
     padding: 2px 8px;
     border: solid 1px #cccccc;
     margin: 2px;
-    background-color: @green;
+    background-color: #969696;
     color: white;
     white-space: nowrap;
     font-size: 0.9em;
     display: inline-block;
   }
+  .host-assignments .newService {
+     padding: 2px 8px;
+     border: solid 1px #cccccc;
+     margin: 2px;
+     background-color: @green;
+     color: white;
+     white-space: nowrap;
+     font-size: 0.9em;
+     display: inline-block;
+   }
 
   .host-assignments .grey {
     background-color: #808080;
@@ -5217,3 +5227,8 @@ i.icon-asterisks {
     }
   }
 }
+
+.host-select[disabled] {
+  background-color: #848484;
+  color: #FFF;
+}

ambari-web/app/templates/wizard/step5.hbs

@@ -63,6 +63,7 @@
                       optionLabelPath="content.host_info"
                       selectedHostBinding="selectedHost"
                       componentNameBinding="component_name"
+                      class="host-select"
                       zIdBinding="zId"
                       disabledBinding="isInstalled"
                     }}
@@ -87,7 +88,7 @@
     <div class="mapping-box round-corners well">
       <div class="hostString"><span>{{hostInfo}}</span></div>
       {{#each masterServices}}
-      <span {{bindAttr class="color :assignedService :round-corners"}}>{{display_name}}</span>
+      <span {{bindAttr class="isInstalled:assignedService:newService :round-corners"}}>{{display_name}}</span>
       {{/each}}
     </div>
     {{/each}}