From 83809c31efa62449d2fcf2a430f3e917e8d8f57f Mon Sep 17 00:00:00 2001
From: Akankshakutal <44019583+akankshakutal@users.noreply.github.com>
Date: Fri, 6 Mar 2020 16:11:52 +0530
Subject: [PATCH 1/5] Add plugin view specific styles

Github Issue: gocd/gocd#7801
---
 .../resources/views/task.template.html        | 327 ++++++++++--------
 1 file changed, 175 insertions(+), 152 deletions(-)

diff --git a/docker-pipeline-plugin/resources/views/task.template.html b/docker-pipeline-plugin/resources/views/task.template.html
index d4eb5b2..239ecff 100755
--- a/docker-pipeline-plugin/resources/views/task.template.html
+++ b/docker-pipeline-plugin/resources/views/task.template.html
@@ -1,202 +1,225 @@
+<style>
+  .checkbox_row {
+    display: flex;
+  }
+  .checkbox_label{
+    line-height: 1 !important;
+    margin-left: 5px !important;
+  }
+  .inline_instruction{
+    margin-bottom: 10px;
+    color: #666;
+    font-style: italic;
+    clear: left;
+    font-size: 11px;
+   }
+   .input_with_instructions {
+   margin-bottom : 2px !important;
+   }
+
+</style>
 <div class="form_item_block">
-  <div class="checkbox_row">
-    <input id="CleanBeforeTask1" type="checkbox" ng-model="CleanBeforeTask1"
-           ng-init="CleanBeforeTask1 = CleanBeforeTask"
-           ng-change="CleanBeforeTask = CleanBeforeTask1"
-           ng-true-value="true"
-           ng-false-value="false">
-    <input id="CleanBeforeTask" type="hidden" ng-model="CleanBeforeTask" value="{{CleanBeforeTask}}">
-    <label for="CleanBeforeTask">Restart Docker service, stop and remove all containers and images</label>
-  </div><br><br>
-  <h2>Login</h2><br>
-  <div class="form_item_block">
-    <label>Username </label>
-    <input type="text" ng-model="RegistryUsername" ng-required="false">
-    <span class="form_error" ng-show="GOINPUTNAME[RegistryUsername].$error.server">{{ GOINPUTNAME[RegistryUsername].$error.server }}</span>
-  </div>
-
-  <div class="form_item_block">
-    <label>Password </label>
-    <input type="password" ng-model="RegistryPassword" ng-required="false">
-    <span class="form_error" ng-show="GOINPUTNAME[RegistryPassword].$error.server">{{ GOINPUTNAME[RegistryPassword].$error.server }}</span>
-  </div>
-
-  <div class="form_item_block">
-    <label>Registry URL </label>
-    <input type="text" ng-model="RegistryURLForLogin" ng-required="false">
-    <span class="form_error" ng-show="GOINPUTNAME[RegistryURLForLogin].$error.server">{{ GOINPUTNAME[RegistryURLForLogin].$error.server }}</span>
-  </div>
-
-  <div class="checkbox_row">
-    <input id="isPush2" type="checkbox" ng-model="isPush2"
-           ng-init="isPush2 = isPush"
-           ng-change="isPush = isPush2" ng-true-value="true" ng-false-value="false">
-    <input id="pushCheckBox" type="hidden" ng-model="isPush" value="{{isPush}}">
-    <label>Push the resulting image(s)</label>
-  </div>
+    <div class="checkbox_row">
+        <input id="CleanBeforeTask1" type="checkbox" ng-model="CleanBeforeTask1"
+               ng-init="CleanBeforeTask1 = CleanBeforeTask"
+               ng-change="CleanBeforeTask = CleanBeforeTask1"
+               ng-true-value="true"
+               ng-false-value="false">
+        <input id="CleanBeforeTask" type="hidden" ng-model="CleanBeforeTask" value="{{CleanBeforeTask}}">
+        <label for="CleanBeforeTask" class="checkbox_label">Restart Docker service, stop and remove all containers and
+            images</label>
+    </div>
+    <h2>Login</h2>
+    <div class="form_item_block">
+        <label>Username </label>
+        <input type="text" ng-model="RegistryUsername" ng-required="false">
+        <span class="form_error" ng-show="GOINPUTNAME[RegistryUsername].$error.server">{{ GOINPUTNAME[RegistryUsername].$error.server }}</span>
+    </div>
+
+    <div class="form_item_block">
+        <label>Password </label>
+        <input type="password" ng-model="RegistryPassword" ng-required="false">
+        <span class="form_error" ng-show="GOINPUTNAME[RegistryPassword].$error.server">{{ GOINPUTNAME[RegistryPassword].$error.server }}</span>
+    </div>
+
+    <div class="form_item_block">
+        <label>Registry URL </label>
+        <input type="text" ng-model="RegistryURLForLogin" ng-required="false">
+        <span class="form_error" ng-show="GOINPUTNAME[RegistryURLForLogin].$error.server">{{ GOINPUTNAME[RegistryURLForLogin].$error.server }}</span>
+    </div>
+
+    <div class="checkbox_row">
+        <input id="isPush2" type="checkbox" ng-model="isPush2"
+               ng-init="isPush2 = isPush"
+               ng-change="isPush = isPush2" ng-true-value="true" ng-false-value="false">
+        <input id="pushCheckBox" type="hidden" ng-model="isPush" value="{{isPush}}">
+        <label class="checkbox_label">Push the resulting image(s)</label>
+    </div>
 </div>
 
 <div class="form_item_block">
