From cc5fe65d2e756f76f8333ba985d7e147c33bc94f Mon Sep 17 00:00:00 2001 From: Rupinder Date: Mon, 8 Jun 2020 18:21:31 +0530 Subject: added workflow and template tabs Issue-ID: CCSDK-2278 Change-Id: I06a889d63131668c56602e2ce7a316f21b7f890f Signed-off-by: Rupinder --- .../packages/designer/designer.component.css | 55 +++++++++++++++++++++- .../packages/designer/designer.component.html | 40 ++++++++++++++-- .../packages/designer/designer.component.ts | 9 +++- 3 files changed, 96 insertions(+), 8 deletions(-) (limited to 'cds-ui/designer-client/src') 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 5054a8e9e..8b79844be 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 @@ -24,6 +24,17 @@ body{ content: ""; } +.editNavbar .nav-tabs{ + border-bottom-width: 2px; +} +.editNavbar .nav-tabs .nav-link{ + padding: 12px 15px !important; + text-align: center; +} +.editNavbar .nav-tabs .nav-link::before{ + content: ""; +} + /*Header*/ header{ position: relative; @@ -444,6 +455,7 @@ p.compType-4{ background: #fff; border: solid 1px #D9E6F2; color: #C3CDDB; + margin-top: 14px; } .controllerSidebar .custom-control label{ margin-bottom: 0; @@ -461,8 +473,9 @@ p.compType-4{ /*CANVAS*/ .editBar{ - width: 200px; - margin: 0 auto 0; + width: 73.7%; + margin: 0 auto 0 -320px; + height: 45px; padding: 6px 10px; background:#F4F9FE; /* border: solid 1px #E8EFF8; */ @@ -486,6 +499,7 @@ p.compType-4{ .viewBtns .btn{ background-position: 10px center; padding-left: 30px!important; + margin-top: 14px; } .viewBtns .topologySource{ background-image: url(src/assets/img/icon-topologyView-active.svg); @@ -738,3 +752,40 @@ p.compType-4{ margin-left: 150px; font-size:15px } + +.arrow{ + margin-left: -10px; + border-radius: 3% +} +.arr-size{ + font-size: 31px; +} +.editBar2{ + width: 98.7%; + margin: 0 auto 0 -640px; + height: 45px; + padding: 6px 10px; + background:#F4F9FE; + /* border: solid 1px #E8EFF8; */ + box-shadow: 0 2px 6px rgba(47, 83, 151, .1); +} +.editBar2 .btn-group{ + box-shadow: 0 2px 6px rgba(47, 83, 151, .15); +} +.editBar2 .btn{ + background-color: #fff; + background-repeat: no-repeat; + background-position: left center; + border: 0; + color: #1B3E6F; + font-size: 10px; +} +.editBar2 .btn.active{ + background-color: #1B3E6F !important; + color: #fff; +} +.editBar2 .viewBtns .btn{ + background-position: 10px center; + padding-left: 30px!important; + margin-top: 14px; +} 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 2bd484258..fe24f9df4 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 @@ -99,17 +99,47 @@ -
+
- + --> + + 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 9b8781d9b..4f31a08f4 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 @@ -55,6 +55,7 @@ export class DesignerComponent implements OnInit, OnDestroy { viewedPackage: BluePrintDetailModel = new BluePrintDetailModel(); customActionName: string; showAction: boolean; + cl = 'editBar'; boardGraph: joint.dia.Graph; boardPaper: joint.dia.Paper; @@ -73,11 +74,17 @@ export class DesignerComponent implements OnInit, OnDestroy { this.controllerSideBar = true; this.attributesSideBar = false; this.showAction = false; - this.functionAttributeSidebar = true; + this.functionAttributeSidebar = false; } private _toggleSidebar1() { this.controllerSideBar = !this.controllerSideBar; + if (this.controllerSideBar === false) { + this.cl = 'editBar2'; + } + if (this.controllerSideBar === true) { + this.cl = 'editBar'; + } } private _toggleSidebar2() { this.attributesSideBar = !this.attributesSideBar; -- cgit 1.2.3-korg