aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorSarah Abouzainah <sabouzainah.ext@orange.com>2020-06-04 17:45:57 +0200
committerKAPIL SINGAL <ks220y@att.com>2020-06-05 13:50:37 +0000
commitced915588f42312b3e65accea0ff72f095c929ce (patch)
tree7667d395ee9acba8e0ea4cecae2521f7415fc8a1
parentf36451a9d5bcc88adb3a7f0062976cbc8ec668b1 (diff)
Actions list - UI
Issue-ID: CCSDK-2411 Signed-off-by: Sarah Abouzainah <sabouzainah.ext@orange.com> Change-Id: I4eccc5261e4c4ae9c9a60f0c4c518129973b066d
Diffstat
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html2
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css100
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html360
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts2
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.css2
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html4
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-dashboard/dictionary-list/dictionary-list.component.html6
-rwxr-xr-xcds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eotbin22348 -> 22492 bytes
-rwxr-xr-xcds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg1
-rwxr-xr-xcds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttfbin22184 -> 22328 bytes
-rwxr-xr-xcds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woffbin22264 -> 22408 bytes
-rwxr-xr-xcds-ui/designer-client/src/assets/icomoon/style.css14
-rw-r--r--cds-ui/designer-client/src/assets/img/icon-error.sketchbin20734 -> 0 bytes
-rw-r--r--cds-ui/designer-client/src/assets/img/icon-error.svg13
-rw-r--r--cds-ui/designer-client/src/styles.css12
15 files changed, 286 insertions, 230 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
index a31c95652..4abc93b55 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
@@ -62,7 +62,7 @@
<div class="col-12 package-name deployed">
{{viewedPackage.artifactName}}
<img src="/assets/img/icon-deploy-inactive.svg" class="deply-status-icon">
- <span class="package-version">Version 1.0.2</span>
+ <span class="package-version">v1.0.2</span>
</div>
<div class="col-12 package-description">
Last modified {{ viewedPackage.createdDate | date:'short' }} By
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css
index a095b3dfc..5054a8e9e 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css
@@ -12,6 +12,18 @@ body{
color: #fff;
}
+/*Bootstrap*/
+.controllerSidebar .nav-tabs{
+ border-bottom-width: 2px;
+}
+.controllerSidebar .nav-tabs .nav-link{
+ padding: 12px 0 !important;
+ text-align: center;
+}
+.controllerSidebar .nav-tabs .nav-link::before{
+ content: "";
+}
+
/*Header*/
header{
position: relative;
@@ -240,9 +252,9 @@ tspan#type{
}
/*ACTIONS & COMPONENTS MENU*/
.input-search-controller{
- height: 50px;
- padding-left: 30px;
- background: url(src/assets/img/icon-search-light.svg) #fff 10px center no-repeat;
+ height: 40px;
+ padding-left: 42px;
+ background: url(src/assets/img/icon-search-light.svg) #fff 21px center no-repeat;
border-radius: 0;
border: 0;
border-bottom: solid 1px #D7E7F9;
@@ -254,16 +266,11 @@ tspan#type{
font-size: 11px;
}
.input-search-controller:focus{
-
+ background-color: #fff !important;
box-shadow: 0 2px 6px 0 rgba(47, 83, 151, .15);
+ text-shadow: none;
border-color: #DEE8F3;
}
-.actions-scroll{
- max-height: 29vh;
- overflow-y: auto;
- margin-top: 12px;
- margin-bottom: 20px;
-}
.componentsList p{
margin-bottom: 0;
padding-left: 30px;
@@ -296,10 +303,37 @@ p.compType-4{
.controllerSidebar{
width: 320px;
+ padding: 0;
+ overflow: hidden !important;
background: #F4F9FE;
border: solid 1px #C1CDDD;
box-shadow: 0 2px 6px rgba(47, 83, 151, .10);
}
+.helpBox{
+ position : absolute;
+ bottom : 0;
+ width: 100%;
+ height : 40px;
+ margin-top : 24px;
+ padding-left: 20px;
+ background: #fff;
+ border-top: solid 1px #C1CDDD;
+ font-size: 14px;
+ line-height: 40px;
+ color: #0070F4;
+}
+.helpBox .icon-info{
+ margin-left: 0;
+ margin-right: 10px;
+}
+.helpBox .icon-info::before{
+ color: #0070F4 !important;
+}
+.controllerSidebar .row,
+.controllerSidebar .col{
+ margin: 0;
+ padding: 0;
+}
.controllerSidebar h1{
margin-bottom: 15px;
padding: 12px 0 12px 12px;
@@ -315,6 +349,7 @@ p.compType-4{
font-size: 12px;
color: #C3CDDB;
}
+
.actionBtns .btn{
margin: 0px 15px 16px -90px;
/* padding: 9px 20px; */
@@ -325,24 +360,25 @@ p.compType-4{
float: left;
}
-.actionBtns .btn.insert-custom{
- /* background: white; */
- /* border: solid 1px #1B3E6F; */
+.new-action,
+.new-action:hover{
+ margin: 9px 0 4px 18px;
+ padding: 6px;
+ font-size: 13px;
+ font-weight: bold;
color: #1B3E6F;
}
-.actionBtns .btn.import-action{
- border: solid 1px #D0DFF1;
- color: #1B3E6F;
-
+.new-action:hover{
+ background: #D7E7F9;
}
-.actionsList,
.componentsList{
- padding: 0 12px 20px;
+ margin-top: 16px;
+ padding: 0 20px 10px;
}
.componentsList{
padding-bottom: 0;
- height: calc( 100vh - 218px)!important;
- overflow: scroll;
+ /* height: calc( 100vh - 218px)!important;
+ overflow: scroll;*/
background: #F4F9FE !important;
}
.custom-control.custom-checkbox:hover,
@@ -350,18 +386,18 @@ p.compType-4{
cursor: pointer;
}
.custom-control{
- padding-top: 10px;
- width: 315px;
height: 40px;
- margin-left: -15px;
font-size: 14px;
- padding-bottom: 0;
+ line-height: 40px;
}
.custom-control:hover{
background-color: white;
}
-
-.actionsList .custom-checkbox,
+.actionsList,
+.componentsList{
+ height: 65vh !important;
+ overflow-y: auto;
+}
.componentsList .list-group-item{
margin-bottom: 10px;
padding-left: 40px;
@@ -374,7 +410,7 @@ p.compType-4{
padding: 6px;
vertical-align: unset;
color: #1B3E6F;
- font-size: 14px;
+ font-size: 13px;
line-height: 20px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
@@ -409,6 +445,12 @@ p.compType-4{
border: solid 1px #D9E6F2;
color: #C3CDDB;
}
+.controllerSidebar .custom-control label{
+ margin-bottom: 0;
+}
+.controllerSidebar .custom-control i{
+ margin-right: 9px;
+}
/*Components List*/
.componentsList .list-group-item{
padding-left: 36px;
@@ -507,7 +549,7 @@ p.compType-4{
.functionAttributeSidebar{
width: 440px;
padding: 0px;
- margin-top: 50px;
+ margin-top: 45px;
}
.functionAttributeSidebar .attributesContainer{
background: #fff;
diff --git a/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
index 52503cf53..2bd484258 100644
--- a/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
@@ -33,11 +33,11 @@
</div>
<div class="modal-body">
<div class="row package-info">
- <div class="col-12">
+ <div class="col">
<h3>Test Package
<span class="package-version">Version 1.0.2</span></h3>
</div>
- <div class="col-12 mb-3">
+ <div class="col mb-3">
<span class="badge badge-primary">test</span>
<span class="badge badge-primary">vDNS-CDS</span>
<span class="badge badge-primary">SCALE-OUT</span>
@@ -100,7 +100,7 @@
</div>
</header>
<div class="source-button editBar">
-
+
<div class="btn-group viewBtns" role="group">
<!-- <button (click)="_toggleSidebar1()" class="topologySource active">
<i style="font-size:24px" class="fa">&#xf101;</i>
@@ -118,54 +118,43 @@
<nav class="row">
<!--Nav Tabs-->
- <div class="col-12">
+ <div class="col">
<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>
+ <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-12">
+ <div class="row">
+ <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">
<!--Action Search Box-->
- <div>
- <h1>Search</h1>
- </div>
+ <input type="text" class="form-control input-search-controller" placeholder="Search Actions">
- <div class="btn-group actionBtns col-8" role="group">
- <button (click)="insertCustomActionIntoBoard()" type="button" class="btn insert-custom">
- + New Action
- </button>
- </div>
-
- <div>
- <div *ngIf="showAction" class="custom-control">
- <label><span><i class="fa fa-file-o" aria-hidden="true" style="margin-right: 20px;"></i></span>
+ <button (click)="insertCustomActionIntoBoard()" type="button" class="btn new-action">
+ + &nbsp;&nbsp;New Action
+ </button>
+ <div class="actionsList">
+ <div *ngIf="showAction" class="custom-control">
+ <label><i class="icon-file" aria-hidden="true"></i>
{{customActionName}} </label>
- </div>
</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 class="tab-pane fade" id="nav-function" role="tabpanel" aria-labelledby="nav-function-tab">
+ <!--Function Search Box-->
+ <input type="text" class="form-control input-search-controller" placeholder="Search Functions">
+ <div id="palette-paper" class="componentsList"> </div>
+ </div>
+
</div>
</div>
</div>
-
-
+ <div class="helpBox"><i class="icon-info" aria-hidden="true"></i><a href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank">Help - Learn The Basics</a></div>
</ng-sidebar>
<!-- Page content -->
@@ -242,7 +231,7 @@
<h1>Action Attributes</h1>
<div class="scrolll">
<div class="row m-0">
- <div class="col-12">
+ <div class="col">
<div class="form-group actionName">
<label for="exampleInputEmail1">Action Name</label>
<input type="text" class="form-control" placeholder="Action 1">
@@ -388,36 +377,36 @@
</div>
</ng-sidebar>
- <!-- Function Attribute SideBar -->
- <ng-sidebar [(opened)]="functionAttributeSidebar" [sidebarClass]="'demo-sidebar functionAttributeSidebar '" [mode]="'push'"
- [position]="'right'" #sidebarRight>
+ <!-- Function Attribute SideBar -->
+ <ng-sidebar [(opened)]="functionAttributeSidebar" [sidebarClass]="'demo-sidebar functionAttributeSidebar '"
+ [mode]="'push'" [position]="'right'" #sidebarRight>
<div class="container-fluid0">
<div class="row m-0">
<div class="col-2 pr-0">
<!-- <button (click)="sidebarRight.close()" class="closeBar"></button> -->
</div>
<div class="col-10 attributesContainer p-0">
- <div class="row m-0">
- <div class="col-12">
- <div class="col-3">
- <button (click)="sidebarRight.close()" class="closeBar"></button>
- </div>
+ <div class="row m-0">
+ <div class="col">
+ <div class="col-3">
+ <button (click)="sidebarRight.close()" class="closeBar"></button>
+ </div>
+
+ <div class="function-attribute">
+ <h6>Function Attributes
+ <span class="trash-span">
+ <i class="fa fa-trash" type="button" aria-hidden="true"></i>
+ </span>
+ </h6>
+ </div>
+
+
+ </div>
+ </div>
- <div class="function-attribute">
- <h6>Function Attributes
- <span class="trash-span">
- <i class="fa fa-trash" type="button" aria-hidden="true"></i>
- </span>
- </h6>
- </div>
-
-
- </div>
- </div>
-
<div>
<div class="row m-0">
- <div class="col-12">
+ <div class="col">
<div class="form-group actionName">
<label for="exampleInputEmail1">Function Name</label>
<input type="text" class="form-control" placeholder="Function Name">
@@ -425,165 +414,172 @@
</div>
</div>
<div class="row m-0">
- <div class="col-12">
+ <div class="col">
<div class=" actionName">
<label>Function Type</label>
<div class="dropdown w-100">
<input class="dropdown-toggle" type="text">
- <div class="dropdown-text">component-resource-resolution <i class="fa fa-caret-down"></i></div>
+ <div class="dropdown-text">component-resource-resolution <i
+ class="fa fa-caret-down"></i></div>
<ul class="dropdown-content w-100">
<li>
<div class="form-group ">
- <li>other component</li>
- </div>
- </li>
- </ul>
+ <li>other component</li>
</div>
+ </li>
+ </ul>
</div>
</div>
</div>
- <div class="accordion" id="accordionExample">
- <div class="card">
- <div class="card-header row" id="headingOne">
- <h2 class="col-10 mb-0">
- <button class="btn btn-link" type="button" data-toggle="collapse"
- data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
- Interface
- </button>
- </h2>
- <div class="col-2 p-0 text-center">
- <button class="btn btn-addAttribute" type="button"></button>
- </div>
+ </div>
+ <div class="accordion" id="accordionExample">
+ <div class="card">
+ <div class="card-header row" id="headingOne">
+ <h2 class="col-10 mb-0">
+ <button class="btn btn-link" type="button" data-toggle="collapse"
+ data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
+ Interface
+ </button>
+ </h2>
+ <div class="col-2 p-0 text-center">
+ <button class="btn btn-addAttribute" type="button"></button>
</div>
+ </div>
- <div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
- data-parent="#accordionExample">
- <div class="card-body">
- <div class="row">
- <div class="col-9">
- <label for="exampleInputEmail1">ResourceResolutionComponent</label> &nbsp;
- <button type="button" class="btn p-0">
- <img src="/assets/img/icon-edit.svg">
- </button>
- </div>
- <div class="col-3">
- <button type="button" class="btn btn-deleteAttribute">Delete</button>
- </div>
- </div>
- <div class="form-group">
- <label for="exampleInputEmail1">Resoluton-key</label>
- <input type="text" class="form-control">
+ <div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
+ data-parent="#accordionExample">
+ <div class="card-body">
+ <div class="row">
+ <div class="col-9">
+ <label for="exampleInputEmail1">ResourceResolutionComponent</label> &nbsp;
+ <button type="button" class="btn p-0">
+ <img src="/assets/img/icon-edit.svg">
+ </button>
</div>
- <div class="form-group">
- <label for="exampleFormControlTextarea1">Store result</label>
- </div>
- <div class="form-group">
- <label>
- <input class="with-gap radio-btn" name="group1" type="radio"/>
- <span class="radio-btn">True</span>
- </label>
- <label class="radio-btn">
- <input class="with-gap radio-btn" name="group1" type="radio" />
- <span class="radio-btn">False</span>
- </label>
- </div>
- <div class="form-group">
- <label for="exampleInputEmail1">Target</label>
- <input type="text" class="form-control" placeholder="">
- </div>
- <div class="form-group">
- <label for="exampleFormControlTextarea1">Artifact Prefix Name</label>
- <input type="text" class="form-control" placeholder="">
-
+ <div class="col-3">
+ <button type="button" class="btn btn-deleteAttribute">Delete</button>
</div>
+ </div>
+ <div class="form-group">
+ <label for="exampleInputEmail1">Resoluton-key</label>
+ <input type="text" class="form-control">
+ </div>
+ <div class="form-group">
+ <label for="exampleFormControlTextarea1">Store result</label>
+ </div>
+ <div class="form-group">
+ <label>
+ <input class="with-gap radio-btn" name="group1" type="radio" />
+ <span class="radio-btn">True</span>
+ </label>
+ <label class="radio-btn">
+ <input class="with-gap radio-btn" name="group1" type="radio" />
+ <span class="radio-btn">False</span>
+ </label>
+ </div>
+ <div class="form-group">
+ <label for="exampleInputEmail1">Target</label>
+ <input type="text" class="form-control" placeholder="">
+ </div>
+ <div class="form-group">
+ <label for="exampleFormControlTextarea1">Artifact Prefix Name</label>
+ <input type="text" class="form-control" placeholder="">
</div>
+
</div>
</div>
-
</div>
- <div class="accordion" id="accordionExample">
- <div class="card">
- <div class="card-header row" id="headingOne">
- <h2 class="col-10 mb-0">
- <button class="btn btn-link" type="button" data-toggle="collapse"
- data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
- Artifact
- </button>
- </h2>
- <div class="col-2 p-0 text-center">
- <button class="btn btn-addAttribute" type="button"></button>
- </div>
+ </div>
+
+ <div class="accordion" id="accordionExample">
+ <div class="card">
+ <div class="card-header row" id="headingOne">
+ <h2 class="col-10 mb-0">
+ <button class="btn btn-link" type="button" data-toggle="collapse"
+ data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
+ Artifact
+ </button>
+ </h2>
+ <div class="col-2 p-0 text-center">
+ <button class="btn btn-addAttribute" type="button"></button>
</div>
+ </div>
- <div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
- data-parent="#accordionExample">
- <div class="card-body">
- <div class="row">
- <div class="col-9">
- <label for="exampleInputEmail1">base config-template</label> &nbsp;
- <button type="button" class="btn p-0">
- <img src="/assets/img/icon-edit.svg">
- </button>
- </div>
- <div class="col-3">
- <button type="button" class="btn btn-deleteAttribute">Delete</button>
- </div>
- </div>
- <div class="form-group">
- <label for="exampleInputEmail1">Type</label>
- <div class="dropdown w-100">
- <input class="dropdown-toggle" type="text">
- <div class="dropdown-text">artifact-template-velocity <i class="fa fa-caret-down"></i></div>
- <ul class="dropdown-content w-100">
- <li>
- <div class="form-group ">
- <li>ddwd</li>
- </div>
- </li>
- </ul>
- </div>
+ <div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
+ data-parent="#accordionExample">
+ <div class="card-body">
+ <div class="row">
+ <div class="col-9">
+ <label for="exampleInputEmail1">base config-template</label> &nbsp;
+ <button type="button" class="btn p-0">
+ <img src="/assets/img/icon-edit.svg">
+ </button>
</div>
-
- <div style="height: 30px; margin-top: 30px;"><hr></div>
-
- <div class="row">
- <div class="col-9">
- <label for="exampleInputEmail1">base config-mapping</label> &nbsp;
- <button type="button" class="btn p-0">
- <img src="/assets/img/icon-edit.svg">
- </button>
- </div>
- <div class="col-3">
- <button type="button" class="btn btn-deleteAttribute">Delete</button>
- </div>
+ <div class="col-3">
+ <button type="button" class="btn btn-deleteAttribute">Delete</button>
</div>
- <div class="form-group">
- <label for="exampleInputEmail1">Type</label>
- <div class="dropdown w-100">
- <input class="dropdown-toggle" type="text">
- <div class="dropdown-text">artifact-mapping resource <i class="fa fa-caret-down"></i></div>
- <ul class="dropdown-content w-100">
- <li>
- <div class="form-group ">
- <li>ddwd</li>
- </div>
- </li>
- </ul>
- </div>
+ </div>
+ <div class="form-group">
+ <label for="exampleInputEmail1">Type</label>
+ <div class="dropdown w-100">
+ <input class="dropdown-toggle" type="text">
+ <div class="dropdown-text">artifact-template-velocity <i
+ class="fa fa-caret-down"></i></div>
+ <ul class="dropdown-content w-100">
+ <li>
+ <div class="form-group ">
+ <li>ddwd</li>
</div>
+ </li>
+ </ul>
+ </div>
+ </div>
+
+ <div style="height: 30px; margin-top: 30px;">
+ <hr>
+ </div>
- <div style="height: 30px; margin-top: 30px;"><hr></div>
+ <div class="row">
+ <div class="col-9">
+ <label for="exampleInputEmail1">base config-mapping</label> &nbsp;
+ <button type="button" class="btn p-0">
+ <img src="/assets/img/icon-edit.svg">
+ </button>
+ </div>
+ <div class="col-3">
+ <button type="button" class="btn btn-deleteAttribute">Delete</button>
</div>
</div>
+ <div class="form-group">
+ <label for="exampleInputEmail1">Type</label>
+ <div class="dropdown w-100">
+ <input class="dropdown-toggle" type="text">
+ <div class="dropdown-text">artifact-mapping resource <i
+ class="fa fa-caret-down"></i></div>
+ <ul class="dropdown-content w-100">
+ <li>
+ <div class="form-group ">
+ <li>ddwd</li>
+ </div>
+ </li>
+ </ul>
+ </div>
+ </div>
+
+ <div style="height: 30px; margin-top: 30px;">
+ <hr>
</div>
-
</div>
</div>
</div>
+
</div>
</div>
+ </div>
+ </div>
+ </div>
</ng-sidebar>
-</ng-sidebar-container>
+</ng-sidebar-container> \ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts
index 3d10f99e7..9b8781d9b 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts
@@ -180,7 +180,7 @@ export class DesignerComponent implements OnInit, OnDestroy {
this.palettePaper = new joint.dia.Paper({
el: $('#palette-paper'),
model: this.paletteGraph,
- width: 300,
+ width: 318,
height: $('#palette-paper').height(),
// background: {
// color: 'rgba(0, 255, 0, 0.3)'
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.css
index 75274ba33..bc1890bdb 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.css
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.css
@@ -6,8 +6,6 @@ body{
background-image: linear-gradient(-45deg, #000 9%, #fff 0) !important;
background-size: 6px 6px !important;
}
-
-
/*Header*/
header{
height: 60px;
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
index 9c789941d..a7ce5ed4a 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
@@ -3,7 +3,7 @@
<!--Add Package Card-->
<div class="card addPaackage-card">
<div class="card-body text-center">
- <img src="/assets/img/icon-addPackage.svg" width="30%">
+ <img src="/assets/img/icon-addPackage.svg">
</div>
<div class="card-footer row">
<div class="col text-center">
@@ -30,7 +30,7 @@
<!-- <img class="icon-deployed" src="/assets/img/icon-deploy.svg"> -->
<p class="packageName" tooltip="{{bluePrint.artifactName}}" placement="bottom">
{{bluePrint.artifactName}}</p>
- <span class="package-version">version {{bluePrint.artifactVersion}}</span>
+ <span class="package-version">v{{bluePrint.artifactVersion}}</span>
</a>
</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-dashboard/dictionary-list/dictionary-list.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-dashboard/dictionary-list/dictionary-list.component.html
index b6fbf5939..41b13a601 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-dashboard/dictionary-list/dictionary-list.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-dashboard/dictionary-list/dictionary-list.component.html
@@ -23,15 +23,15 @@
<!--Add Package Card-->
<div class="card addPaackage-card">
<div class="card-body text-center">
- <img src="/assets/img/icon-addPackage.svg" width="40%">
+ <img src="/assets/img/icon-addPackage.svg">
</div>
<div class="card-footer row">
<div class="col text-center">
<a routerLink="/resource-dictionary/createDictionary" role="button" aria-pressed="true"
class="btn-create-package float"><i class="icon-create-white" aria-hidden="true"></i>Create Dictionary
</a>
- <br/>
- <a href="#" role="button" aria-pressed="true" class="btn-import-package float mb-3"><i class="icon-import-blue" aria-hidden="true"></i>Import Package
+ <br />
+ <a href="#" role="button" aria-pressed="true" class="btn-import-package float"><i class="icon-import-blue" aria-hidden="true"></i>Import Dictionary
</a>
</div>
</div>
diff --git a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eot b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eot
index 01dd66cf8..46b2de673 100755
--- a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eot
+++ b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eot
Binary files differ
diff --git a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg
index 6d0d75fd1..c966c1125 100755
--- a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg
+++ b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg
@@ -12,6 +12,7 @@
<glyph unicode="&#xe902;" glyph-name="icon-enter-link" d="M677.571 421.241h-644.248c-18.395 0-33.323 14.929-33.323 33.323s14.929 33.323 33.323 33.323h644.248c18.395 0 33.323-14.929 33.323-33.323s-14.929-33.323-33.323-33.323zM499.849 243.519c-8.534 0-17.060 3.238-23.552 9.771-13.017 13.017-13.017 34.121 0 47.146l154.177 154.169-154.177 154.177c-13.017 13.017-13.017 34.129 0 47.146 13.025 13.017 34.129 13.017 47.146 0l177.722-177.73c13.017-13.017 13.017-34.121 0-47.137l-177.722-177.722c-6.533-6.582-15.059-9.82-23.593-9.82v0zM533.173-34.18c-202.21 0-380.728 121.651-454.884 309.957-6.753 17.060 1.684 36.431 18.793 43.184 17.060 6.663 36.48-1.643 43.232-18.842 64.027-162.573 218.245-267.652 392.859-267.652 232.726 0 422.098 189.372 422.098 422.098s-189.372 422.098-422.098 422.098c-174.614 0-328.832-105.079-392.859-267.652-6.801-17.199-26.172-25.505-43.232-18.842-17.109 6.753-25.546 26.123-18.793 43.184 74.156 188.306 252.675 309.957 454.884 309.957 269.475 0 488.744-219.27 488.744-488.744s-219.27-488.744-488.744-488.744z" />
<glyph unicode="&#xe903;" glyph-name="icon-action-close" d="M1011.886 947.884c-16.154 16.154-42.344 16.154-58.498 0l-941.272-941.27c-16.154-16.154-16.154-42.344 0-58.498 8.076-8.080 18.664-12.116 29.25-12.116s21.172 4.039 29.25 12.119l941.27 941.27c16.152 16.152 16.152 42.342 0 58.496zM1011.884 6.612l-941.272 941.27c-16.152 16.154-42.344 16.154-58.496 0-16.154-16.152-16.154-42.342 0-58.496l941.272-941.272c8.076-8.078 18.664-12.117 29.25-12.117s21.174 4.039 29.248 12.115c16.15 16.156 16.15 42.346-0.002 58.5z" />
<glyph unicode="&#xe904;" glyph-name="icon-action-back" horiz-adv-x="1422" d="M479.778 915.244c19.067 19.733 50.8 19.733 70.533 0 19.067-19.067 19.067-50.8 0-69.822l-357.644-357.644h1180.178c27.511-0.044 49.378-21.911 49.378-49.422s-21.867-50.089-49.378-50.089h-1180.178l357.644-356.978c19.067-19.733 19.067-51.511 0-70.533-19.733-19.733-51.511-19.733-70.533 0l-442.311 442.311c-19.733 19.067-19.733 50.8 0 69.822l442.311 442.356z" />
+<glyph unicode="&#xe905;" glyph-name="icon-file" horiz-adv-x="751" d="M731.195 731.764l-208.496 208.494c-12.729 12.731-29.652 19.742-47.655 19.742h-407.653c-37.16 0-67.391-30.232-67.391-67.391v-851.058c0-37.16 30.232-67.391 67.391-67.391h616.15c37.16 0 67.391 30.232 67.391 67.391v642.56c0 17.997-7.009 34.92-19.738 47.653zM652.324 728.944h-122.82c-5.309 0-9.627 4.319-9.627 9.627v122.818l132.447-132.445zM683.542 31.923h-616.15c-5.309 0-9.627 4.319-9.627 9.627v851.058c0 5.309 4.319 9.627 9.627 9.627h394.721v-163.665c0-37.16 30.232-67.391 67.391-67.391h163.665v-629.629c0-5.309-4.319-9.627-9.627-9.627z" />
<glyph unicode="&#xe915;" glyph-name="icon-add" d="M512 960c-282.785 0-512-229.215-512-512s229.215-512 512-512c282.785 0 512 229.249 512 512s-229.215 512-512 512zM512 0c-247.425 0-448 200.575-448 448s200.575 448 448 448c247.425 0 448-200.575 448-448s-200.575-448-448-448zM704 480h-160v160c0 17.664-14.336 32-32 32s-32-14.336-32-32v-160h-160c-17.664 0-32-14.336-32-32s14.336-32 32-32h160v-160c0-17.664 14.336-32 32-32s32 14.336 32 32v160h160c17.664 0 32 14.336 32 32s-14.336 32-32 32z" />
<glyph unicode="&#xe952;" glyph-name="icon-archive-sm" d="M943.405 684.258h-864.783c-10.653 0-19.867-3.887-27.644-11.668-7.781-7.777-11.668-16.991-11.668-27.637v-589.626c0-10.644 3.887-19.863 11.668-27.637 7.777-7.781 16.991-11.677 27.644-11.677h864.783c10.647 0 19.854 3.896 27.637 11.677 7.775 7.773 11.662 16.991 11.662 27.637v589.626c0 10.653-3.872 19.858-11.662 27.637-7.775 7.781-16.991 11.668-27.637 11.668zM617.255 499.387c-7.773-7.779-16.991-11.668-27.637-11.668h-157.233c-10.64 0-19.854 3.892-27.637 11.668-7.777 7.781-11.668 16.991-11.668 27.644 0 10.644 3.892 19.858 11.668 27.637 7.781 7.781 16.995 11.673 27.637 11.673h157.249c10.638 0 19.85-3.892 27.637-11.673 7.775-7.777 11.662-16.991 11.662-27.637 0-10.651-3.896-19.863-11.677-27.644zM1010.357 947.749c-7.783 7.781-16.991 11.668-27.639 11.668h-943.409c-10.644 0-19.858-3.887-27.637-11.668-7.779-7.777-11.671-16.991-11.671-27.637v-157.233c0-10.644 3.892-19.854 11.673-27.637 7.779-7.781 16.991-11.668 27.637-11.668h943.394c10.644 0 19.863 3.887 27.652 11.668 7.773 7.781 11.66 16.991 11.66 27.637v157.233c0 10.653-3.887 19.86-11.66 27.637z" />
<glyph unicode="&#xe953;" glyph-name="icon-btn-card-config" d="M971.283 561.778h-95.801c-15.398 0-28.084 8.476-33.982 22.699s-2.901 29.203 7.964 40.088l67.736 67.717c9.956 9.956 15.436 23.211 15.436 37.281 0 14.089-5.48 27.326-15.436 37.3l-86.338 86.338c-19.911 19.911-54.632 19.949-74.581 0l-67.717-67.717c-10.885-10.866-25.903-13.9-40.088-7.983-14.222 5.897-22.699 18.584-22.699 33.982v95.801c0 29.070-23.647 52.717-52.717 52.717h-122.121c-29.070 0-52.717-23.647-52.717-52.717v-95.801c0-15.398-8.476-28.084-22.699-33.982-14.184-5.935-29.203-2.882-40.088 7.983l-67.717 67.717c-19.949 19.949-54.67 19.911-74.581 0l-86.338-86.338c-9.956-9.956-15.436-23.211-15.436-37.3 0-14.071 5.48-27.307 15.436-37.281l67.736-67.717c10.866-10.885 13.843-25.865 7.964-40.088s-18.584-22.699-33.982-22.699h-95.801c-29.070 0-52.717-23.647-52.717-52.717v-122.103c0-29.089 23.647-52.736 52.717-52.736h95.801c15.398 0 28.084-8.476 33.982-22.699s2.901-29.203-7.964-40.088l-67.736-67.717c-9.956-9.956-15.436-23.211-15.436-37.281 0-14.089 5.48-27.326 15.436-37.3l86.338-86.338c19.93-19.93 54.632-19.968 74.581 0l67.717 67.736c10.885 10.866 25.847 13.862 40.088 7.964 14.222-5.897 22.699-18.584 22.699-33.982v-95.801c0-29.070 23.647-52.717 52.717-52.717h122.103c29.070 0 52.717 23.647 52.717 52.717v95.801c0 15.398 8.476 28.084 22.699 33.982 14.241 5.916 29.203 2.901 40.088-7.964l67.717-67.736c19.949-19.949 54.67-19.911 74.581 0l86.338 86.338c9.956 9.956 15.436 23.211 15.436 37.3 0 14.071-5.48 27.307-15.436 37.281l-67.736 67.717c-10.866 10.885-13.843 25.865-7.964 40.088s18.603 22.699 34.001 22.699h95.801c29.070 0 52.717 23.647 52.717 52.717v122.121c0 29.070-23.647 52.717-52.717 52.717zM986.074 386.939c0-8.154-6.637-14.791-14.791-14.791h-95.801c-30.796 0-57.249-17.673-69.025-46.118-11.795-28.444-5.594-59.657 16.194-81.427l67.736-67.717c5.784-5.784 5.784-15.17 0-20.935l-86.338-86.338c-5.765-5.765-15.151-5.803-20.935 0l-67.717 67.736c-21.788 21.788-52.983 27.951-81.427 16.194-28.444-11.776-46.118-38.229-46.118-69.025v-95.801c0-8.154-6.637-14.791-14.791-14.791h-122.121c-8.154 0-14.791 6.637-14.791 14.791v95.801c0 30.796-17.673 57.249-46.118 69.025-9.538 3.963-19.361 5.897-29.070 5.897-19.228 0-37.869-7.585-52.357-22.073l-67.717-67.736c-5.803-5.803-15.189-5.765-20.935 0l-86.338 86.338c-5.784 5.784-5.784 15.17 0 20.935l67.736 67.717c21.769 21.769 27.989 52.983 16.194 81.427-11.776 28.425-38.229 46.099-69.025 46.099h-95.801c-8.154 0-14.791 6.637-14.791 14.791v122.121c0 8.154 6.637 14.791 14.791 14.791h95.801c30.796 0 57.249 17.673 69.025 46.118 11.795 28.444 5.594 59.657-16.194 81.427l-67.736 67.717c-5.784 5.784-5.784 15.17 0 20.935l86.338 86.338c5.765 5.784 15.151 5.784 20.935 0l67.717-67.717c21.751-21.751 52.945-27.989 81.427-16.194 28.444 11.757 46.118 38.21 46.118 69.006v95.801c0 8.154 6.637 14.791 14.791 14.791h122.103c8.173 0 14.81-6.637 14.81-14.791v-95.801c0-30.796 17.673-57.249 46.118-69.025 28.482-11.795 59.657-5.575 81.427 16.194l67.717 67.717c5.803 5.784 15.189 5.784 20.935 0l86.338-86.338c5.784-5.784 5.784-15.17 0-20.935l-67.736-67.717c-21.769-21.769-27.989-52.983-16.194-81.427 11.776-28.444 38.229-46.118 69.025-46.118h95.801c8.154 0.019 14.791-6.618 14.791-14.772v-122.121zM512 618.667c-94.113 0-170.667-76.553-170.667-170.667s76.553-170.667 170.667-170.667c94.113 0 170.667 76.553 170.667 170.667s-76.553 170.667-170.667 170.667zM512 315.259c-73.178 0-132.741 59.563-132.741 132.741s59.563 132.741 132.741 132.741c73.178 0 132.741-59.563 132.741-132.741s-59.563-132.741-132.741-132.741z" />
diff --git a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttf b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttf
index d08d2740b..b8c3e0106 100755
--- a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttf
+++ b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttf
Binary files differ
diff --git a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woff b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woff
index b6d35bcac..169d6d61e 100755
--- a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woff
+++ b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woff
Binary files differ
diff --git a/cds-ui/designer-client/src/assets/icomoon/style.css b/cds-ui/designer-client/src/assets/icomoon/style.css
index dc7de38e5..945d9d380 100755
--- a/cds-ui/designer-client/src/assets/icomoon/style.css
+++ b/cds-ui/designer-client/src/assets/icomoon/style.css
@@ -1,10 +1,10 @@
@font-face {
font-family: 'icomoon';
- src: url('fonts/icomoon.eot?hdnbak');
- src: url('fonts/icomoon.eot?hdnbak#iefix') format('embedded-opentype'),
- url('fonts/icomoon.ttf?hdnbak') format('truetype'),
- url('fonts/icomoon.woff?hdnbak') format('woff'),
- url('fonts/icomoon.svg?hdnbak#icomoon') format('svg');
+ src: url('fonts/icomoon.eot?rdm62r');
+ src: url('fonts/icomoon.eot?rdm62r#iefix') format('embedded-opentype'),
+ url('fonts/icomoon.ttf?rdm62r') format('truetype'),
+ url('fonts/icomoon.woff?rdm62r') format('woff'),
+ url('fonts/icomoon.svg?rdm62r#icomoon') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
@@ -35,6 +35,10 @@
-moz-osx-font-smoothing: grayscale;
}
+.icon-file:before {
+ content: "\e905";
+ color: #1b3e6f;
+}
.icon-action-back:before {
content: "\e904";
color: #1b3e6f;
diff --git a/cds-ui/designer-client/src/assets/img/icon-error.sketch b/cds-ui/designer-client/src/assets/img/icon-error.sketch
deleted file mode 100644
index 0a17404bc..000000000
--- a/cds-ui/designer-client/src/assets/img/icon-error.sketch
+++ /dev/null
Binary files differ
diff --git a/cds-ui/designer-client/src/assets/img/icon-error.svg b/cds-ui/designer-client/src/assets/img/icon-error.svg
new file mode 100644
index 000000000..e26cad3f9
--- /dev/null
+++ b/cds-ui/designer-client/src/assets/img/icon-error.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="512px" height="512px" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!-- Generator: Sketch 61.2 (89653) - https://sketch.com -->
+ <title>signs</title>
+ <desc>Created with Sketch.</desc>
+ <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <g id="signs" fill-rule="nonzero">
+ <path d="M256,0 C114.835938,0 0,114.835938 0,256 C0,397.164062 114.835938,512 256,512 C397.164062,512 512,397.164062 512,256 C512,114.835938 397.164062,0 256,0 Z" id="Path" fill="#FF6469"></path>
+ <path d="M277.332031,384 C277.332031,395.78125 267.78125,405.332031 256,405.332031 C244.21875,405.332031 234.667969,395.78125 234.667969,384 C234.667969,372.21875 244.21875,362.667969 256,362.667969 C267.78125,362.667969 277.332031,372.21875 277.332031,384 Z" id="Path" fill="#ECEFF1"></path>
+ <path d="M277.332031,298.667969 C277.332031,310.441406 267.777344,320 256,320 C244.222656,320 234.667969,310.441406 234.667969,298.667969 L234.667969,128 C234.667969,116.222656 244.222656,106.667969 256,106.667969 C267.777344,106.667969 277.332031,116.222656 277.332031,128 L277.332031,298.667969 Z" id="Path" fill="#FAFAFA"></path>
+ </g>
+ </g>
+</svg> \ No newline at end of file
diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css
index a705b2744..164a459c3 100644
--- a/cds-ui/designer-client/src/styles.css
+++ b/cds-ui/designer-client/src/styles.css
@@ -74,6 +74,7 @@ body{
.toast-error{
border-left: solid 5px #FF6469 !important;
background: url(/assets/img/icon-error.svg) 12px center #fff no-repeat !important;
+ background-size: 18px !important;
}
/*ICONS*/
.icon-menuDots{
@@ -555,12 +556,15 @@ height: 40px;
border: solid 1px #D7E7F9 !important;
box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.18) !important;
}
+.addPaackage-card .card-body img{
+ width: 30%;
+}
.addPaackage-card a{
margin: 0;
padding: 7px 15px;
font-weight: bold;
font-size: 12px;
- border-radius: 2px;
+ border-radius: 18px;
border-width: 0px;
border-style: solid;
background-position: 15px center;
@@ -1152,7 +1156,7 @@ height: 40px;
}
.btn-create-package,
.btn-import-package{
- width: 145px;
+ width: auto;
}
.btn-create-package{
margin-bottom: 6px !important;
@@ -1235,9 +1239,7 @@ height: 40px;
background: #1B3E6F;
box-shadow: none;
}
-.package-version{
- /* color: #C3CDDB !important; */
-}
+
.package-version::before{
content: "|";
margin-left: 8px;