-  <h2>Build</h2>
-
-  <div class="checkbox_row">
-    <input id="BUILD_NO_CACHE2" type="checkbox" ng-model="BUILD_NO_CACHE2"
-           ng-init="BUILD_NO_CACHE2 = BUILD_NO_CACHE"
-           ng-change="BUILD_NO_CACHE = BUILD_NO_CACHE2" ng-true-value="true" ng-false-value="false">
-    <input id="buildNoCache" type="hidden" ng-model="BUILD_NO_CACHE" value="{{BUILD_NO_CACHE}}">
-    <label>Disable cache while building the image (might take MUCH longer)</label>
-  </div>
-
-  <div class="checkbox_row">
-    <input id="BUILD_MICROLABELING2" type="checkbox" ng-model="BUILD_MICROLABELING2"
-           ng-init="BUILD_MICROLABELING2 = BUILD_MICROLABELING"
-           ng-change="BUILD_MICROLABELING = BUILD_MICROLABELING2" ng-true-value="true" ng-false-value="false">
-    <input id="buildMicrolabeling" type="hidden" ng-model="BUILD_MICROLABELING" value="{{BUILD_MICROLABELING}}">
-    <label>Enable microlabeling</label>
-  </div>
-
-  <div class="form_item_block">
-    <label>Build args</label>
-    <input type="text" ng-model="BuildArgs" ng-required="false">
-    <div class="inline_instruction">Provide one or multiple tags separated by ';'. Define a different separator as
-      the
-      VERY FIRST character (example "|arg1=xyz|arg2=123")
-    </div>
-    <span class="form_error" ng-show="GOINPUTNAME[BuildArgs].$error.server">{{ GOINPUTNAME[BuildArgs].$error.server }}</span>
-  </div>
-
-  <div class="form_item_block">
-    <label>Dockerfile path and its name </label>
-    <input type="text" ng-model="DockerFileName" ng-required="false">
-    <div class="inline_instruction">Path and name of Dockerfile relative to repository-root (default is
-      ./Dockerfile).
-    </div>
-    <span class="form_error" ng-show="GOINPUTNAME[DockerFileName].$error.server">{{ GOINPUTNAME[DockerFileName].$error.server }}</span>
-  </div>
+    <h2>Build</h2>
+
+    <div class="checkbox_row">
+        <input id="BUILD_NO_CACHE2" type="checkbox" ng-model="BUILD_NO_CACHE2"
+               ng-init="BUILD_NO_CACHE2 = BUILD_NO_CACHE"
+               ng-change="BUILD_NO_CACHE = BUILD_NO_CACHE2" ng-true-value="true" ng-false-value="false">
+        <input id="buildNoCache" type="hidden" ng-model="BUILD_NO_CACHE" value="{{BUILD_NO_CACHE}}">
+        <label class="checkbox_label">Disable cache while building the image (might take MUCH longer)</label>
+    </div>
+
+    <div class="checkbox_row">
+        <input id="BUILD_MICROLABELING2" type="checkbox" ng-model="BUILD_MICROLABELING2"
+               ng-init="BUILD_MICROLABELING2 = BUILD_MICROLABELING"
+               ng-change="BUILD_MICROLABELING = BUILD_MICROLABELING2" ng-true-value="true" ng-false-value="false">
+        <input id="buildMicrolabeling" type="hidden" ng-model="BUILD_MICROLABELING" value="{{BUILD_MICROLABELING}}">
+        <label class="checkbox_label">Enable microlabeling</label>
+    </div>
+
+    <div class="form_item_block">
+        <label>Build args</label>
+        <input type="text" ng-model="BuildArgs" ng-required="false" class="input_with_instructions">
+        <div class="inline_instruction">Provide one or multiple tags separated by ';'. Define a different separator as
+            the
+            VERY FIRST character (example "|arg1=xyz|arg2=123")
+        </div>
+        <span class="form_error" ng-show="GOINPUTNAME[BuildArgs].$error.server">{{ GOINPUTNAME[BuildArgs].$error.server }}</span>
+    </div>
+
+    <div class="form_item_block">
+        <label>Dockerfile path and its name </label>
+        <input type="text" ng-model="DockerFileName" ng-required="false" class="input_with_instructions">
+        <div class="inline_instruction">Path and name of Dockerfile relative to repository-root (default is
+            ./Dockerfile).
+        </div>
+        <span class="form_error" ng-show="GOINPUTNAME[DockerFileName].$error.server">{{ GOINPUTNAME[DockerFileName].$error.server }}</span>
+    </div>
 </div>
 
 <div class="form_item_block">
-  <h2>Push</h2><br>
-  <div class="form_item_block">
-    <label>Username </label>
-    <input type="text" ng-model="Username" ng-required="false">
+    <h2>Push</h2>
+    <div class="form_item_block">
+        <label>Username </label>
+        <input type="text" ng-model="Username" ng-required="false">
         <span class="form_error"
               ng-show="GOINPUTNAME[Username].$error.server">{{ GOINPUTNAME[Username].$error.server }}</span>
-  </div>
-
-  <div class="form_item_block">
-    <label>Image name </label>
-    <input type="text" ng-model="ImageName" ng-required="false">
-    <span class="form_error" ng-show="GOINPUTNAME[ImageName].$error.server">{{ GOINPUTNAME[ImageName].$error.server }}</span>
-  </div>
+    </div>
 
-  <div class="form_item_block">
-    <label>Image tag </label>
-    <input type="text" ng-model="ImageTag" ng-required="false">
-    <div class="inline_instruction">You must specify at least one tag. Provide multiple tags separated by ';'.
-      Define a
-      different separator as the VERY FIRST character (example "|tag1|tag2")
+    <div class="form_item_block">
+        <label>Image name </label>
+        <input type="text" ng-model="ImageName" ng-required="false">
+        <span class="form_error" ng-show="GOINPUTNAME[ImageName].$error.server">{{ GOINPUTNAME[ImageName].$error.server }}</span>
     </div>
+
+    <div class="form_item_block">
+        <label>Image tag </label>
+        <input type="text" ng-model="ImageTag" ng-required="false" class="input_with_instructions">
+        <div class="inline_instruction">You must specify at least one tag. Provide multiple tags separated by ';'.
+            Define a
+            different separator as the VERY FIRST character (example "|tag1|tag2")
+        </div>
         <span class="form_error"
               ng-show="GOINPUTNAME[ImageTag].$error.server">{{ GOINPUTNAME[ImageTag].$error.server }}</span>
-  </div>
+    </div>
 
-  <div class="form_item_block">
-    <label>Tag postfix</label>
-    <input type="text" ng-model="IMAGE_TAG_POSTFIX" ng-required="false">
-    <span class="form_error" ng-show="GOINPUTNAME[IMAGE_TAG_POSTFIX].$error.server">{{ GOINPUTNAME[IMAGE_TAG_POSTFIX].$error.server }}</span>
-    <div class="inline_instruction">The tag postfix will be appended to all tags like "...:tag-postfix"</div>
-  </div>
+    <div class="form_item_block">
+        <label>Tag postfix</label>
+        <input type="text" ng-model="IMAGE_TAG_POSTFIX" ng-required="false" class="input_with_instructions">
+        <span class="form_error" ng-show="GOINPUTNAME[IMAGE_TAG_POSTFIX].$error.server">{{ GOINPUTNAME[IMAGE_TAG_POSTFIX].$error.server }}</span>
+        <div class="inline_instruction">The tag postfix will be appended to all tags like "...:tag-postfix"</div>
+    </div>
 
 </div>
 
 <div class="form_item_block">
-  <h2>Run</h2>
-  <div class="inline_instruction">Run an arbritrary container from inside the task. The current pipeline directory
-    can be accessed as a volume and is set as the initial working directory.</div>
+    <h2 class="input_with_instructions">Run</h2>
+    <div class="inline_instruction">Run an arbritrary container from inside the task. The current pipeline directory
+        can be accessed as a volume and is set as the initial working directory.
+    </div>
 
