gui FEATURE manipulate with the leaf-lists in configuration data
diff --git a/frontend/config/tree.component.html b/frontend/config/tree.component.html
index b8d0fea..ce7faee 100644
--- a/frontend/config/tree.component.html
+++ b/frontend/config/tree.component.html
@@ -26,7 +26,7 @@
 <div class="subtree" *ngIf="node['path'] != '/' && (node['info']['config'] || activeSession.statusVisibility)"
     [class.status]="!node['info']['config']">
 
-    <div class="node" [class.dirty]="node['dirty']" [class.deleted]="node['deleted']"
+    <div class="node" [class.dirty]="node['dirty']" [class.deleted]="modsService.isDeleted(node)"
             [class.yang-container]="node['info']['type'] == 1"
             [class.yang-leaf]="node['info']['type'] == 4"
             [class.yang-leaflist]="node['info']['type'] == 8"
@@ -38,7 +38,7 @@
 
 		<!-- BEGIN nodetype-specific code -->
 		<!-- leaf -->
-		<ng-container *ngIf="node['info']['type'] == 4">
+		<ng-container *ngIf="node['info']['type'] == 4 || (node['new'] && node['info']['type'] == 8)">
 			<ng-container *ngIf="node['info']['key']">
 				<img class="icon" src="assets/netopeer/icons/key.svg" alt="key" title="list key"/>
 			</ng-container>
@@ -83,19 +83,24 @@
 				<span *ngIf="node['info']['datatype'] != node['info']['datatypebase']">({{node['info']['datatypebase']}})</span>
 			</div>
 		</ng-container>
+        <ng-container *ngIf="node['info']['type'] == 8">
+            <div class="value">{{node['info']['datatype']}}
+                <span *ngIf="node['info']['datatype'] != node['info']['datatypebase']">({{node['info']['datatypebase']}})</span>
+            </div>
+        </ng-container>
 		<!-- END nodetype-specific code -->
 
 		<div class="module_name">{{node['info']['module']}}</div>
 	</div>
 
 	<!-- BEGIN nodetype-specific code -->
-	<!-- leaf's edit value -->
-	<ng-container *ngIf="node['info']['type'] == 4">
+	<!-- leaf/leaf-list's edit value -->
+	<ng-container *ngIf="node['info']['type'] == 4 || node['info']['type'] == 8">
 		<div class="node_edit" [class.dirty]="node['dirty']" *ngIf="node['edit']">
             <tree-indent [node]="node" [indentation]="inheritIndentation(node)" [type]="'edit'"></tree-indent>
 			<img *ngIf="node['edit'] " class="icon_action" src="assets/netopeer/icons/close.svg"
 				alt="cancel" title="cancel editing" tabindex=0
-				(click)="node['edit']=false" (keyup.enter)="node['edit']=false"
+				(click)="changeValueCancel(node)" (keyup.enter)="changeValueCancel(node)"
 				onmouseover="this.src='assets/netopeer/icons/close_active.svg'"
 				onmouseout="this.src='assets/netopeer/icons/close.svg'" />
 			<img *ngIf="node['edit']" class="icon_action icon_hidden" src="assets/netopeer/icons/confirm.svg"
@@ -112,21 +117,22 @@
                 </ng-container>
             </select>
             <input *ngIf="!node['info']['values']"
-                id="{{node['path']}}_input" type="text" class="value" value="{{node['value']}}" tabindex=0
+                id="{{node['path']}}_input" type="text" class="value" value="{{nodeValue(node)}}" tabindex=0
                 (keyup)="checkValue(node, $event.target)" (change)="checkValue(node, $event.target)"
                 (keyup.enter)="changeValue(node, $event.target)" (keyup.escape)="changeValueCancel(node)"
                 checkLeafValue [node]="node" (onCheckValue)="checkValue($event.node, $event.element)"/>
 		</div>
 	</ng-container>
 
-	<!-- leaflist's values -->
-	<ng-container *ngIf="node['info']['type'] == 8">
-		<div class="node yang-leaflist" *ngFor="let value of node['value']">
-            <tree-indent [node]="node" [indentation]="inheritIndentation(node)" [type]="'value'" ></tree-indent>
-			<div class="value_standalone">{{value}}</div>
-		</div>
-	</ng-container>
-	<!-- END nodetype-specific code -->
+    <!-- leaflist's values -->
+    <ng-container *ngIf="node['info']['type'] == 8 && !node['edit'] && !modsService.isDeleted(node)">
+        <div *ngFor="let value of node['value']"
+            class="node yang-leaflist" [class.dirty]="node['dirty']" [class.deleted]="modsService.isDeleted(node, value)">
+            <tree-indent [node]="node" [indentation]="inheritIndentation(node)" [type]="'value'" [value]="value"></tree-indent>
+            <div class="value_standalone">{{value}}</div>
+        </div>
+    </ng-container>
+    <!-- END nodetype-specific code -->
 
 	<!-- recursion - show children -->
     <div class="loading" *ngIf="node['loading']">