flex for prompt input

airwatch/src/app/chatbot/options-dropdown/options-dropdown.html

@@ -5,25 +5,25 @@
   </div>
 
   <div class="dropwdown">
-    <div class="dropdown-item" (click)="changeModeOption('auto')" [ngClass]="{
+    <div (click)="changeModeOption('auto')" [ngClass]="{
     'is-active' : 'auto' == mode
-    }">
+    }" class="dropdown-item">
       <span class="radio"></span>
       <div class="label">
         Auto mode
       </div>
     </div>
-    <div class="dropdown-item" (click)="changeModeOption('structured')" [ngClass]="{
+    <div (click)="changeModeOption('structured')" [ngClass]="{
     'is-active' : 'structured' == mode
-    }">
+    }" class="dropdown-item">
       <span class="radio"></span>
       <div class="label">
         Structured list
       </div>
     </div>
-    <div class="dropdown-item" (click)="changeModeOption('specific')" [ngClass]="{
+    <div (click)="changeModeOption('specific')" [ngClass]="{
     'is-active' : 'specific' == mode
-    }">
+    }" class="dropdown-item">
       <span class="radio"></span>
       <div class="label">
         Specific question

airwatch/src/app/chatbot/options-dropdown/options-dropdown.scss

@@ -7,7 +7,6 @@
   margin-right: -6em;
 
 
-
   .dropwdown {
     visibility: hidden;
   }
@@ -29,16 +28,6 @@
     text-align: center;
   }
 
-  .is-mode-structured,
-  .is-mode-other,
-  {
-    background: red;
-    border-radius: 100px;
-    width: 20px;
-    position: relative;
-    left: 10px;
-    top: 10px;
-  }
 
   .dropdown-item {
     background: white;
@@ -57,3 +46,18 @@
     }
   }
 }
+
+.is-mode-structured,
+.is-mode-other,
+{
+  .indicator {
+
+    background: red;
+    border-radius: 100px;
+    width: 3px;
+    height: 3px;
+    position: relative;
+    left: 30px;
+    top: -20px;
+  }
+}

airwatch/src/app/chatbot/options-dropdown/options-dropdown.ts

@@ -15,9 +15,15 @@ export type optionsDropdownOptions = 'auto' | 'structured' | 'specific';
 })
 export class OptionsDropdown {
 
-  @Input() public mode: optionsDropdownOptions  = 'auto'
+  @Input() public mode: optionsDropdownOptions = 'structured'
+
+
+  indicator: boolean = false;
 
   changeModeOption(mode: optionsDropdownOptions) {
     this.mode = mode;
+    // show green indicator if we are not in auto mode
+    this.indicator = (mode !== 'auto');
+
   }
 }