-  <div class="form_item_block">
-    <label>Image</label>
-    <input type="text" ng-model="RUN_IMAGE" ng-required="false">
+    <div class="form_item_block">
+        <label>Image</label>
+        <input type="text" ng-model="RUN_IMAGE" ng-required="false">
         <span class="form_error"
               ng-show="GOINPUTNAME[RUN_IMAGE].$error.server">{{ GOINPUTNAME[RUN_IMAGE].$error.server }}</span>
-  </div>
+    </div>
 
-  <div class="form_item_block">
-    <label>Environment variables</label>
-    <input type="text" ng-model="RUN_ENV_VARS" ng-required="false">
-    <div class="inline_instruction">Provide one or multiple vars separated by ';'. Define a different separator as
-      the
-      VERY FIRST character (example "|arg1=xyz|arg2=123")
+    <div class="form_item_block">
+        <label>Environment variables</label>
+        <input type="text" ng-model="RUN_ENV_VARS" ng-required="false" class="input_with_instructions">
+        <div class="inline_instruction">Provide one or multiple vars separated by ';'. Define a different separator as
+            the
+            VERY FIRST character (example "|arg1=xyz|arg2=123")
+        </div>
+        <span class="form_error" ng-show="GOINPUTNAME[RUN_ENV_VARS].$error.server">{{ GOINPUTNAME[RUN_ENV_VARS].$error.server }}</span>
     </div>
-    <span class="form_error" ng-show="GOINPUTNAME[RUN_ENV_VARS].$error.server">{{ GOINPUTNAME[RUN_ENV_VARS].$error.server }}</span>
-  </div>
 
-  <div class="form_item_block">
-    <label>Command and args</label>
-    <input type="text" ng-model="RUN_ARGS" ng-required="false">
+    <div class="form_item_block">
+        <label>Command and args</label>
+        <input type="text" ng-model="RUN_ARGS" ng-required="false">
         <span class="form_error"
               ng-show="GOINPUTNAME[RUN_ARGS].$error.server">{{ GOINPUTNAME[RUN_ARGS].$error.server }}</span>
-  </div>
+    </div>
 
-  <div class="form_item_block">
     <div class="form_item_block">
-      <label>BEFORE run, copy FROM </label>
-      <input type="text" ng-model="RUN_PRE_COPY_FROM" ng-required="false">
+        <div class="form_item_block">
+            <label>BEFORE run, copy FROM </label>
+            <input type="text" ng-model="RUN_PRE_COPY_FROM" ng-required="false">
             <span class="form_error"
                   ng-show="GOINPUTNAME[RUN_PRE_COPY_FROM].$error.server">{{ GOINPUTNAME[RUN_PRE_COPY_FROM].$error.server }}</span>
-    </div>
+        </div>
 
 
-    <div class="form_item_block">
-      <label>BEFORE run, copy TO </label>
-      <input type="text" ng-model="RUN_PRE_COPY_TO" ng-required="false">
+        <div class="form_item_block">
+            <label>BEFORE run, copy TO </label>
+            <input type="text" ng-model="RUN_PRE_COPY_TO" ng-required="false">
             <span class="form_error"
                   ng-show="GOINPUTNAME[RUN_PRE_COPY_TO].$error.server">{{ GOINPUTNAME[RUN_PRE_COPY_TO].$error.server }}</span>
-    </div>
+        </div>
 
-    <div class="form_item_block">
-      <label>AFTER run, copy FROM </label>
-      <input type="text" ng-model="RUN_POST_COPY_FROM" ng-required="false">
+        <div class="form_item_block">
+            <label>AFTER run, copy FROM </label>
+            <input type="text" ng-model="RUN_POST_COPY_FROM" ng-required="false">
             <span class="form_error"
                   ng-show="GOINPUTNAME[RUN_POST_COPY_FROM].$error.server">{{ GOINPUTNAME[RUN_POST_COPY_FROM].$error.server }}</span>
-    </div>
+        </div>
 
 
-    <div class="form_item_block">
-      <label>AFTER run, copy TO </label>
-      <input type="text" ng-model="RUN_POST_COPY_TO" ng-required="false">
+        <div class="form_item_block">
+            <label>AFTER run, copy TO </label>
+            <input type="text" ng-model="RUN_POST_COPY_TO" ng-required="false">
             <span class="form_error"
                   ng-show="GOINPUTNAME[RUN_POST_COPY_TO].$error.server">{{ GOINPUTNAME[RUN_POST_COPY_TO].$error.server }}</span>
+        </div>
     </div>
-  </div>
 
 </div>
 
 <div class="form_item_block">
-  <h2>Cleanup</h2>
+    <h2>Cleanup</h2>
 
-  <div class="form_item_block">
-    <div class="checkbox_row">
-      <input id="CleanAfterTask1" type="checkbox" ng-model="CleanAfterTask1"
-             ng-init="CleanAfterTask1 = CleanAfterTask"
-             ng-change="CleanAfterTask = CleanAfterTask1"
-             ng-true-value="true"
-             ng-false-value="false">
-      <input id="CleanAfterTask" type="hidden" ng-model="CleanAfterTask" value="{{CleanAfterTask}}">
-      <label for="CleanAfterTask">Remove all the exited containers and dangling images</label>
+    <div class="form_item_block">
+        <div class="checkbox_row">
+            <input id="CleanAfterTask1" type="checkbox" ng-model="CleanAfterTask1"
+                   ng-init="CleanAfterTask1 = CleanAfterTask"
+                   ng-change="CleanAfterTask = CleanAfterTask1"
+                   ng-true-value="true"
+                   ng-false-value="false">
+            <input id="CleanAfterTask" type="hidden" ng-model="CleanAfterTask" value="{{CleanAfterTask}}">
+            <label for="CleanAfterTask" class="checkbox_label">Remove all the exited containers and dangling
+                images</label>
+        </div>
     </div>
-  </div>
 
-  <div class="form_item_block">
-    <div class="checkbox_row">
-      <input id="CleanAfterTask2" type="checkbox" ng-model="CleanAfterTask2"
-             ng-init="CleanAfterTask2 = CleanAfterComplete"
-             ng-change="CleanAfterComplete = CleanAfterTask2"
-             ng-true-value="true"
-             ng-false-value="false">
-      <input id="CleanAfterComplete" type="hidden" ng-model="CleanAfterComplete" value="{{CleanAfterComplete}}">
-      <label for="CleanAfterComplete">Remove all images and containers</label>
-    </div>
-  </div>
+    <div class="form_item_block">
+        <div class="checkbox_row">
+            <input id="CleanAfterTask2" type="checkbox" ng-model="CleanAfterTask2"
+                   ng-init="CleanAfterTask2 = CleanAfterComplete"
+                   ng-change="CleanAfterComplete = CleanAfterTask2"
+                   ng-true-value="true"
+                   ng-false-value="false">
+            <input id="CleanAfterComplete" type="hidden" ng-model="CleanAfterComplete" value="{{CleanAfterComplete}}">
+            <label for="CleanAfterComplete" class="checkbox_label">Remove all images and containers</label>
+        </div>
+    </div>
 </div>

