From cc3532626edbeee463d661b5721ca5ddc3f69e44 Mon Sep 17 00:00:00 2001 From: Arundathi Patil Date: Mon, 18 Mar 2019 17:50:14 +0530 Subject: Modify Component HTML changes Moved the deploy, save , download, publish, enrich action buttons to common modify-template component Issue-ID: CCSDK-1098 Change-Id: I52d4cb1864d90eecbb7b1fcdadfb17d8be84b86d Signed-off-by: Arundathi Patil --- cds-ui/client/angular.json | 3 +- cds-ui/client/package.json | 2 +- .../modify-template/editor/editor.component.html | 23 +------ .../modify-template/editor/editor.component.scss | 12 +++- .../modify-template/modify-template.component.html | 74 +++++++--------------- .../modify-template/modify-template.component.scss | 23 +++++++ .../modify-template/modify-template.component.ts | 11 +++- cds-ui/client/src/styles.scss | 22 +++++++ 8 files changed, 94 insertions(+), 76 deletions(-) (limited to 'cds-ui/client') diff --git a/cds-ui/client/angular.json b/cds-ui/client/angular.json index 9d07cfff9..96b4df009 100644 --- a/cds-ui/client/angular.json +++ b/cds-ui/client/angular.json @@ -29,7 +29,8 @@ "styles": [ "src/styles.scss", "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css", - "./node_modules/material-design-icons/iconfont/material-icons.css" + "./node_modules/material-design-icons/iconfont/material-icons.css", + "./node_modules/font-awesome/css/font-awesome.css" ], "scripts": [ "./node_modules/ace-builds/src-min/ace.js", diff --git a/cds-ui/client/package.json b/cds-ui/client/package.json index 0eea31ec1..8963be367 100644 --- a/cds-ui/client/package.json +++ b/cds-ui/client/package.json @@ -30,8 +30,8 @@ "@types/d3": "^5.7.0", "core-js": "^2.5.4", "d3": "^5.9.1", - "font-awesome": "^4.7.0", "file-saver": "^2.0.1", + "font-awesome": "^4.7.0", "hammerjs": "^2.0.8", "jszip": "^3.2.0", "material-design-icons": "^3.0.1", diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html index 53bbc6dfa..64b201d81 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html @@ -21,13 +21,10 @@ limitations under the License.
- - -
+
- -
+ \ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss index 58f0ab85d..136c08bfa 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss @@ -41,12 +41,20 @@ limitations under the License. overflow: hidden; height: 100% !important; background-color: white !important; - border: 1px solid #3f87a6; - border-left: 5px solid #3f87a6; + border: 1px solid #3f51b5; + // border-left: 5px solid #3f51b5; } .savebtn { color: white; background-color: #3f51b5; position: absolute; bottom: 5px; +} +.save-icon{ + position: absolute; + left: 59em; + color: #3f51b5; + font-size: 24px; + cursor: pointer; + z-index: 1; } \ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html index 81a1a851e..a77be5ba0 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html @@ -18,58 +18,30 @@ See the License for the specific language governing permissions and limitations under the License. ============LICENSE_END============================================ --> - -
- - -
\ No newline at end of file +
+ +
+
+ +
+
+
+
+
+ + + + + + + + + + +
+
+
\ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.scss b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.scss index 2d9685e24..609d6faf0 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.scss +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.scss @@ -54,4 +54,27 @@ limitations under the License. .editor-selector { width: 100%; +} + +.mat-button-active{ + margin: 0.5em; + background-color: #3f51b5 !important; + color: white !important; + border-radius: 4px; + border: none; + line-height: none !important; + // padding: 0.5em; + min-width: 6em; + cursor: pointer; +} + +.mat-button-disablled { + background-color: #c5cae8 !important; + border-radius: 4px; + color: darkgray !important; + line-height: none !important; + margin: 0.5em; + // padding: 0.5em; + min-width: 6em; + cursor: initial; } \ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts index 809f31027..e39ce019c 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts @@ -19,7 +19,9 @@ limitations under the License. ============LICENSE_END============================================ */ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; + +import { EditorComponent } from './editor/editor.component'; @Component({ selector: 'app-modify-template', @@ -28,10 +30,13 @@ import { Component, OnInit } from '@angular/core'; }) export class ModifyTemplateComponent implements OnInit { + isEnriched: boolean = false; designerMode: boolean = false; editorMode: boolean = true; viewText: string = "Designer View"; + @ViewChild(EditorComponent) editorComp: EditorComponent; + constructor() { } ngOnInit() { @@ -53,4 +58,8 @@ export class ModifyTemplateComponent implements OnInit { } } + downloadCBA() { + this.editorComp.download(); + } + } diff --git a/cds-ui/client/src/styles.scss b/cds-ui/client/src/styles.scss index 1a81d0d71..10d55776d 100644 --- a/cds-ui/client/src/styles.scss +++ b/cds-ui/client/src/styles.scss @@ -24,3 +24,25 @@ limitations under the License. .mat-card:not([class*=mat-elevation-z]) { box-shadow: none !important; } + +.btn-active { + margin: 0.5em; + background-color: #3f51b5; + color: white; + border-radius: 4px; + border: none; + padding: 0.5em; + min-width: 6em; + cursor: pointer; +} + +.btn-disablled { + background-color: #c5cae8; + border-radius: 4px; + color: darkgray; + margin: 0.5em; + padding: 0.5em; + min-width: 6em; + border: none; + cursor: initial; +} \ No newline at end of file -- cgit 1.2.3-korg