Merge "Added toggole button to Actions/Functions menu"

diff --combined cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
index 32fef01,e6b6cf2..6e072b1
--- 1/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
--- 2/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
@@@ -34,7 -34,7 +34,7 @@@
                              <div class="modal-body">
                                  <div class="row package-info">
                                      <div class="col-12">
 -                                        <h3>Test Package<span>.vLB.CDS</span>
 +                                        <h3>Test Package
                                              <span class="package-version">Version 1.0.2</span></h3>
                                      </div>
                                      <div class="col-12 mb-3">
@@@ -110,15 -110,44 +110,44 @@@
      <!-- Controller SideBar -->
      <ng-sidebar [(opened)]="controllerSideBar" [sidebarClass]="'demo-sidebar controllerSidebar container-fluid'"
          [mode]="'push'" #sidebarLeft>
-         <div class="row">
-             <h1 class="col-12">Actions</h1>
-             <div class="col-12 text-center p-0">
-                 <div class="btn-group actionBtns" role="group">
-                     <button (click)="insertCustomActionIntoBoard()" type="button" class="btn insert-custom">Insert
-                         Custom</button>
-                     <!-- <button type="button" class="btn import-action"><i class="icon-import-blue" aria-hidden="true"></i>Import Action</button> -->
+ 
+         <nav class="row">
+             <!--Nav Tabs-->
+             <div class="col-12">
+                 <div class="nav nav-tabs " id="nav-tab" role="tablist">
+                     <a class="nav-item nav-link active col-6" id="nav-action-tab" data-toggle="tab"
+                         href="#nav-action" role="tab" aria-controls="nav-action" aria-selected="false"
+                         autofocus #nameit >Actions</a>
+                     <a class="nav-item nav-link col-6" id="nav-function-tab" data-toggle="tab"
+                         href="#nav-function" role="tab" aria-controls="nav-function" aria-selected="false">Functions</a>
+                 </div>
+             </div>
+    </nav>
+ 
+ 
+  <div class="row mt-2">
+             <div class="col">
+                 <div class="tab-content" id="nav-tabContent">
+                     <div class="tab-pane fade show active" id="nav-action" role="tabpanel"
+                         aria-labelledby="nav-action-tab">
+                         <div class="btn-group actionBtns col-8" role="group">
+                             <button (click)="insertCustomActionIntoBoard()" type="button" class="btn insert-custom">
+                                 Insert Custom
+                             </button> 
+                       <!-- <button type="button" class="btn import-action"><i class="icon-import-blue" aria-hidden="true"></i>Import Action</button> -->
+                         </div>
+                     </div>
+                     <div class="tab-pane fade" id="nav-function" role="tabpanel"
+                         aria-labelledby="nav-function-tab">
+                         <div class="col-12 text-center p-0">
+                             <b>Drag and drop function to Action’s box</b>
+                             <div id="palette-paper" class="col-12 componentsList"> </div>
+                         </div>
+                     </div>
                  </div>
              </div>
+         </div>
+        
              <!-- <div class="col-12 actionsList">
          <b>Select from other packages:</b>
          <div class="actions-scroll">
@@@ -153,11 -182,7 +182,7 @@@
          </div>
        </div> -->
  
-             <h1 class="col-12">Functions</h1>
-             <b>Drag and drop function to Action’s box</b>
-             <div id="palette-paper" class="col-12 componentsList">
-             </div>
-         </div>
+            
      </ng-sidebar>
      <!-- Page content -->