From bdfb85a6f2dbd79cf49270b10960299e0c72ca88 Mon Sep 17 00:00:00 2001
From: Akanksha Kutal <akankshakutal@Akankshas-MacBook-Pro.local>
Date: Fri, 6 Mar 2020 16:45:04 +0530
Subject: [PATCH 2/5] Add plugin view specific styles for check_mk_plugin

Github Issue: gocd/gocd#7801
---
 .../resources/views/checkMk.template.html     | 30 ++++++++++++-------
 1 file changed, 19 insertions(+), 11 deletions(-)

diff --git a/check_mk-plugin/resources/views/checkMk.template.html b/check_mk-plugin/resources/views/checkMk.template.html
index 2f93da0..d7aef30 100755
--- a/check_mk-plugin/resources/views/checkMk.template.html
+++ b/check_mk-plugin/resources/views/checkMk.template.html
@@ -1,9 +1,17 @@
+<style>
+    .asterisk {
+        color : red;
+    }
+    textarea {
+        min-height: 100px;
+    }
+</style>
 <div class="form_item_block">
     <label>CheckMK server:<span class="asterisk">*</span>
     </label>
     <textarea ng-model="Server" ng-required="true"></textarea>
     <div role="alert">
-      <span class="error" color="red" ng-show="GOINPUTNAME[Server].$error.required" >Required!</span>
+        <span class="error" color="red" ng-show="GOINPUTNAME[Server].$error.required">Required!</span>
     </div>
 </div>
 <div class="form_item_block">
@@ -11,7 +19,7 @@
     </label>
     <input type="text" ng-model="Username" ng-required="true">
     <div role="alert">
-        <span class="error" color="red" ng-show="GOINPUTNAME[Username].$error.required" >Required!</span>
+        <span class="error" color="red" ng-show="GOINPUTNAME[Username].$error.required">Required!</span>
     </div>
 </div>
 <div class="form_item_block">
@@ -19,10 +27,10 @@
     </label>
     <input type="password" name="password" ng-model="Password" ng-required="true">
     <div role="alert">
-        <span class="error" color="red" ng-show="GOINPUTNAME[Password].$error.required" >Required!</span>
+        <span class="error" color="red" ng-show="GOINPUTNAME[Password].$error.required">Required!</span>
     </div>
 </div>
-<select ng-init="SelectedAction='default'" ng-model="SelectedAction" >
+<select ng-init="SelectedAction='default'" ng-model="SelectedAction">
     <option selected disabled value="default">Select action</option>
     <option value="add">Add Host</option>
     <option value="edit">Edit Host</option>
@@ -38,7 +46,7 @@
             <input type="text" ng-model="Hostname" ng-required="true">
             </input>
             <div role="alert">
-                <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required" >Required!</span>
+                <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required">Required!</span>
             </div>
         </div>
         <div class="form_item_block">
@@ -47,7 +55,7 @@
             <input type="text" ng-model="HostIp" ng-required="true">
             </input>
             <div role="alert">
-                <span class="error" color="red" ng-show="GOINPUTNAME[HostIp].$error.required" >Required!</span>
+                <span class="error" color="red" ng-show="GOINPUTNAME[HostIp].$error.required">Required!</span>
             </div>
         </div>
         <div class="form_item_block">
@@ -56,7 +64,7 @@
             <input type="text" ng-model="FolderPath" ng-required="true">
             </input>
             <div role="alert">
-                <span class="error" color="red" ng-show="GOINPUTNAME[FolderPath].$error.required" >Required!</span>
+                <span class="error" color="red" ng-show="GOINPUTNAME[FolderPath].$error.required">Required!</span>
             </div>
         </div>
     </div>
@@ -67,7 +75,7 @@
             <input type="text" ng-model="Hostname" ng-required="true">
             </input>
             <div role="alert">
-                <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required" >Required!</span>
+                <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required">Required!</span>
             </div>
         </div>
         <div class="form_item_block">
@@ -76,7 +84,7 @@
             <input type="text" ng-model="HostIp" ng-required="true">
             </input>
             <div role="alert">
-                <span class="error" color="red" ng-show="GOINPUTNAME[HostIp].$error.required" >Required!</span>
+                <span class="error" color="red" ng-show="GOINPUTNAME[HostIp].$error.required">Required!</span>
             </div>
         </div>
         <div class="form_item_block">
@@ -85,7 +93,7 @@
             <input type="text" ng-model="FolderPath" ng-required="true">
             </input>
             <div role="alert">
-                <span class="error" color="red" ng-show="GOINPUTNAME[FolderPath].$error.required" >Required!</span>
+                <span class="error" color="red" ng-show="GOINPUTNAME[FolderPath].$error.required">Required!</span>
             </div>
         </div>
     </div>
@@ -96,7 +104,7 @@
             <input type="text" ng-model="Hostname" ng-required="true">
             </input>
             <div role="alert">
-                <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required" >Required!</span>
+                <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required">Required!</span>
             </div>
         </div>
     </div>

From 735c546dbd295f02fa2e9efb2ffa0083ebb5bbb0 Mon Sep 17 00:00:00 2001
From: Akanksha Kutal <akankshakutal@Akankshas-MacBook-Pro.local>
Date: Fri, 6 Mar 2020 20:16:28 +0530
Subject: [PATCH 3/5] Add view specific styles for docker compose plugin

Github Issue: gocd/gocd#7801
---
 .../resources/views/task.template.html        | 53 +++++++++++--------
 1 file changed, 31 insertions(+), 22 deletions(-)

diff --git a/docker-compose-plugin/resources/views/task.template.html b/docker-compose-plugin/resources/views/task.template.html
index 7daf488..6b9cc05 100644
--- a/docker-compose-plugin/resources/views/task.template.html
+++ b/docker-compose-plugin/resources/views/task.template.html
@@ -1,14 +1,25 @@
+<style>
+    .asterisk {
+        color : red;
+    }
+    .checkbox_row {
+    display: flex;
+  }
+  .checkbox_label{
+    line-height: 1 !important;
+    margin-left: 5px !important;
+  }
+
+</style>
 <div class="form_item_block">
     <h2>Docker Compose</h2>
     <div class="form_item_block">
         <label>Logical name of dockerhost<span class="asterisk">*</span></label>
         <input type="text" ng-model="vmname" ng-required="true">
-        </input>
     </div>
     <div class="form_item_block">
         <label>Service(s) to *explicitly* build</label>
         <input type="text" ng-model="COMPOSE_BUILD" ng-required="false">
