diff options
author | 2019-08-14 21:16:11 +0530 | |
---|---|---|
committer | 2019-08-14 21:16:24 +0530 | |
commit | 615b5e183723bba51e0b3c134c7b5b954f99cac0 (patch) | |
tree | 6a7146736975dfd9dc0d98a3f68907e211630058 /cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template | |
parent | 82bc5bf7beb713c14757d73de595b419366fc9c4 (diff) |
Search display formatting
Change-Id: Ideac871019a8115a986ab0c81455627464c0586d
Issue-ID: CCSDK-1275
Signed-off-by: Ezhilarasi <ezhrajam@in.ibm.com>
Diffstat (limited to 'cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template')
2 files changed, 51 insertions, 11 deletions
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template/search-from-database/search-from-database.component.html b/cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template/search-from-database/search-from-database.component.html index ca260394b..6683dba59 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template/search-from-database/search-from-database.component.html +++ b/cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template/search-from-database/search-from-database.component.html @@ -32,7 +32,24 @@ limitations under the License. </mat-autocomplete> --> </mat-form-field> </form> -<mat-grid-list cols="8"> +<div class="searchcontainer"> + <div class="flexBox"> + <div *ngFor="let option of options" style="position: relative !important;width:20% !important"> + <mat-card class="example-card"> + <mat-card-content class="card-content"> + {{option.blueprintModel.artifactName}} + <br>{{option.blueprintModel.updatedBy}} + </mat-card-content> + <mat-card-actions class="flexBox"> + <button mat-menu-item (click)="editCBA(option.blueprintModel.artifactName,edit)">Edit</button> + <button mat-menu-item (click)="editCBA(option.blueprintModel.artifactName,clone)">Clone</button> + <button mat-menu-item (click)="editCBA(option.blueprintModel.artifactName,info)">Info</button> + </mat-card-actions> + </mat-card> + </div> + </div> +</div> +<!-- <mat-grid-list cols="8"> <mat-grid-tile *ngFor="let option of options"> <mat-card class="example-card"> <mat-card-content class="card-content"> @@ -44,4 +61,4 @@ limitations under the License. </mat-card-actions> </mat-card> </mat-grid-tile> -</mat-grid-list>
\ No newline at end of file +</mat-grid-list> -->
\ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template/search-from-database/search-from-database.component.scss b/cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template/search-from-database/search-from-database.component.scss index 6692764ae..f84213f48 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template/search-from-database/search-from-database.component.scss +++ b/cds-ui/client/src/app/feature-modules/blueprint/select-template/search-template/search-from-database/search-from-database.component.scss @@ -20,25 +20,39 @@ limitations under the License. */ .example-card { - min-width: 150px; - max-height: 150px; + // min-width: 300px; + max-height: 200px; background-color: #ebebeb; + position: relative; + width: 250px; + margin: 5px; +} + +.mat-grid-tile { + position: absolute; + width: 240px !important; +} + +.mat-grid-list div { + position: relative; } button.mat-menu-item { width: auto; float: left; - // margin-top: 10px; - // margin-bottom: 5px; border-radius: 4px; - // min-width: 6em; background-color: #3f51b5; - margin: 1px; - // padding: 1px; + margin: 5px; cursor: pointer; color: white; } +.flexBox { + display: flex; + flex-flow: row; + flex-wrap: wrap; +} + .card-deck-container { position: relative; border-radius: 1px; @@ -47,10 +61,19 @@ button.mat-menu-item { // background-color: #f5f5f5; } -.grid-container { - margin: 20px; +.searchcontainer { + min-height: 300px; + overflow-x: hidden; + overflow-y: scroll; } .card-content { text-align: center; + margin: 5px; +} + +.mat-card-actions { + margin-left: 0px !important; + margin-right: 0px !important; + padding: 0px 0 !important; }
\ No newline at end of file |