Yangman - changed md-switch style

Bug 6549 - added T & F to indicate states of the knob
	 - form imputs are aligned

Change-Id: I18a285e03e409c9d71b53fe06c510493a908df0a
Signed-off-by: Ľubomír Balogh <lubomir.balogh@pantheon.tech>

diff --git a/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/types/boolean.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/types/boolean.tpl.html
index 6dc3c8749d5718f45e2253b628378c63e3783825..fd564b4a893c52e31f5cbe1d684f4c8bfb6378ad 100644 (file)
--- a/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/types/boolean.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/types/boolean.tpl.html
@@ -1,7 +1,9 @@
-<section ng-controller="YMTypeBooleanCtrl as yangTypeBolean" flex>
+<section ng-controller="YMTypeBooleanCtrl as yangTypeBolean" layout="row" class="layout-row flex-center" flex>
+       <span class="mr8">F</span>
     <md-switch ng-model="node.value"
                id="{{ node.label + node.id }}"
                aria-label="Boolean"
                ng-disabled="{{ yangOutput.notEditable }}">
     </md-switch>
+    <span>T</span>
 </section>

diff --git a/modules/yangman-resources/src/main/resources/yangman/yangman.less b/modules/yangman-resources/src/main/resources/yangman/yangman.less
index b082ed16964d5a3a7e3521e04879e60c4a188150..66e9e6e73a4a5e198b4d01f1ab1e0c1948378cab 100644 (file)
--- a/modules/yangman-resources/src/main/resources/yangman/yangman.less
+++ b/modules/yangman-resources/src/main/resources/yangman/yangman.less
@@ -51,10 +51,19 @@
     margin-bottom: 30px;
 }
 
+.mr8{
+    margin-right: 8px;
+}
+
 .nrp{
     padding-right: 0!important;
 }
 
+.flex-center {
+    align-items: center;
+    justify-content: center;
+}
+
 // general
 .md-open-menu-container{
     span{
@@ -755,8 +764,9 @@ md-input-container{
             }
 
             p.top-element{
-                margin: 0 10px 0 0;
-                min-width: 80px;
+                margin: 5px 10px 0 0;
+                word-wrap: break-word;
+                width: 100px;
 
                 &.list-label{
                     color: @colorActive;