-        </input>
     </div>
 
     <!--
@@ -29,13 +40,11 @@ <h2>Docker Compose</h2>
 
     <div class="form_item_block">
         <div class="checkbox_row">
-            <div class="checkbox_label_wrapper">
-                <input id="FORCE_BUILD_ONLY2" type="checkbox" ng-model="FORCE_BUILD_ONLY2"
-                       ng-init="FORCE_BUILD_ONLY2 = FORCE_BUILD_ONLY"
-                       ng-change="FORCE_BUILD_ONLY = FORCE_BUILD_ONLY2" ng-true-value="true" ng-false-value="false"/>
-                <input id="FORCE_BUILD_ONLY" type="hidden" ng-model="FORCE_BUILD_ONLY" value="{{FORCE_BUILD_ONLY}}"/>
-                <label>Do NOT start any services.</label>
-            </div>
+            <input id="FORCE_BUILD_ONLY2" type="checkbox" ng-model="FORCE_BUILD_ONLY2"
+                   ng-init="FORCE_BUILD_ONLY2 = FORCE_BUILD_ONLY"
+                   ng-change="FORCE_BUILD_ONLY = FORCE_BUILD_ONLY2" ng-true-value="true" ng-false-value="false"/>
+            <input id="FORCE_BUILD_ONLY" type="hidden" ng-model="FORCE_BUILD_ONLY" value="{{FORCE_BUILD_ONLY}}"/>
+            <label class="checkbox_label">Do NOT start any services.</label>
         </div>
     </div>
     <div class="form_item_block">
@@ -43,7 +52,7 @@ <h2>Docker Compose</h2>
             <input id="FORCE_BUILD2" type="checkbox" ng-model="FORCE_BUILD2" ng-init="FORCE_BUILD2 = FORCE_BUILD"
                    ng-change="FORCE_BUILD = FORCE_BUILD2" ng-true-value="true" ng-false-value="false">
             <input id="FORCE_BUILD" type="hidden" ng-model="FORCE_BUILD" value="{{FORCE_BUILD}}">
-            <label>Force a 'build', even if *local* resources/files are NOT modified.</label>
+            <label class="checkbox_label">Force a 'build', even if *local* resources/files are NOT modified.</label>
         </div>
     </div>
     <div class="form_item_block">
@@ -52,7 +61,7 @@ <h2>Docker Compose</h2>
                    ng-init="COMPOSE_NO_CACHE2 = COMPOSE_NO_CACHE"
                    ng-change="COMPOSE_NO_CACHE = COMPOSE_NO_CACHE2" ng-true-value="true" ng-false-value="false">
             <input id="COMPOSE_NO_CACHE" type="hidden" ng-model="COMPOSE_NO_CACHE" value="{{COMPOSE_NO_CACHE}}">
-            <label>Force a 'build' WITHOUT using already cached layers.</label>
+            <label class="checkbox_label">Force a 'build' WITHOUT using already cached layers.</label>
         </div>
     </div>
     <div class="form_item_block">
@@ -63,7 +72,7 @@ <h2>Docker Compose</h2>
                    ng-false-value="false">
             <input id="COMPOSE_REMOVE_VOLUMES" type="hidden" ng-model="COMPOSE_REMOVE_VOLUMES"
                    value="{{COMPOSE_REMOVE_VOLUMES}}">
-            <label>Remove volumes associated with containers.</label>
+            <label class="checkbox_label">Remove volumes associated with containers.</label>
         </div>
     </div>
     <div class="form_item_block">
@@ -74,7 +83,7 @@ <h2>Docker Compose</h2>
                    ng-false-value="false">
             <input id="COMPOSE_DOWN" type="hidden" ng-model="COMPOSE_DOWN"
                    value="{{COMPOSE_DOWN}}">
-            <label>Issue a "compose down" command</label>
+            <label class="checkbox_label">Issue a "compose down" command</label>
         </div>
     </div>
     <div class="form_item_block">
@@ -82,7 +91,7 @@ <h2>Docker Compose</h2>
             <input id="FORCE_PULL2" type="checkbox" ng-model="FORCE_PULL2" ng-init="FORCE_PULL2 = FORCE_PULL"
                    ng-change="FORCE_PULL = FORCE_PULL2" ng-true-value="true" ng-false-value="false">
             <input id="FORCE_PULL" type="hidden" ng-model="FORCE_PULL" value="{{FORCE_PULL}}">
-            <label>Update images used in the docker-compose file.</label>
+            <label class="checkbox_label">Update images used in the docker-compose file.</label>
         </div>
     </div>
     <div class="form_item_block">
@@ -106,14 +115,14 @@ <h2>Docker Compose</h2>
                    ng-init="FORCE_RECREATE2 = FORCE_RECREATE"
                    ng-change="FORCE_RECREATE = FORCE_RECREATE2" ng-true-value="true" ng-false-value="false">
             <input id="FORCE_RECREATE" type="hidden" ng-model="FORCE_RECREATE" value="{{FORCE_RECREATE}}">
-            <label>Force recreation of containers (e.g. For restarting init)</label>
+            <label class="checkbox_label">Force recreation of containers (e.g. For restarting init)</label>
         </div>
     </div>
-<!--
-    <div class="form_item_block">
-        <label>Create an deployment bundle (*.dab)</label>
-        <input type="text" ng-model="BUNDLE_OUTPUT_PATH" ng-required="false">
-        </input>
-    </div>
--->
+    <!--
+        <div class="form_item_block">
+            <label>Create an deployment bundle (*.dab)</label>
+            <input type="text" ng-model="BUNDLE_OUTPUT_PATH" ng-required="false">
+            </input>
+        </div>
+    -->
 </div>

From 7f96dd7e555465c32bdb592e7a49a68e10450229 Mon Sep 17 00:00:00 2001
From: Akanksha Kutal <akankshakutal@Akankshas-MacBook-Pro.local>
Date: Sat, 7 Mar 2020 10:23:47 +0530
Subject: [PATCH 4/5] Add plugin view specific styles for fetch any artifact

Github Issue: gocd/gocd#7801
---
 .../resources/views/task.template.html        | 13 +++++-----
 .../resources/views/task.template.html        | 24 ++++++++++++-------
 2 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/docker-compose-plugin/resources/views/task.template.html b/docker-compose-plugin/resources/views/task.template.html
index 6b9cc05..0006f42 100644
--- a/docker-compose-plugin/resources/views/task.template.html
+++ b/docker-compose-plugin/resources/views/task.template.html
@@ -3,13 +3,12 @@
         color : red;
     }
     .checkbox_row {
-    display: flex;
-  }
-  .checkbox_label{
-    line-height: 1 !important;
-    margin-left: 5px !important;
-  }
-
+        display: flex;
+    }
+    .checkbox_label {
+        line-height: 1 !important;
+        margin-left: 5px !important;
+    }
 </style>
 <div class="form_item_block">
     <h2>Docker Compose</h2>
