aboutsummaryrefslogtreecommitdiffstats
path: root/cds-ui/designer-client/src/app/modules/feature-modules/packages
diff options
context:
space:
mode:
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages')
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html896
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css24
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html16
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html33
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html4
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html4
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-header/packages-header.component.html66
7 files changed, 546 insertions, 497 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 fb2dce6c9..318b30c14 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
@@ -121,534 +121,508 @@
aria-labelledby="exampleModalLongTitle" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
- <div class="modal-content">
- <div class="modal-header">
- <h5 class="modal-title" id="exampleModalLongTitle"></h5>
- <button type="button" class="close" data-dismiss="modal"
- aria-label="Close" title="Close">
- <i class="icon-action-close"></i>
- </button>
- </div>
- <div class="modal-body">
- <div id="carouselExampleIndicators" class="carousel slide"
- data-ride="carousel" data-interval="false">
- <div class="carousel-inner" style="height: 480px">
- <!--OPTIONS SLIDE-->
- <div class="carousel-item active">
- <h1>Let’s create the 1st Action</h1>
- <div class="row">
- <!--Custom Action-->
- <div class="col-3 d-flex">
- <a class="d-flex"
- data-target="#carouselExampleIndicators"
- data-slide-to="1">
- <div class="card actionType custom">
- <div class="card-body">
- <h3>Custom</h3>
- <p>Start with your own settings</p>
- <button
- data-target="#carouselExampleIndicators"
- data-slide-to="1" class="btn">
- Create
- </button>
- </div>
- </div>
- </a>
- </div>
- <!--Default Action-->
- <div class="col-3 d-flex">
- <a class="d-flex"
- data-target="#carouselExampleIndicators"
- data-slide-to="2">
- <div class="card actionType default">
- <div class="card-body">
- <h3>Default</h3>
- <p>Explore preset actions from CDS
- Action Catalog</p>
- <button
- data-target="#carouselExampleIndicators"
- data-slide-to="2" class="btn">
- Select
- </button>
- </div>
+ <div class="modal-header">
+ <h5 class="modal-title" id="exampleModalLongTitle"></h5>
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"
+ title="Close">
+ <i class="icon-action-close"></i>
+ </button>
+ </div>
+ <div class="modal-body">
+ <div id="carouselExampleIndicators" class="carousel slide"
+ data-ride="carousel" data-interval="false">
+ <div class="carousel-inner">
+ <!--OPTIONS SLIDE-->
+ <div class="carousel-item active">
+ <h3 class="mainHead">Create an action</h3>
+ <h1>How would you like to get started?</h1>
+ <div class="row">
+ <!--Custom Action-->
+ <div class="col-3 d-flex">
+ <a class="d-flex"
+ data-target="#carouselExampleIndicators"
+ data-slide-to="1">
+ <div class="card actionType custom">
+ <div class="card-body">
+ <h3>Custom</h3>
+ <p>Start with your own settings</p>
+ <button
+ data-target="#carouselExampleIndicators"
+ data-slide-to="1" class="btn">
+ Create
+ </button>
</div>
- </a>
- </div>
- <!--Recent Action-->
- <div class="col-3 d-flex">
- <a class="d-flex"
- data-target="#carouselExampleIndicators"
- data-slide-to="3">
- <div class="card actionType recent">
- <div class="card-body">
- <h3>Recent</h3>
- <p>Re-use recent actions of your
- recent
- packages</p>
- <button
- data-target="#carouselExampleIndicators"
- data-slide-to="3" class="btn">
- Select
- </button>
- </div>
+ </div>
+ </a>
+ </div>
+ <!--Default Action-->
+ <div class="col-3 d-flex">
+ <a class="d-flex"
+ data-target="#carouselExampleIndicators"
+ data-slide-to="2">
+ <div class="card actionType default">
+ <div class="card-body">
+ <h3>Default</h3>
+ <p>Explore preset actions from CDS
+ Action Catalog</p>
+ <button
+ data-target="#carouselExampleIndicators"
+ data-slide-to="2" class="btn">
+ Select
+ </button>
</div>
- </a>
- </div>
- <!--Import Action-->
- <div class="col-3 d-flex">
- <a class="d-flex"
- data-target="#carouselExampleIndicators"
- data-slide-to="4">
- <div class="card actionType import">
- <div class="card-body">
- <h3>Import</h3>
- <p>Import your own action files</p>
- <button
- data-target="#carouselExampleIndicators"
- data-slide-to="4" class="btn">
- Browse</button>
- </div>
+ </div>
+ </a>
+ </div>
+ <!--Recent Action-->
+ <div class="col-3 d-flex">
+ <a class="d-flex"
+ data-target="#carouselExampleIndicators"
+ data-slide-to="3">
+ <div class="card actionType recent">
+ <div class="card-body">
+ <h3>Recent</h3>
+ <p>Re-use recent actions of your
+ recent
+ packages</p>
+ <button
+ data-target="#carouselExampleIndicators"
+ data-slide-to="3" class="btn">
+ Select
+ </button>
</div>
- </a>
- </div>
+ </div>
+ </a>
</div>
- <div class="row">
- <div class="col text-center">
- <button class="btn skip-btn"
- (click)="goToDesignerMode(viewedPackage.id)">Skip
- to Designer Canvas</button>
- </div>
+ <!--Import Action-->
+ <div class="col-3 d-flex">
+ <a class="d-flex"
+ data-target="#carouselExampleIndicators"
+ data-slide-to="4">
+ <div class="card actionType import">
+ <div class="card-body">
+ <h3>Import</h3>
+ <p>Import your own action files</p>
+ <button
+ data-target="#carouselExampleIndicators"
+ data-slide-to="4" class="btn">
+ Browse</button>
+ </div>
+ </div>
+ </a>
</div>
</div>
- <!--Custom Action Form-->
- <div class="carousel-item">
- <button data-target="#carouselExampleIndicators"
- data-slide-to="0" title="Back" class="btn back"><i
- class="icon-action-back"></i></button>
- <h1>Create Custom Action</h1>
- <div class="form-group text-center">
- <input type="text" [(ngModel)]="customActionName"
- class="form-control customAction"
- placeholder="Type Action Name" autofocus>
- <button type="button"
- (click)="goToDesignerMode(viewedPackage.id)"
- class="btn submit">Start</button>
+ <div class="row">
+ <div class="col text-center">
+ <button class="btn skip-btn"
+ (click)="goToDesignerMode(viewedPackage.id)">Skip
+ to Designer Canvas</button>
</div>
-
</div>
- <!--Default Actions Form-->
- <div class="carousel-item">
- <button data-target="#carouselExampleIndicators"
- data-slide-to="0" title="Back" class="btn back"><i
- class="icon-action-back"></i></button>
- <h1>Choose Action(s) from CDS Default Package </h1>
- <div class="actionFormWrapper">
- <div class="row mb-3">
- <div class="col sort-packages">
- <label class="actionlabel">Version</label>
- <div class="dropdown" style="width: 90px">
- <input class="dropdown-toggle" type="text">
- <div class="dropdown-text">1.6.2</div>
- <ul class="dropdown-content">
- <li>
- <a>1.1.8</a>
- </li>
- <li>
- <a>2.1.8</a>
- </li>
- </ul>
- </div>
- </div>
- <div class="col">
- <input type="text"
- class="form-control searchInput"
- placeholder="Search">
+ </div>
+ <!--Custom Action Form-->
+ <div class="carousel-item">
+ <button data-target="#carouselExampleIndicators"
+ data-slide-to="0" title="Back" class="btn back"><i
+ class="icon-action-back"></i></button>
+ <h1>Create Custom Action</h1>
+ <div class="form-group text-center">
+ <input type="text" [(ngModel)]="customActionName"
+ class="form-control customAction"
+ placeholder="Type Action Name" autofocus>
+ <button type="button"
+ (click)="goToDesignerMode(viewedPackage.id)"
+ class="btn submit">Start</button>
+ </div>
+
+ </div>
+ <!--Default Actions Form-->
+ <div class="carousel-item">
+ <button data-target="#carouselExampleIndicators"
+ data-slide-to="0" title="Back" class="btn back"><i
+ class="icon-action-back"></i></button>
+ <h1>Choose Action(s) from CDS Default Package </h1>
+ <div class="actionFormWrapper">
+ <div class="row mb-3">
+ <div class="col sort-packages">
+ <label class="actionlabel">Version</label>
+ <div class="dropdown" style="width: 90px">
+ <input class="dropdown-toggle" type="text">
+ <div class="dropdown-text">1.6.2</div>
+ <ul class="dropdown-content">
+ <li>
+ <a>1.1.8</a>
+ </li>
+ <li>
+ <a>2.1.8</a>
+ </li>
+ </ul>
</div>
</div>
- <div class="row actionsListScroll">
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation1"
- required>
- <label class="custom-control-label"
- for="customControlValidation1">config-assign</label>
- </div>
+ <div class="col">
+ <input type="text" class="form-control searchInput"
+ placeholder="Search">
+ </div>
+ </div>
+ <div class="row actionsListScroll">
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation1" required>
+ <label class="custom-control-label"
+ for="customControlValidation1">config-assign</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation2"
- required>
- <label class="custom-control-label"
- for="customControlValidation2">config-assign-test</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation2" required>
+ <label class="custom-control-label"
+ for="customControlValidation2">config-assign-test</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation3"
- required>
- <label class="custom-control-label"
- for="customControlValidation3">config-deploy</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation3" required>
+ <label class="custom-control-label"
+ for="customControlValidation3">config-deploy</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation4"
- required>
- <label class="custom-control-label"
- for="customControlValidation4">config-modify</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation4" required>
+ <label class="custom-control-label"
+ for="customControlValidation4">config-modify</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
</div>
- <div class="row">
- <div class="col text-center">
- <p class="selectedActions">0 selected</p>
- <button type="button"
- (click)="goToDesignerMode(viewedPackage.id)"
- class="btn submit">Start</button>
- </div>
+ </div>
+ <div class="row">
+ <div class="col text-center">
+ <p class="selectedActions">0 selected</p>
+ <button type="button"
+ (click)="goToDesignerMode(viewedPackage.id)"
+ class="btn submit">Start</button>
</div>
</div>
</div>
- <!--Recent Actions Form-->
- <div class="carousel-item">
- <button data-target="#carouselExampleIndicators"
- data-slide-to="0" title="Back" class="btn back"><i
- class="icon-action-back"></i></button>
- <h1>Choose Action(s) from Recent Packages</h1>
- <div class="actionFormWrapper">
- <div class="row mb-3">
- <div class="col sort-packages">
- <label class="actionlabel">Package
- Name</label>
- <div class="dropdown">
- <input class="dropdown-toggle" type="text">
- <div class="dropdown-text">CDS (v 1.0.0)
- </div>
- <ul class="dropdown-content">
- <li>
- <a>Test Package (v 1.1.8)</a>
- </li>
- <li>
- <a>Test Package (v 1.1.8)</a>
- </li>
- <li>
- <a>Test Package (v 1.1.8)</a>
- </li>
- <li>
- <a>Test Package (v 1.1.8)</a>
- </li>
- </ul>
+ </div>
+ <!--Recent Actions Form-->
+ <div class="carousel-item">
+ <button data-target="#carouselExampleIndicators"
+ data-slide-to="0" title="Back" class="btn back"><i
+ class="icon-action-back"></i></button>
+ <h1>Choose Action(s) from Recent Packages</h1>
+ <div class="actionFormWrapper">
+ <div class="row mb-3">
+ <div class="col sort-packages">
+ <label class="actionlabel">Package
+ Name</label>
+ <div class="dropdown">
+ <input class="dropdown-toggle" type="text">
+ <div class="dropdown-text">CDS (v 1.0.0)
</div>
- </div>
- <div class="col">
- <input type="text"
- class="form-control searchInput"
- placeholder="Search">
+ <ul class="dropdown-content">
+ <li>
+ <a>Test Package (v 1.1.8)</a>
+ </li>
+ <li>
+ <a>Test Package (v 1.1.8)</a>
+ </li>
+ <li>
+ <a>Test Package (v 1.1.8)</a>
+ </li>
+ <li>
+ <a>Test Package (v 1.1.8)</a>
+ </li>
+ </ul>
</div>
</div>
- <div class="row actionsListScroll">
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation1"
- required>
- <label class="custom-control-label"
- for="customControlValidation1">config-assign</label>
- </div>
+ <div class="col">
+ <input type="text" class="form-control searchInput"
+ placeholder="Search">
+ </div>
+ </div>
+ <div class="row actionsListScroll">
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation1" required>
+ <label class="custom-control-label"
+ for="customControlValidation1">config-assign</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation2"
- required>
- <label class="custom-control-label"
- for="customControlValidation2">config-assign-test</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation2" required>
+ <label class="custom-control-label"
+ for="customControlValidation2">config-assign-test</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation3"
- required>
- <label class="custom-control-label"
- for="customControlValidation3">config-deploy</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation3" required>
+ <label class="custom-control-label"
+ for="customControlValidation3">config-deploy</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation4"
- required>
- <label class="custom-control-label"
- for="customControlValidation4">config-modify</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation4" required>
+ <label class="custom-control-label"
+ for="customControlValidation4">config-modify</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
- <div class="col-6">
- <div class="actionName">
- <div class="custom-control custom-checkbox">
- <input type="checkbox"
- class="custom-control-input"
- id="customControlValidation5"
- required>
- <label class="custom-control-label"
- for="customControlValidation5">config-assign1</label>
- </div>
+ </div>
+ <div class="col-6">
+ <div class="actionName">
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox"
+ class="custom-control-input"
+ id="customControlValidation5" required>
+ <label class="custom-control-label"
+ for="customControlValidation5">config-assign1</label>
</div>
</div>
</div>
- <div class="row">
- <div class="col text-center">
- <p class="selectedActions">0 selected</p>
- <button type="button"
- class="btn submit">Start</button>
- </div>
+ </div>
+ <div class="row">
+ <div class="col text-center">
+ <p class="selectedActions">0 selected</p>
+ <button type="button"
+ class="btn submit">Start</button>
</div>
</div>
</div>
- <!--Import Actions Form-->
- <div class="carousel-item">
- <button data-target="#carouselExampleIndicators"
- data-slide-to="0" title="Back" class="btn back"><i
- class="icon-action-back"></i></button>
- <h1>Import Action(s)</h1>
- <div class="actionFormWrapper">
- <div class="row">
- <div class="col">
- <ngx-file-drop accept=".json"
- dropZoneLabel="Drop files here"
- (onFileDrop)="dropped($event)"
- (onFileOver)="fileOver($event)"
- (onFileLeave)="fileLeave($event)">
- <ng-template ngx-file-drop-content-tmp
- let-openFileSelector="openFileSelector">
- <div class="folder-upload">
- <img
- src="assets/img/folder-upload.svg" />
- </div>
- <div class="folder-upload-text">
- Drag & Drop file
- </div>
- <div class="folder-upload-text">or
- <button type="button"
- class="btn btn-sm btn-primary"
- (click)="openFileSelector()">Browse
- Files
- </button>
- </div>
- <div class="folder-upload-type">
- Allowed file
- type: json</div>
- </ng-template>
- </ngx-file-drop>
- <div class="upload-table">
- <table class="table">
- <thead>
- <tr
- *ngFor="let item of uploadedFiles; let i=index">
- <th width="40"><img
- src="assets/img/icon-file-code.svg" />
- </th>
- <th>{{ item.name }}</th>
- <th width="40"
- class="text-right">
- <img
- src="assets/img/icon-remove-file.svg" />
- </th>
- </tr>
- </thead>
- </table>
- </div>
+ </div>
+ <!--Import Actions Form-->
+ <div class="carousel-item">
+ <button data-target="#carouselExampleIndicators"
+ data-slide-to="0" title="Back" class="btn back"><i
+ class="icon-action-back"></i></button>
+ <h1>Import Action(s)</h1>
+ <div class="actionFormWrapper">
+ <div class="row">
+ <div class="col">
+ <ngx-file-drop accept=".json"
+ dropZoneLabel="Drop files here"
+ (onFileDrop)="dropped($event)"
+ (onFileOver)="fileOver($event)"
+ (onFileLeave)="fileLeave($event)">
+ <ng-template ngx-file-drop-content-tmp
+ let-openFileSelector="openFileSelector">
+ <div class="folder-upload">
+ <img
+ src="assets/img/folder-upload.svg" />
+ </div>
+ <div class="folder-upload-text">
+ Drag & Drop file
+ </div>
+ <div class="folder-upload-text">or
+ <button type="button"
+ class="btn btn-sm btn-primary"
+ (click)="openFileSelector()">Browse
+ Files
+ </button>
+ </div>
+ <div class="folder-upload-type">
+ Allowed file
+ type: json</div>
+ </ng-template>
+ </ngx-file-drop>
+ <div class="upload-table">
+ <table class="table">
+ <thead>
+ <tr
+ *ngFor="let item of uploadedFiles; let i=index">
+ <th width="40"><img
+ src="assets/img/icon-file-code.svg" />
+ </th>
+ <th>{{ item.name }}</th>
+ <th width="40" class="text-right">
+ <img
+ src="assets/img/icon-remove-file.svg" />
+ </th>
+ </tr>
+ </thead>
+ </table>
</div>
</div>
- <div class="row">
- <div class="col text-center">
- <button type="button"
- class="btn submit mt-4">Import</button>
- </div>
+ </div>
+ <div class="row">
+ <div class="col text-center">
+ <button type="button"
+ class="btn submit mt-4">Import</button>
</div>
</div>
</div>
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 22eeeeb32..f7cff5072 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
@@ -116,7 +116,7 @@ header{
.btn-topology-action,
.btn-topology-action:hover{
margin: 0 6px;
- padding: 4px 8px;
+ padding: 3px 8px;
color: #fff;
border-radius: 50%;
border: solid .5px #fff;
@@ -125,9 +125,10 @@ header{
margin-right: 0;
}
.btn-topology-action .fa{
- width: 16px;
- height: 16px;
+ /* width: 16px;
+ height: 16px; */
text-align: center;
+ font-size: 14px;
}
.topology-actions .dropdown-text,
.dropdown-toggle:hover ~ .dropdown-text,
@@ -177,7 +178,7 @@ header{
padding: 0 !important;
}
.package-info h3{
- font-size: 15px;
+ font-size: 13px;
font-weight: bold;
}
.package-info h3 span{
@@ -385,9 +386,9 @@ p.compType-4{
}
.new-action,
.new-action:hover{
- margin: 9px 0 4px 18px;
+ margin: 9px 0 4px 3px;
padding: 6px;
- font-size: 13px;
+ font-size: 12px;
font-weight: bold;
color: #1B3E6F;
}
@@ -486,7 +487,7 @@ p.compType-4{
/*CANVAS*/
.source-button.editBar{
position: absolute;
- z-index: 9999999;
+ z-index: 1000 /*9999999*/;
top: 60px;
/* left: 50%; */
}
@@ -527,6 +528,7 @@ p.compType-4{
}
.editBar .toggoleBtn.active,
.editBar2 .toggoleBtn.active{
+ padding: 0 10px !important;
background-color: #1B3E6F !important;
color: #fff;
}
@@ -791,7 +793,7 @@ p.compType-4{
margin-top: 14px;
padding-left: 30px!important;
border: 0;
- font-size: 12px;
+ font-size: 11px;
color: #1B3E6F !important;
background-color: #fff !important;
background-repeat: no-repeat;
@@ -826,13 +828,14 @@ ul.templateLegend{
color: #0ABDE3;
}
ul.editor{
- margin-right: -40px;
+ /* margin-right: -40px; */
margin-top: 16px;
}
.editor li{
list-style: none;
}
.editor .btn {
+ padding: 0 8px !important;
box-shadow: none;
}
.ace_editor{
@@ -848,3 +851,6 @@ ul.editor{
margin-left: 12px;
margin-right: 12px;
}
+.zoom-percent{
+ font-size: 12px;
+}
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 7f49d3cf3..6a432fec8 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
@@ -31,19 +31,23 @@
<img src="assets/img/icon-close.svg" />
</button>
</div>
- <div class="modal-body">
- <div class="row package-info">
+ <div class="modal-body package-info">
+ <div class="row">
<div class="col">
<h3>Test Package
<span class="package-version">Version 1.0.2</span></h3>
</div>
+ </div>
+ <div class="row">
<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>
<span class="badge badge-primary">MARCO</span>
</div>
- <div class="col-2">
+ </div>
+ <div class="row">
+ <div class="col-2 pr-0">
<img src="/assets/img/img-user3.jpg" class="creator-pic">
</div>
<div class="col-10 pl-0">
@@ -126,7 +130,7 @@
<li class="capability"><i class="icon-rectangle" aria-hidden="true"></i> Capability</li>
</ul>
- <ul class="editor navbar ml-auto">
+ <ul class="editor navbar">
<li>
<button type="button" class="btn tooltip-bottom" data-tooltip="Undo">
<img src="/assets/img/icon-undoActive.svg">
@@ -141,14 +145,14 @@
<li><button type="button" class="btn tooltip-bottom" data-tooltip="Zoom Out">
<img src="/assets/img/icon-zoomOut.svg">
</button></li>
- <li>100%</li>
+ <li class="zoom-percent">100%</li>
<li>
<button type="button" class="btn tooltip-bottom" data-tooltip="Zoom In">
<img src="/assets/img/icon-zoomIn.svg"> </button>
</li>
</ul>
- <ul class="navbar ml-auto" style="list-style: none">
+ <ul class="navbar ml-2" style="list-style: none">
<li class="nav-item">
<div class="btn-group viewBtns" role="group">
<button type="button" class="btn btn-secondary topologySource active">Designer</button>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html
index 270482f12..eedbe9f85 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html
@@ -4,11 +4,11 @@
<p class="logo mb-0"></p>
<nav aria-label="breadcrumb">
<ol class="breadcrumb designer-breadcrumb mb-0">
- <li class="breadcrumb-item">
+ <li class="breadcrumb-item">
<a href="#">CBA Packages</a>
</li>
- <i class="fa fa-angle-right ml-2 mr-2"></i>
- <li class="breadcrumb-item">
+ <i class="fa fa-angle-right ml-2 mr-2"></i>
+ <li class="breadcrumb-item">
<a href="/package/{{viewedPackage.id}}">{{viewedPackage.artifactName}}</a>
<button type="button" class="btn package-info-btn" data-toggle="modal"
data-target="#exampleModalLong">
@@ -30,19 +30,23 @@
<img src="assets/img/icon-close.svg" />
</button>
</div>
- <div class="modal-body">
- <div class="row package-info">
+ <div class="modal-body package-info">
+ <div class="row">
<div class="col">
<h3>Test Package
<span class="package-version">Version 1.0.2</span></h3>
</div>
+ </div>
+ <div class="row">
<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>
<span class="badge badge-primary">MARCO</span>
</div>
- <div class="col-2">
+ </div>
+ <div class="row">
+ <div class="col-2 pr-0">
<img src="/assets/img/img-user3.jpg" class="creator-pic">
</div>
<div class="col-10 pl-0">
@@ -120,11 +124,11 @@
</li>
</ul>
</li>
-
+
<li class="nav-item">
<div class="btn-group viewBtns" role="group">
- <button (click)="convertAndOpenInDesingerView(viewedPackage.id)"
- type="button" class="btn btn-secondary topologySource">Designer</button>
+ <button (click)="convertAndOpenInDesingerView(viewedPackage.id)" type="button"
+ class="btn btn-secondary topologySource">Designer</button>
<button type="button" class="btn btn-secondary topologyView active">Scripting</button>
</div>
</li>
@@ -148,9 +152,10 @@
</div>
</ng-sidebar>
-<div ng-sidebar-content id="board-paper">
- <ace-editor [(text)]="content" [mode]="'json'" [autoUpdateContent]="true" [durationBeforeCallback]="1000"
- [theme]="'tomorrow_night_bright'" #editor style="height:500px">
- </ace-editor>
+ <div ng-sidebar-content id="board-paper">
+ <ace-editor [(text)]="content" [mode]="'json'" [autoUpdateContent]="true" [durationBeforeCallback]="1000"
+ [theme]="'tomorrow_night_bright'" #editor style="height:500px">
+ </ace-editor>
- </div>
+ </div>
+ \ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html
index 9ac7a058a..8f2b554d9 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html
@@ -1,5 +1,5 @@
<div class="import-container-all">
- <div class="import-container">
+ <!-- <div class="import-container">
<div class="import-container-input">
<input placeholder="Enter file URL then ENTER" type="input" class="ng-pristine ng-valid ng-touched">
<a class="enter-link" href="#"><i class="icon-enter-link"></i></a>
@@ -7,7 +7,7 @@
<span class="import-container-span">Or you can also <a href="#" data-toggle="modal"
(click)="resetTheUploadedFiles()" data-target="#importModal"><b>Import File</b></a></span>
- </div>
+ </div> -->
<div class="accordion">
<!-- <div class="card creat-card">
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html
index 7afea6b9a..fc001b11b 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html
@@ -41,8 +41,8 @@
role="tab" aria-controls="nav-template" aria-selected="false">TEMPLATE & MAPPING</a>
<a class="nav-item nav-link" id="nav-scripts-tab" data-toggle="tab" href="#nav-scripts"
role="tab" aria-controls="nav-scripts" aria-selected="false">SCRIPTS</a>
- <a class="nav-item nav-link" id="nav-imports-tab" data-toggle="tab" href="#nav-imports"
- role="tab" aria-controls="nav-imports" aria-selected="false">DEFINITIONS</a>
+ <!-- <a class="nav-item nav-link" id="nav-imports-tab" data-toggle="tab" href="#nav-imports"
+ role="tab" aria-controls="nav-imports" aria-selected="false">DEFINITIONS</a> -->
<a class="nav-item nav-link" id="nav-authentication-tab" data-toggle="tab"
href="#nav-authentication" role="tab" aria-controls="nav-authentication"
aria-selected="false">EXTERNAL SYSTEM AUTHENTICATION PROPERTIES</a>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-header/packages-header.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-header/packages-header.component.html
index 09dd4187f..5e04b71ac 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-header/packages-header.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-header/packages-header.component.html
@@ -1,10 +1,70 @@
<!--Page Title-->
-<header class="page-title">
+<header class="page-title" style="padding-top: 14px;padding-bottom: 13px;">
<div class="row">
- <h2 class="col m-0">CBA Packages
+ <h2 class="col m-0" style="line-height: 33px;">CBA Packages
<span id="numberOfPackages">({{numberOfPackages}} packages)</span>
</h2>
- <div class="col">
+ <div class="col profile-help">
+ <nav class="navbar navbar-expand-lg navbar-light">
+ <ul class="navbar-nav ml-auto">
+ <li class="nav-item help-btn">
+ <a class="nav-link mr-2" href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank" [delay]="300"
+ tooltip="Help" placement="bottom"><i class="icon-info" aria-hidden="true"></i></a>
+ </li>
+ <div class="nav-item dropdown">
+ <input class="dropdown-toggle" type="text">
+ <div class="dropdown-text"><img src="../assets/img/img-user.jpeg" align="right"></div>
+ <ul class="dropdown-content">
+ <li>
+ <a href="#">Username</a>
+ </li>
+ <li>
+ <a href="#">Settings</a>
+ </li>
+ <li>
+ <a href="#">Projects</a>
+ </li>
+ <li>
+ <a href="#">Log out</a>
+ </li>
+ </ul>
+ </div>
+ <!-- <li class="nav-item dropdown">
+ <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Dropdown
+ </a>
+ <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+ <a class="dropdown-item" href="#">Action</a>
+ <a class="dropdown-item" href="#">Another action</a>
+ <div class="dropdown-divider"></div>
+ <a class="dropdown-item" href="#">Something else here</a>
+ </div>
+ </li> -->
+ </ul>
+ </nav>
+ <!-- <ul class="menu-dropdown userProfile">
+ <li><button type="button" class="btn package-info-btn" data-toggle="modal"
+ data-target="#exampleModalLong">
+ <i class="icon-info" aria-hidden="true"></i>
+ </button></li>
+ <li>
+ <div class="dropdown">
+ <input class="dropdown-toggle" type="text">
+ <div class="dropdown-text">User name</div>
+ <ul class="dropdown-content">
+ <li>
+ <a href="#">Settings</a>
+ </li>
+ <li>
+ <a href="#">Projects</a>
+ </li>
+ <li>
+ <a href="#">Log out</a>
+ </li>
+ </ul>
+ </div>
+ </li>
+ </ul> -->
</div>
</div>
</header>