diff options
Diffstat (limited to 'catalog-ui/src/app/ng2/pages/composition/palette/palette-element')
5 files changed, 137 insertions, 0 deletions
diff --git a/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/__snapshots__/palette-element.component.spec.ts.snap b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/__snapshots__/palette-element.component.spec.ts.snap new file mode 100644 index 0000000000..40df575519 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/__snapshots__/palette-element.component.spec.ts.snap @@ -0,0 +1,29 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`palette element component should match current snapshot of palette element component 1`] = ` +<palette-element> + <div + class="palette-element" + > + <sdc-element-icon + class="palette-element-icon" + /> + <div + class="palette-element-text" + > + <div + class="palette-element-name" + sdc-tooltip="" + > + + </div> + <span> + V. + </span> + <span> + + </span> + </div> + </div> +</palette-element> +`; diff --git a/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.html b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.html new file mode 100644 index 0000000000..3a6be5d082 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.html @@ -0,0 +1,11 @@ +<div class="palette-element" > + <sdc-element-icon class="palette-element-icon" [iconName]="paletteElement.icon" + [elementType]="paletteElement.componentSubType"[uncertified]="this.paletteElement.certifiedIconClass"></sdc-element-icon> + <div class="palette-element-text"> + <div class="palette-element-name" sdc-tooltip + tooltip-text='{{paletteElement.name | resourceName}}'>{{paletteElement.name | resourceName}} + </div> + <span> V.{{paletteElement.version}}</span> + <span>{{paletteElement.componentSubType}}</span> + </div> +</div>
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.less b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.less new file mode 100644 index 0000000000..e9c3253fbd --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.less @@ -0,0 +1,32 @@ +@import "./../../../../../../assets/styles/override"; +.palette-element { + cursor: pointer; + display: flex; + flex-direction: row; + max-height: 65px; + border-bottom: 1px solid @sdcui_color_silver; + padding: 10px; + align-items: center; + .palette-element-icon { + min-width: 45px; + text-align: center; + } + + .palette-element-text { + display: flex; + flex-direction: column; + font-size: 13px; + line-height: 15px; + padding-left: 10px; + font-family: OpenSans-Regular, sans-serif; + overflow: hidden; + + .palette-element-name { + color: @sdcui_color_dark-gray; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + } + } + +}
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.spec.ts b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.spec.ts new file mode 100644 index 0000000000..64ed45ba9c --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.spec.ts @@ -0,0 +1,30 @@ +import {async, ComponentFixture} from "@angular/core/testing"; +import {ConfigureFn, configureTests} from "../../../../../../jest/test-config.helper"; +import {NO_ERRORS_SCHEMA} from "@angular/core"; +import {PaletteElementComponent} from "./palette-element.component"; +import {ResourceNamePipe} from "../../../../pipes/resource-name.pipe"; + +describe('palette element component', () => { + + let fixture: ComponentFixture<PaletteElementComponent>; + + beforeEach( + async(() => { + const configure: ConfigureFn = testBed => { + testBed.configureTestingModule({ + declarations: [PaletteElementComponent, ResourceNamePipe], + imports: [], + schemas: [NO_ERRORS_SCHEMA] + }); + }; + + configureTests(configure).then(testBed => { + fixture = testBed.createComponent(PaletteElementComponent); + }); + }) + ); + + it('should match current snapshot of palette element component', () => { + expect(fixture).toMatchSnapshot(); + }); +});
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.ts b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.ts new file mode 100644 index 0000000000..9e9e5a29da --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/composition/palette/palette-element/palette-element.component.ts @@ -0,0 +1,35 @@ +/** + * Created by ob0695 on 6/28/2018. + */ +/*- + * ============LICENSE_START======================================================= + * SDC + * ================================================================================ + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ============LICENSE_END========================================================= + */ + +import {Component, Input} from "@angular/core"; +import {LeftPaletteComponent} from "app/models/components/displayComponent"; + +@Component({ + selector: 'palette-element', + templateUrl: './palette-element.component.html', + styleUrls: ['./palette-element.component.less'] +}) +export class PaletteElementComponent { + + @Input() paletteElement: LeftPaletteComponent; +} |