diff --git a/fetch-any-artifact-plugin/resources/views/task.template.html b/fetch-any-artifact-plugin/resources/views/task.template.html
index b8df2a5..97c056a 100755
--- a/fetch-any-artifact-plugin/resources/views/task.template.html
+++ b/fetch-any-artifact-plugin/resources/views/task.template.html
@@ -1,3 +1,15 @@
+<style>
+    .checkbox_row {
+        display: flex;
+    }
+    .checkbox_label {
+        line-height: 1 !important;
+        margin-left: 5px !important;
+    }
+    .asterisk {
+        color :red;
+    }
+</style>
 <!-- <div class="form_item_block">
     <div class="checkbox_row">
         <input id="Masking2" type="checkbox" ng-model="Masking2" ng-init="Masking2 = Masking"
@@ -9,35 +21,32 @@
 </div> -->
 <div class="form_item_block">
     <h1>Prerequisites</h1>
-    This plugin uses the environment variables <b>GO_BUILD_USER</b> and <b>GO_BUILD_USER_PASSWORD</b> to access the go-servers REST API.
+    This plugin uses the environment variables <b>GO_BUILD_USER</b> and <b>GO_BUILD_USER_PASSWORD</b> to access the
+    go-servers REST API.
     <a href="https://docs.go.cd/current/faq/dev_use_current_revision_in_build.html">See documentation in GoCD</a>
 </div>
 <div class="form_item_block">
     <label>Pipeline
     </label>
     <input type="text" ng-model="FAA_PIPELINE_NAME">
-    </input>
     <span class="form_error" ng-show="GOINPUTNAME[FAA_PIPELINE_NAME].$error.server">{{ GOINPUTNAME[FAA_PIPELINE_NAME].$error.server }}</span>
 </div>
 <div class="form_item_block">
     <label>Stage
     </label>
     <input type="text" ng-model="FAA_STAGE_NAME">
-    </input>
     <span class="form_error" ng-show="GOINPUTNAME[FAA_STAGE_NAME].$error.server">{{ GOINPUTNAME[FAA_STAGE_NAME].$error.server }}</span>
 </div>
 <div class="form_item_block">
     <label>Job
     </label>
     <input type="text" ng-model="FAA_JOB_NAME">
-    </input>
     <span class="form_error" ng-show="GOINPUTNAME[FAA_JOB_NAME].$error.server">{{ GOINPUTNAME[FAA_JOB_NAME].$error.server }}</span>
 </div>
 <div class="form_item_block">
     <label>Source<span class="asterisk">*</span>
     </label>
     <input type="text" ng-model="FAA_ARTIFACT_SOURCE" ng-required="true">
-    </input>
     <span class="form_error" ng-show="GOINPUTNAME[FAA_ARTIFACT_SOURCE].$error.server">{{ GOINPUTNAME[FAA_ARTIFACT_SOURCE].$error.server }}</span>
 </div>
 <div class="form_item_block">
@@ -46,7 +55,7 @@ <h1>Prerequisites</h1>
                ng-init="FAA_ARTIFACT_IS_FILE2 = FAA_ARTIFACT_IS_FILE"
                ng-change="FAA_ARTIFACT_IS_FILE = FAA_ARTIFACT_IS_FILE2" ng-true-value="true" ng-false-value="false">
         <input id="specifytargets" type="hidden" ng-model="FAA_ARTIFACT_IS_FILE" value="{{FAA_ARTIFACT_IS_FILE}}">
-        <label>Artifact is file
+        <label class="checkbox_label">Artifact is file
         </label>
     </div>
 </div>
@@ -56,7 +65,7 @@ <h1>Prerequisites</h1>
                ng-init="FAA_FETCH_IF_FAILED2 = FAA_FETCH_IF_FAILED"
                ng-change="FAA_FETCH_IF_FAILED = FAA_FETCH_IF_FAILED2" ng-true-value="true" ng-false-value="false">
         <input id="fetchiffailed" type="hidden" ng-model="FAA_FETCH_IF_FAILED" value="{{FAA_FETCH_IF_FAILED}}">
-        <label>Fetch even if failed
+        <label class="checkbox_label">Fetch even if failed
         </label>
     </div>
 </div>
@@ -64,6 +73,5 @@ <h1>Prerequisites</h1>
     <label>Destination
     </label>
     <input type="text" ng-model="FAA_ARTIFACT_DESTINATION">
-    </input>
     <span class="form_error" ng-show="GOINPUTNAME[FAA_ARTIFACT_DESTINATION].$error.server">{{ GOINPUTNAME[FAA_ARTIFACT_DESTINATION].$error.server }}</span>
 </div>

From 7d09748735a0860989b214abcb022fd94de76252 Mon Sep 17 00:00:00 2001
From: Akanksha Kutal <akankshakutal@Akankshas-MacBook-Pro.local>
Date: Sat, 7 Mar 2020 12:21:37 +0530
Subject: [PATCH 5/5] Add plugin view specific styles

Github Issue: gocd/gocd#7801
---
 .../resources/views/checkMk.template.html     |  8 +--
 .../resources/views/task.template.html        | 40 +++---------
 .../resources/views/task.template.html        |  5 ++
 .../resources/views/task.template.html        | 61 ++++++++++---------
 .../resources/views/task.template.html        | 44 ++++++-------
 5 files changed, 68 insertions(+), 90 deletions(-)

diff --git a/check_mk-plugin/resources/views/checkMk.template.html b/check_mk-plugin/resources/views/checkMk.template.html
index d7aef30..f649648 100755
--- a/check_mk-plugin/resources/views/checkMk.template.html
+++ b/check_mk-plugin/resources/views/checkMk.template.html
@@ -5,6 +5,7 @@
     textarea {
         min-height: 100px;
     }
+
 </style>
 <div class="form_item_block">
     <label>CheckMK server:<span class="asterisk">*</span>
@@ -44,7 +45,6 @@
             <label>Hostname:<span class="asterisk">*</span>
             </label>
             <input type="text" ng-model="Hostname" ng-required="true">
-            </input>
             <div role="alert">
                 <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required">Required!</span>
             </div>
@@ -53,7 +53,6 @@
             <label>Host ip:<span class="asterisk">*</span>
             </label>
             <input type="text" ng-model="HostIp" ng-required="true">
-            </input>
             <div role="alert">
                 <span class="error" color="red" ng-show="GOINPUTNAME[HostIp].$error.required">Required!</span>
             </div>
@@ -62,7 +61,6 @@
             <label>Folder path:<span class="asterisk">*</span>
             </label>
             <input type="text" ng-model="FolderPath" ng-required="true">
-            </input>
             <div role="alert">
                 <span class="error" color="red" ng-show="GOINPUTNAME[FolderPath].$error.required">Required!</span>
             </div>
@@ -73,7 +71,6 @@
             <label>Hostname:<span class="asterisk">*</span>
             </label>
             <input type="text" ng-model="Hostname" ng-required="true">
-            </input>
             <div role="alert">
                 <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required">Required!</span>
             </div>
@@ -82,7 +79,6 @@
             <label>New Host ip:<span class="asterisk">*</span>
             </label>
             <input type="text" ng-model="HostIp" ng-required="true">
-            </input>
             <div role="alert">
                 <span class="error" color="red" ng-show="GOINPUTNAME[HostIp].$error.required">Required!</span>
             </div>
@@ -91,7 +87,6 @@
             <label>New Folder path:<span class="asterisk">*</span>
             </label>
             <input type="text" ng-model="FolderPath" ng-required="true">
-            </input>
             <div role="alert">
                 <span class="error" color="red" ng-show="GOINPUTNAME[FolderPath].$error.required">Required!</span>
             </div>
@@ -102,7 +97,6 @@
             <label>Hostname:<span class="asterisk">*</span>
             </label>
             <input type="text" ng-model="Hostname" ng-required="true">
-            </input>
             <div role="alert">
                 <span class="error" color="red" ng-show="GOINPUTNAME[Hostname].$error.required">Required!</span>
             </div>
diff --git a/docker-machine-plugin/resources/views/task.template.html b/docker-machine-plugin/resources/views/task.template.html
index 6411b89..fa0ad99 100644
--- a/docker-machine-plugin/resources/views/task.template.html
+++ b/docker-machine-plugin/resources/views/task.template.html
@@ -1,10 +1,15 @@
+<style>
+   .asterisk {
+      color : red;
+   }
+</style>
 <a href="https://docs.docker.com/machine/reference/create/">Docker create documentation</a>
 <br>
 <div class="form_item_block">
     <div class="form_item_block">
-        <label>Name(s) of the virtual machine(s). Format is text[format,start,stop,step]text. You can enter multiple names, separated with a semicolon. <span class="asterisk">*</span></label>
+        <label>Name(s) of the virtual machine(s). Format is text[format,start,stop,step]text. You can enter multiple
+            names, separated with a semicolon. <span class="asterisk">*</span></label>
         <input type="text" ng-model="VMNAME" ng-required="true">
-        </input>
     </div>
 </div>
 <div class="form_item_block">
@@ -16,12 +21,11 @@
 <div class="form_item_block">
     <label>Specify environment variables to set in the engine</label>
     <input type="text" ng-model="ENGINE_ENV" ng-required="false">
-    </input>
 </div>
 <div class="form_item_block">
-    <label>Specify arbitrary daemon options with the syntax name=value. Multiple pairs can be provided separated by ','</label>
+    <label>Specify arbitrary daemon options with the syntax name=value. Multiple pairs can be provided separated by
+        ','</label>
     <input type="text" ng-model="ENGINE_OPT" ng-required="false">
-    </input>
 </div>
 <div class="form_item_block">
     <H2>Driver used by create</H2>
@@ -38,27 +42,22 @@ <H2>Generic Driver</H2>
         <div class="form_item_block">
             <label>Path to the SSH user private key (must be accessible from go-agent!)</label>
             <input type="text" ng-model="GENERIC_SSH_KEY">
-            </input>
         </div>
         <div class="form_item_block">
             <label>SSH username used to connect</label>
             <input type="text" ng-model="GENERIC_SSH_USER">
-            </input>
         </div>
         <div class="form_item_block">
             <label>IP Address of host</label>
             <input type="text" ng-model="GENERIC_IP_ADDRESS">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Port to use for SSH</label>
             <input type="text" ng-model="GENERIC_SSH_PORT">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Port to use for Docker Daemon (Note: This flag will not work with boot2docker).</label>
             <input type="text" ng-model="GENERIC_ENGINE_PORT">
-            </input>
         </div>
     </div>
 </div>
@@ -68,43 +67,34 @@ <H2>VMWare VSphere Driver</H2>
         <div class="form_item_block">
             <label>Username</label>
             <input type="text" ng-model="VSPHERE_USERNAME">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Password</label>
             <input type="password" ng-model="VSPHERE_PASSWORD">
-            </input>
         </div>
         <div class="form_item_block">
             <label>IP/hostname for vCenter or ESXi</label>
             <input type="text" ng-model="VSPHERE_VCENTER">
-            </input>
         </div>
         <div class="form_item_block">
             <label>DataCenter (for ESXi use ha-datacenter)</label>
             <input type="text" ng-model="VSPHERE_DATACENTER">
-            </input>
         </div>
-
         <div class="form_item_block">
             <label>CPU count</label>
             <input type="text" ng-model="VSPHERE_CPU_COUNT">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Memory size</label>
             <input type="text" ng-model="VSPHERE_MEMORY_SIZE">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Disk size</label>
             <input type="text" ng-model="VSPHERE_DISK_SIZE">
-            </input>
         </div>
         <div class="form_item_block">
             <label>URL of BootImage</label>
             <input type="text" ng-model="VSPHERE_BOOT2DOCKER_URL">
-            </input>
         </div>
     </div>
 </div>
@@ -114,63 +104,51 @@ <H2>Azure Driver</H2>
         <div class="form_item_block">
             <label>Your Azure Subscription ID</label>
             <input type="text" ng-model="AZURE_SUBSCRIPTION_ID">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Azure environment (e.g. AzurePublicCloud, AzureChinaCloud)</label>
             <input type="text" ng-model="AZURE_ENVIRONMENT">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Azure virtual machine image in the format of Publisher:Offer:Sku:Version</label>
             <input type="text" ng-model="AZURE_IMAGE">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Azure region to create the virtual machine</label>
             <input type="text" ng-model="AZURE_LOCATION">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Azure Resource Group name to create the resources in.</label>
             <input type="text" ng-model="AZURE_RESOURCE_GROUP">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Size for Azure Virtual Machine</label>
             <input type="text" ng-model="AZURE_SIZE">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Username for SSH login</label>
             <input type="text" ng-model="AZURE_SSH_USER">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Azure Virtual Network name to connect the virtual machine</label>
             <input type="text" ng-model="AZURE_VNET">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Azure Subnet Name to be used within the Virtual Network.</label>
             <input type="text" ng-model="AZURE_SUBNET">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Private CIDR block. Used to create subnet if it does not exist. Must match in the case that the
                 subnet does exist.</label>
             <input type="text" ng-model="AZURE_SUBNET_PREFIX">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Azure Availability Set to place the virtual machine into</label>
             <input type="text" ng-model="AZURE_AVAILABILITY_SET">
-            </input>
         </div>
         <div class="form_item_block">
             <label>Port number for Docker engine </label>
             <input type="text" ng-model="AZURE_DOCKER_PORT">
-            </input>
         </div>
     </div>
 </div>
diff --git a/fortify-plugin/resources/views/task.template.html b/fortify-plugin/resources/views/task.template.html
index 6409796..fb90a25 100755
--- a/fortify-plugin/resources/views/task.template.html
+++ b/fortify-plugin/resources/views/task.template.html
@@ -1,3 +1,8 @@
+<style>
+   .asterisk {
+      color :red;
+   }
+</style>
 <div class="form_item_block">
   <label>Username: <span class="asterisk">*</span>
   </label>
diff --git a/nessus-scan-plugin/resources/views/task.template.html b/nessus-scan-plugin/resources/views/task.template.html
index 6e6e21b..09b42d2 100644
--- a/nessus-scan-plugin/resources/views/task.template.html
+++ b/nessus-scan-plugin/resources/views/task.template.html
@@ -1,46 +1,47 @@
+<style>
+   .asterisk {
+      color :red;
+   }
+</style>
 <div class="form_item_block">
-  <label>IP of server to scan:<span class="asterisk">*</span>
-  </label>
-  <input type="text" ng-model="ServerIp" ng-required="true">
-  </input>
-  <span class="form_error" ng-show="GOINPUTNAME[ServerIp].$error.ip">Incorrect IP Adress</span>
+    <label>IP of server to scan:<span class="asterisk">*</span>
+    </label>
+    <input type="text" ng-model="ServerIp" ng-required="true">
+    <span class="form_error" ng-show="GOINPUTNAME[ServerIp].$error.ip">Incorrect IP Adress</span>
 </div>
 <div class="form_item_block">
-  <label>Scan Template:<span class="asterisk">*</span>
-  </label>
-  <input type="text" ng-model="ScanTemplate" ng-required="true">
-  </input>
+    <label>Scan Template:<span class="asterisk">*</span>
+    </label>
+    <input type="text" ng-model="ScanTemplate" ng-required="true">
 </div>
 <div class="form_item_block">
-  <label>Policy ID:<span class="asterisk">*</span>
-  </label>
-  <input type="text" ng-model="Policy" ng-required="true">
-  </input>
+    <label>Policy ID:<span class="asterisk">*</span>
+    </label>
+    <input type="text" ng-model="Policy" ng-required="true">
 </div>
 <div class="form_item_block">
-  <label>Fail issue type:</label>
-  <select ng-model="IssueTypeFail">
-    <option value="critical">Critical</option>
-    <option value="high">High and Critical</option>
-    <option value="medium">Medium, High and Critical</option>
-    <option value="any">Any</option>
-  </select>
+    <label>Fail issue type:</label>
+    <select ng-model="IssueTypeFail">
+        <option value="critical">Critical</option>
+        <option value="high">High and Critical</option>
+        <option value="medium">Medium, High and Critical</option>
+        <option value="any">Any</option>
+    </select>
 </div>
 <div class="form_item_block">
-  <label>Nessus Api Url<span class="asterisk">*</span>
-  </label>
-  <input type="text" ng-model="NessusApiUrl" ng-required="true">
-  </input>
+    <label>Nessus Api Url<span class="asterisk">*</span>
+    </label>
+    <input type="text" ng-model="NessusApiUrl" ng-required="true">
 </div>
 <div class="form_item_block">
-  <label>Nessus Api Access Key:<span class="asterisk">*</span>
-  </label>
-  <textarea ng-model="NessusApiAccessKey" ng-required="true">
+    <label>Nessus Api Access Key:<span class="asterisk">*</span>
+    </label>
+    <textarea ng-model="NessusApiAccessKey" ng-required="true">
   </textarea>
 </div>
 <div class="form_item_block">
-  <label>Nessus Api Secret Key<span class="asterisk">*</span>
-  </label>
-  <textarea ng-model="NessusApiAccessSecret" ng-required="true">
+    <label>Nessus Api Secret Key<span class="asterisk">*</span>
+    </label>
+    <textarea ng-model="NessusApiAccessSecret" ng-required="true">
   </textarea>
 </div>
diff --git a/sonar-qualitygates-plugin/resources/views/task.template.html b/sonar-qualitygates-plugin/resources/views/task.template.html
index df632b4..fe58042 100755
--- a/sonar-qualitygates-plugin/resources/views/task.template.html
+++ b/sonar-qualitygates-plugin/resources/views/task.template.html
@@ -1,35 +1,35 @@
+<style>
+   .asterisk {
+      color :red;
+   }
+</style>
 <div class="form_item_block">
-  <label>Stage name where the sonar scan is executed</label>
-  <input type="text" ng-model="StageName" ng-required="false">
-  </input>
+    <label>Stage name where the sonar scan is executed</label>
+    <input type="text" ng-model="StageName" ng-required="false">
 </div>
 <div class="form_item_block">
-  <label>Job name where the sonar scan is executed</label>
-  <input type="text" ng-model="JobName" ng-required="false">
-  </input>
+    <label>Job name where the sonar scan is executed</label>
+    <input type="text" ng-model="JobName" ng-required="false">
 </div>
 <div class="form_item_block">
-  <label>Stage counter</label>
-  <input type="text" ng-model="JobCounter" ng-required="false">
-  </input>
+    <label>Stage counter</label>
+    <input type="text" ng-model="JobCounter" ng-required="false">
 </div>
 <div class="form_item_block">
-  <label>Key of Sonar Project<span class="asterisk">*</span>
-  </label>
-  <input type="text" ng-model="SonarProjectKey" ng-required="true">
-  </input>
+    <label>Key of Sonar Project<span class="asterisk">*</span>
+    </label>
+    <input type="text" ng-model="SonarProjectKey" ng-required="true">
 </div>
 <div class="form_item_block">
-  <label>Fail Quality Gate result:</label>
-  <select ng-model="IssueTypeFail">
-    <option value="error">Error and Missing</option>
-    <option value="warning">Warning, Error and Missing</option>
-  </select>
+    <label>Fail Quality Gate result:</label>
+    <select ng-model="IssueTypeFail">
+        <option value="error">Error and Missing</option>
+        <option value="warning">Warning, Error and Missing</option>
+    </select>
 </div>
 <div class="form_item_block">
-  <label>SonarQube Api Url<span class="asterisk">*</span>
-  </label>
-  <input type="text" ng-model="SonarApiUrl" ng-required="true">
-  </input>
+    <label>SonarQube Api Url<span class="asterisk">*</span>
+    </label>
+    <input type="text" ng-model="SonarApiUrl" ng-required="true">
 </div>