mirror of
https://github.com/goharbor/harbor.git
synced 2024-11-23 10:45:45 +01:00
Move inline css style to scss
Signed-off-by: FangyuanCheng <fangyuanc@vmware.com>
This commit is contained in:
FangyuanCheng
parent
06eec7b3ed
commit
c36e9daea1
@ -5,3 +5,17 @@
|
||||
.info-tips-icon:hover {
|
||||
color: #007CBB;
|
||||
}
|
||||
|
||||
.replication-config {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.replication-text {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.replication-tooltip {
|
||||
top: -8px;
|
||||
}
|
||||
@ -1,10 +1,10 @@
|
||||
<form #replicationConfigFrom="ngForm" class="compact">
|
||||
<section class="form-block" style="margin-top:0px;margin-bottom:0px;">
|
||||
<label style="font-size:14px;font-weight:600;" *ngIf="showSubTitle">{{'CONFIG.REPLICATION' | translate}}</label>
|
||||
<section class="form-block replication-config">
|
||||
<label class="replication-text" *ngIf="showSubTitle">{{'CONFIG.REPLICATION' | translate}}</label>
|
||||
<div class="form-group">
|
||||
<label for="verifyRemoteCert">{{'CONFIG.VERIFY_REMOTE_CERT' | translate }}</label>
|
||||
<clr-checkbox name="verifyRemoteCert" id="verifyRemoteCert" [(ngModel)]="replicationConfig.verify_remote_cert.value" [disabled]="!editable">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right" style="top:-8px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right replication-tooltip">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.VERIFY_REMOTE_CERT' | translate }}</span>
|
||||
</a>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<form #systemConfigFrom="ngForm" class="compact">
|
||||
<section class="form-block" style="margin-top:0px;margin-bottom:0px;">
|
||||
<label style="font-size:14px;font-weight:600;" *ngIf="showSubTitle">{{'CONFIG.SYSTEM' | translate}}</label>
|
||||
<section class="form-block">
|
||||
<label class="subtitle" *ngIf="showSubTitle">{{'CONFIG.SYSTEM' | translate}}</label>
|
||||
<div class="form-group">
|
||||
<label for="proCreation">{{'CONFIG.PRO_CREATION_RESTRICTION' | translate}}</label>
|
||||
<div class="select">
|
||||
@ -9,7 +9,7 @@
|
||||
<option value="adminonly">{{'CONFIG.PRO_CREATION_ADMIN' | translate }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right" style="top: -1px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right create-tooltip">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.PRO_CREATION_RESTRICTION' | translate}}</span>
|
||||
</a>
|
||||
@ -40,7 +40,7 @@
|
||||
<div *ngIf="!withAdmiral" class="form-group">
|
||||
<label for="repoReadOnly">{{'CONFIG.REPO_READ_ONLY' | translate}}</label>
|
||||
<clr-checkbox name="repoReadOnly" id="repoReadOnly" [clrChecked]="systemSettings.read_only.value" (clrCheckedChange)="setRepoReadOnlyValue($event)">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right" style="top:-7px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right read-tooltip">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.REPO_TOOLTIP' | translate}}</span>
|
||||
</a>
|
||||
|
||||
@ -0,0 +1,12 @@
|
||||
.subtitle {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.create-tooltip {
|
||||
top: -1;
|
||||
}
|
||||
|
||||
.read-tooltip {
|
||||
top: -7px;
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
<form #systemConfigFrom="ngForm" class="compact">
|
||||
<section class="form-block" style="margin-top:0px;margin-bottom:0px;">
|
||||
<section class="form-block">
|
||||
<label class="section-title" *ngIf="showSubTitle">{{ 'CONFIG.SCANNING.TITLE' | translate }}</label>
|
||||
<div class="form-group">
|
||||
<label>{{ 'CONFIG.SCANNING.DB_REFRESH_TIME' | translate }}</label>
|
||||
@ -9,12 +9,12 @@
|
||||
<span>{{'CONFIG.SCANNING.DB_NOT_READY' | translate }}</span>
|
||||
</clr-tooltip-content>
|
||||
</clr-tooltip>
|
||||
<clr-dropdown *ngIf="isClairDBFullyReady && showScanningNamespaces" style="margin-top:-8px;" class="clr-dropdown-override">
|
||||
<clr-dropdown *ngIf="isClairDBFullyReady && showScanningNamespaces" class="clr-dropdown-override">
|
||||
<button class="btn btn-link btn-font" clrDropdownToggle>
|
||||
{{ updatedTimestamp | date:'MM/dd/y HH:mm:ss' }} AM
|
||||
<clr-icon shape="caret down"></clr-icon>
|
||||
</button>
|
||||
<clr-dropdown-menu [clrPosition]="'bottom-right'" style="min-width:300px;">
|
||||
<clr-dropdown-menu [clrPosition]="'bottom-right'" class="dropdown-namespace">
|
||||
<div *ngFor="let nt of namespaceTimestamps" class="namespace">
|
||||
<span class="label label-info">{{nt.namespace}}</span>
|
||||
<span>{{ convertToLocalTime(nt.last_update) | date:'MM/dd/y HH:mm:ss'}} AM</span>
|
||||
|
||||
@ -22,12 +22,14 @@
|
||||
font-size: 12px !important;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
margin-left: 24px;
|
||||
}
|
||||
|
||||
.clr-dropdown-override {
|
||||
margin-top: -8px;
|
||||
.dropdown-namespace {
|
||||
min-width: 300px;
|
||||
.namespace {
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-scan-right button{
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<clr-modal [(clrModalOpen)]="opened" [clrModalClosable]="false" [clrModalStaticBackdrop]="true">
|
||||
<h3 class="modal-title" class="confirmation-title" style="margin-top: 0px;">{{dialogTitle}}</h3>
|
||||
<h3 class="modal-title" class="confirmation-title">{{dialogTitle}}</h3>
|
||||
<div class="modal-body">
|
||||
<div class="confirmation-icon-inline">
|
||||
<clr-icon shape="warning" class="is-warning" size="64"></clr-icon>
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
line-height: 24px;
|
||||
color: #000000;
|
||||
font-size: 22px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.confirmation-content {
|
||||
|
||||
@ -48,7 +48,7 @@
|
||||
</clr-tooltip-content>
|
||||
</clr-tooltip>
|
||||
</div>
|
||||
<div class="form-group" style="height:30px;">
|
||||
<div class="form-group" class="form-height">
|
||||
<label for="spin" class="col-md-4"></label>
|
||||
<span class="col-md-8 spinner spinner-inline" [hidden]="!inProgress"></span>
|
||||
</div>
|
||||
|
||||
@ -7,3 +7,7 @@
|
||||
top: 3px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.form-height {
|
||||
height: 30px;
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
<clr-modal [(clrModalOpen)]="createEditRuleOpened" [clrModalStaticBackdrop]="true" [clrModalClosable]="false">
|
||||
<h3 class="modal-title">{{headerTitle | translate}}</h3>
|
||||
<hbr-inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></hbr-inline-alert>
|
||||
<div class="modal-body" style="max-height: 85vh;">
|
||||
<div class="modal-body modal-body-height">
|
||||
<clr-alert [hidden]='!deletedLabelCount' [clrAlertType]="'alert-warning'" [clrAlertSizeSmall]="true" [clrAlertClosable]="false"
|
||||
[(clrAlertClosed)]="alertClosed">
|
||||
<div class="alert-item">
|
||||
@ -65,7 +65,7 @@
|
||||
<div class="arrowSet" [hidden]="!(filterListData[i]?.name=='label')" (click)="openLabelList(selectedValue.value, i, $event)">
|
||||
<clr-icon shape="angle"></clr-icon>
|
||||
</div>
|
||||
<clr-icon shape="warning-standard" class="is-solid is-warning" size="14" style="margin-left: -15px;" [hidden]="!deletedLabelCount || !(filterListData[i]?.name=='label')"></clr-icon>
|
||||
<clr-icon shape="warning-standard" class="is-solid is-warning warning-icon" size="14" [hidden]="!deletedLabelCount || !(filterListData[i]?.name=='label')"></clr-icon>
|
||||
<clr-icon shape="times-circle" class="is-solid" (click)="deleteFilter(i)"></clr-icon>
|
||||
<div *ngIf="!withAdmiral">
|
||||
<hbr-filter-label [projectId]="projectId" [selectedLabelInfo]="filterLabelInfo"
|
||||
@ -75,7 +75,7 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<clr-icon shape="plus-circle" class="is-solid" [hidden]="isFilterHide" (click)="addNewFilter()" style="margin-top: 11px;"></clr-icon>
|
||||
<clr-icon shape="plus-circle" class="is-solid plus-position" [hidden]="isFilterHide" (click)="addNewFilter()"></clr-icon>
|
||||
|
||||
</div>
|
||||
<!--Targets-->
|
||||
@ -114,7 +114,7 @@
|
||||
</div>
|
||||
<!--weekly-->
|
||||
<span [hidden]="!weeklySchedule || !isScheduleOpt">on </span>
|
||||
<div [hidden]="!weeklySchedule || !isScheduleOpt" class="select floatSet" style="width:104px">
|
||||
<div [hidden]="!weeklySchedule || !isScheduleOpt" class="select floatSet weekday-width">
|
||||
<select name="scheduleDay" formControlName="weekday">
|
||||
<option value="1">{{'WEEKLY.MONDAY' | translate}}</option>
|
||||
<option value="2">{{'WEEKLY.TUESDAY' | translate}}</option>
|
||||
@ -130,18 +130,18 @@
|
||||
<input [hidden]="!isScheduleOpt" type="time" formControlName="offtime" required value="08:00" />
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 100%;" [hidden]="!isImmediate">
|
||||
<div class="rule-width" [hidden]="!isImmediate">
|
||||
<clr-checkbox [clrChecked]="false" id="ruleDeletion" formControlName="replicate_deletion">
|
||||
{{'REPLICATION.DELETE_REMOTE_IMAGES' | translate}}
|
||||
</clr-checkbox>
|
||||
</div>
|
||||
<div style="width: 100%;">
|
||||
<div class="rule-width">
|
||||
<clr-checkbox [clrChecked]="true" id="ruleExit" formControlName="replicate_existing_image_now">
|
||||
{{'REPLICATION.REPLICATE_IMMEDIATE' | translate}}
|
||||
</clr-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:block;text-align:center">
|
||||
<div class="loading-center">
|
||||
<span class="spinner spinner-inline" [hidden]="inProgress === false"></span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -191,3 +191,27 @@ clr-modal {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
.modal-body-height {
|
||||
max-height: 85vh;
|
||||
}
|
||||
|
||||
.filterSelect .warning-icon {
|
||||
margin-left: -15px;
|
||||
}
|
||||
|
||||
.plus-position {
|
||||
margin-top: 11px;
|
||||
}
|
||||
|
||||
.weekday-width {
|
||||
width: 104px;
|
||||
}
|
||||
|
||||
.rule-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.loading-center {
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
@ -2,9 +2,9 @@
|
||||
<a class="filterClose" (click)="closeFilter()">×</a>
|
||||
<label class="filterLabelHeader">{{'REPOSITORY.FILTER_BY_LABEL' | translate}}</label>
|
||||
<div><input class="filterInput" type="text" placeholder="Filter labels" [(ngModel)]= "filterLabelName" (keyup)="handleInputFilter()"></div>
|
||||
<div [hidden]='labelLists.length' style="padding-left:10px;">{{'LABEL.NO_LABELS' | translate }}</div>
|
||||
<div [hidden]='labelLists.length' class="no-labels">{{'LABEL.NO_LABELS' | translate }}</div>
|
||||
|
||||
<div [hidden]='!labelLists.length' style='max-height:300px;overflow-y: auto;'>
|
||||
<div [hidden]='!labelLists.length' class="label-list">
|
||||
<button type="button" class="labelBtn" *ngFor='let label of labelLists' [hidden]='!label.show' (click)="selectLabel(label)">
|
||||
<clr-icon shape="check" class='pull-left' [hidden]='!label.iconsShow'></clr-icon>
|
||||
<div class='labelDiv'><hbr-label-piece [label]="label.label" [labelWidth]="118"></hbr-label-piece></div>
|
||||
|
||||
@ -12,11 +12,14 @@
|
||||
max-width: 15rem;
|
||||
border-radius: .125rem;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.filterLabelPanel .filterInput{margin-left: .5rem; margin-right: .5rem;}
|
||||
|
||||
.filterLabelHeader {
|
||||
.filterClose {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 20px;
|
||||
}
|
||||
.filterLabelHeader {
|
||||
font-size: .5rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: normal;
|
||||
@ -24,22 +27,24 @@
|
||||
line-height: .75rem;
|
||||
margin: 0;
|
||||
color: #313131;
|
||||
}
|
||||
.no-labels {
|
||||
padding-left: 10px;
|
||||
}
|
||||
.label-list {
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.filterLabelPanel .filterInput{margin-left: .5rem; margin-right: .5rem;}
|
||||
|
||||
.filterLabelPanel .form-group input {
|
||||
position: relative;
|
||||
margin-left: .5rem;
|
||||
margin-right: .5rem;
|
||||
}
|
||||
|
||||
.filterClose {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.pull-left {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<div>
|
||||
<div class="row" style="position:relative;">
|
||||
<div class="row" class="endpoint-view">
|
||||
<div>
|
||||
<div class="row flex-items-xs-between rightPos">
|
||||
<div class="flex-items-xs-middle option-right">
|
||||
|
||||
@ -22,3 +22,7 @@
|
||||
margin-top: 4px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.endpoint-view {
|
||||
position: relative;
|
||||
}
|
||||
@ -1,6 +1,6 @@
|
||||
<span>
|
||||
<clr-icon shape="search" size="20" class="search-btn" [class.filter-icon]="isShowSearchBox" (click)="onClick()"></clr-icon>
|
||||
<input [hidden]="!isShowSearchBox" type="text" style="padding-left: 15px;" (keyup)="valueChange()" (focus)="inputFocus()"
|
||||
<input [hidden]="!isShowSearchBox" type="text" class="filter-input" (keyup)="valueChange()" (focus)="inputFocus()"
|
||||
placeholder="{{placeHolder}}" [(ngModel)]="currentValue" />
|
||||
<span class="filter-divider" *ngIf="withDivider"></span>
|
||||
</span>
|
||||
@ -23,3 +23,7 @@
|
||||
.search-btn:hover {
|
||||
color: #007CBB;
|
||||
}
|
||||
|
||||
.filter-input {
|
||||
padding-left: 15px;
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
<div>
|
||||
<div class="row" style="position:relative;">
|
||||
<div class="row" class="label-config">
|
||||
<div>
|
||||
<div class="row flex-items-xs-between rightPos">
|
||||
<div class="flex-items-xs-middle option-right">
|
||||
|
||||
@ -1,27 +1,25 @@
|
||||
.option-left {
|
||||
padding-left: 16px;
|
||||
margin-top: -6px;
|
||||
}
|
||||
|
||||
.option-right {
|
||||
padding-right: 16px;
|
||||
}
|
||||
|
||||
.refresh-btn {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.refresh-btn:hover {
|
||||
color: #007CBB;
|
||||
}
|
||||
|
||||
.rightPos {
|
||||
.label-config {
|
||||
position: relative;
|
||||
div.content-mt {
|
||||
margin-top: -12px;
|
||||
}
|
||||
.rightPos {
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
right: 35px;
|
||||
margin-top: 4px;
|
||||
height: 24px;
|
||||
.option-right {
|
||||
padding-right: 16px;
|
||||
.refresh-btn {
|
||||
cursor: pointer;
|
||||
:hover {
|
||||
color: #007CBB;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content-mt {
|
||||
margin-top: -12px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<div style="padding-bottom: 15px;">
|
||||
<div class="list-rule">
|
||||
<clr-datagrid [clrDgLoading]="loading" [(clrDgSingleSelected)]="selectedRow" [clDgRowSelection]="true">
|
||||
<clr-dg-action-bar>
|
||||
<button type="button" class="btn btn-sm btn-secondary" *ngIf="isSystemAdmin" (click)="openModal()"><clr-icon shape="plus" size="16"></clr-icon> {{'REPLICATION.NEW_REPLICATION_RULE' | translate}}</button>
|
||||
@ -18,12 +18,12 @@
|
||||
<clr-dg-cell>
|
||||
<div [ngSwitch]="hasDeletedLabel(p)">
|
||||
<clr-tooltip *ngSwitchCase="'disabled'" class="tooltip-lg">
|
||||
<clr-icon clrTooltipTrigger shape="exclamation-triangle" style="vertical-align: text-bottom;" class="is-warning" size="22"></clr-icon>Disabled
|
||||
<clr-icon clrTooltipTrigger shape="exclamation-triangle" class="is-warning text-alignment" size="22"></clr-icon>Disabled
|
||||
<clr-tooltip-content clrPosition="top-right" clrSize="xs" *clrIfOpen>
|
||||
<span>{{'REPLICATION.RULE_DISABLED' | translate}}</span>
|
||||
</clr-tooltip-content>
|
||||
</clr-tooltip>
|
||||
<div *ngSwitchCase="'enabled'" ><clr-icon shape="success-standard" style="vertical-align: text-bottom;" class="is-success" size="18"></clr-icon> Enabled</div>
|
||||
<div *ngSwitchCase="'enabled'" ><clr-icon shape="success-standard" class="is-success text-alignment" size="18"></clr-icon> Enabled</div>
|
||||
</div>
|
||||
</clr-dg-cell>
|
||||
<clr-dg-cell *ngIf="!projectScope">
|
||||
|
||||
@ -0,0 +1,7 @@
|
||||
.list-rule {
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.text-alignment {
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
@ -41,3 +41,27 @@
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.event-text {
|
||||
margin-left: 34px;
|
||||
}
|
||||
|
||||
.color-red {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.color-green {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.color-orange {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
.tab-top {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.hidden-info {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -2,8 +2,8 @@
|
||||
<a class="toolBar" (click)="slideOut()">{{'OPERATION.EVENT_LOG' | translate}}<!--<clr-icon shape="angle-double" style="transform: rotate(90deg)"></clr-icon>--></a>
|
||||
<div class="side-form">
|
||||
<clr-icon shape="refresh" class="freshIcon" (click)="TabEvent()"></clr-icon>
|
||||
<h3 class="custom-h2" style="margin-left: 34px;">{{'OPERATION.LOCAL_EVENT' | translate}}</h3>
|
||||
<div style="margin-top: 10px;">
|
||||
<h3 class="custom-h2 event-text">{{'OPERATION.LOCAL_EVENT' | translate}}</h3>
|
||||
<div class="tab-top">
|
||||
<clr-tabs>
|
||||
<clr-tab>
|
||||
<button clrTabLink id="link1" (click)="TabEvent()">{{'OPERATION.ALL' | translate}}</button>
|
||||
@ -11,14 +11,14 @@
|
||||
<div class="eventInfo" *ngFor="let list of resultLists">
|
||||
<div class="iconsArea">
|
||||
<i class="spinner spinner-inline spinner-pos" [hidden]="list.state != 'progressing'"></i>
|
||||
<clr-icon [hidden]="list.state != 'success'" size="18" shape="success-standard" style="color: green"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'failure'" size="18" shape="error-standard" style="color: red"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'interrupt'" size="18" shape="unlink" style="color: orange"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'success'" size="18" shape="success-standard" class="color-green"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'failure'" size="18" shape="error-standard" class="color-red"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'interrupt'" size="18" shape="unlink" class="color-orange"></clr-icon>
|
||||
</div>
|
||||
<div class="infoArea">
|
||||
<label class="eventName" (click)="toggleTitle(spanErrorInfo)">{{list.name | translate}}</label>
|
||||
<span class="eventTarget">{{list.data.name}}</span><span class="eventTime">{{list.timeDiff | translate}}</span>
|
||||
<span #spanErrorInfo class="eventErrorInf" style="display: none;">{{list.data.errorInf}}</span>
|
||||
<span #spanErrorInfo class="eventErrorInf hidden-info">{{list.data.errorInf}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</clr-tab-content>
|
||||
@ -29,13 +29,13 @@
|
||||
<div class="eventInfo" *ngFor="let list of runningLists">
|
||||
<div class="iconsArea">
|
||||
<i class="spinner spinner-inline spinner-pos" [hidden]="list.state != 'progressing'"></i>
|
||||
<clr-icon [hidden]="list.state != 'success'" size="18" shape="success-standard" style="color: green"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'failure'" size="18" shape="error-standard" style="color: red"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'success'" size="18" shape="success-standard" class="color-green"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'failure'" size="18" shape="error-standard" class="color-red"></clr-icon>
|
||||
</div>
|
||||
<div class="infoArea">
|
||||
<label class="eventName" (click)="toggleTitle(spanErrorInfo)">{{list.name | translate}}</label>
|
||||
<span class="eventTarget">{{list.data.name}}</span><span class="eventTime">{{list.timeDiff | translate}}</span>
|
||||
<span #spanErrorInfo class="eventErrorInf" style="display: none;">{{list.data.errorInf}}</span>
|
||||
<span #spanErrorInfo class="eventErrorInf hidden-info">{{list.data.errorInf}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</clr-tab-content>
|
||||
@ -46,13 +46,13 @@
|
||||
<div class="eventInfo" *ngFor="let list of failLists">
|
||||
<div class="iconsArea">
|
||||
<i class="spinner spinner-inline spinner-pos" [hidden]="list.state != 'progressing'"></i>
|
||||
<clr-icon [hidden]="list.state != 'success'" size="18" shape="success-standard" style="color: green"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'failure'" size="18" shape="error-standard" style="color: red"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'success'" size="18" shape="success-standard" class="color-green"></clr-icon>
|
||||
<clr-icon [hidden]="list.state != 'failure'" size="18" shape="error-standard" class="color-red"></clr-icon>
|
||||
</div>
|
||||
<div class="infoArea">
|
||||
<label class="eventName" (click)="toggleTitle(spanErrorInfo)">{{list.name | translate}}</label>
|
||||
<span class="eventTarget">{{list.data.name}}</span><span class="eventTime">{{list.timeDiff | translate}}</span>
|
||||
<span #spanErrorInfo class="eventErrorInf" style="display: none;">{{list.data.errorInf}}</span>
|
||||
<span #spanErrorInfo class="eventErrorInf hidden-info">{{list.data.errorInf}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</clr-tab-content>
|
||||
|
||||
@ -89,7 +89,7 @@ export class OperationComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
toggleTitle(errorSpan: any) {
|
||||
errorSpan.style.display = (errorSpan.style.display === 'none') ? 'block' : 'none';
|
||||
errorSpan.style.display = (errorSpan.style.display === 'block') ? 'none' : 'block';
|
||||
}
|
||||
|
||||
slideOut(): void {
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
<input type="text" class="command-input" size="{{inputSize}}" [(ngModel)]="defaultValue" #inputTarget readonly/>
|
||||
</span>
|
||||
<span>
|
||||
<input type="text" size="{{inputSize}}" [(ngModel)]="defaultValue" #inputTarget1 style="width: 1px; min-width: 0px; padding: 0; opacity: .1;">
|
||||
<input type="text" size="{{inputSize}}" [(ngModel)]="defaultValue" #inputTarget1 class="inputTarget">
|
||||
</span>
|
||||
<span>
|
||||
<clr-icon shape="copy" [class.is-success]="isCopied" [class.is-error]="hasCopyError" class="info-tips-icon" size="24" [ngxClipboard]="inputTarget1" (cbOnSuccess)="onSuccess($event)" (cbOnError)="onError($event)"></clr-icon>
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
{{ 'PUSH_IMAGE.TITLE' | translate | uppercase}}
|
||||
<clr-icon shape="caret down"></clr-icon>
|
||||
</button>
|
||||
<clr-dropdown-menu *clrIfOpen [clrPosition]="'bottom-right'" style="min-width:500px;">
|
||||
<clr-dropdown-menu *clrIfOpen [clrPosition]="'bottom-right'" class="dropdown-width">
|
||||
<div class="commands-container">
|
||||
<section>
|
||||
<span><h5 class="h5-override">{{ 'PUSH_IMAGE.TITLE' | translate }}</h5></span>
|
||||
|
||||
@ -45,3 +45,14 @@
|
||||
.hide{
|
||||
display:none;
|
||||
}
|
||||
|
||||
.inputTarget {
|
||||
width: 1px;
|
||||
min-width: 0;
|
||||
padding: 0;
|
||||
opacity: .1;
|
||||
}
|
||||
|
||||
.dropdown-width {
|
||||
min-width: 500px;
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
<div class="row" style="position:relative;">
|
||||
<div class="row" class="replication-row">
|
||||
<div>
|
||||
<div class="row flex-items-xs-between rightPos">
|
||||
<div class="flex-xs-middle option-right">
|
||||
@ -15,10 +15,10 @@
|
||||
(selectOne)="selectOneRule($event)" (hideJobs)="hideJobs()" (openNewRule)="openModal()" (editOne)="openEditRule($event)"
|
||||
(reload)="reloadRules($event)" [loading]="loading" [withReplicationJob]="withReplicationJob" (redirect)="customRedirect($event)"></hbr-list-replication-rule>
|
||||
</div>
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="padding-left:0px;" [hidden]='hiddenJobList'>
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 jobList" [hidden]='hiddenJobList'>
|
||||
<div *ngIf="withReplicationJob" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="row flex-items-xs-between" style="height:60px;">
|
||||
<h5 class="flex-items-xs-bottom option-left-down" style="margin-left: 14px;">{{'REPLICATION.REPLICATION_JOBS' | translate}}</h5>
|
||||
<div class="row flex-items-xs-between jobsRow">
|
||||
<h5 class="flex-items-xs-bottom option-left-down">{{'REPLICATION.REPLICATION_JOBS' | translate}}</h5>
|
||||
<div class="flex-items-xs-bottom option-right-down">
|
||||
<button class="btn btn-link" (click)="toggleSearchJobOptionalName(currentJobSearchOption)">{{toggleJobSearchOption[currentJobSearchOption] | translate}}</button>
|
||||
<hbr-filter [withDivider]="true" filterPlaceholder='{{"REPLICATION.FILTER_JOBS_PLACEHOLDER" | translate}}' (filterEvt)="doSearchJobs($event)"
|
||||
|
||||
@ -13,14 +13,6 @@
|
||||
padding-right: 16px;
|
||||
}
|
||||
|
||||
.option-left-down {
|
||||
margin-top: 36px;
|
||||
}
|
||||
|
||||
.option-right-down {
|
||||
padding-right: 16px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.rightPos{
|
||||
position: absolute;
|
||||
right: 35px;
|
||||
@ -38,3 +30,22 @@
|
||||
.row-right {
|
||||
padding-right: 50px;
|
||||
}
|
||||
|
||||
.replication-row {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.jobList {
|
||||
padding-left: 0;
|
||||
.jobsRow {
|
||||
height: 60px;
|
||||
.option-left-down {
|
||||
margin-top: 36px;
|
||||
margin-left: 14px;
|
||||
}
|
||||
.option-right-down {
|
||||
padding-right: 16px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
<div>
|
||||
<div class="row" style="position:relative;">
|
||||
<div class="row position-relative">
|
||||
<div class="toolbar">
|
||||
<div class="row flex-items-xs-right option-right rightPos">
|
||||
<div class="flex-xs-middle">
|
||||
@ -7,7 +7,7 @@
|
||||
<clr-icon shape="download"></clr-icon>
|
||||
{{'CONFIG.REGISTRY_CERTIFICATE' | translate | uppercase}}
|
||||
</a>
|
||||
<hbr-push-image-button style="display: inline-block;" [registryUrl]="registryUrl" [projectName]="projectName"></hbr-push-image-button>
|
||||
<hbr-push-image-button class="push-image-button" [registryUrl]="registryUrl" [projectName]="projectName"></hbr-push-image-button>
|
||||
<hbr-filter [withDivider]="true" filterPlaceholder="{{'REPOSITORY.FILTER_FOR_REPOSITORIES' | translate}}" (filterEvt)="doSearchRepoNames($event)" [currentValue]="lastFilteredRepoName"></hbr-filter>
|
||||
<span class="card-btn" (click)="showCard(true)" (mouseenter) ="mouseEnter('card') " (mouseleave) ="mouseLeave('card')">
|
||||
<clr-icon [ngClass]="{'is-highlight': isCardView || isHovering('card') }" shape="view-cards"></clr-icon>
|
||||
@ -51,7 +51,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hbr-gridview *ngIf="isCardView" #gridView style="position:relative;"
|
||||
<hbr-gridview *ngIf="isCardView" #gridView class="position-relative"
|
||||
[items]="repositories"
|
||||
[loading]="loading"
|
||||
[pageSize]="pageSize"
|
||||
|
||||
@ -79,3 +79,11 @@
|
||||
width: 24px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.position-relative {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.push-image-button {
|
||||
display: inline-block;
|
||||
}
|
||||
@ -71,7 +71,7 @@
|
||||
<div *ngIf="!withAdmiral && tagDetails?.labels?.length">
|
||||
<div class="third-column detail-title">{{'TAG.LABELS' | translate }}</div>
|
||||
<div class="fourth-column">
|
||||
<div *ngFor="let label of tagDetails.labels" style="margin-bottom: 2px;">
|
||||
<div *ngFor="let label of tagDetails.labels" class="detail-tag">
|
||||
<hbr-label-piece [label]="label"></hbr-label-piece>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -118,6 +118,10 @@ $size24:24px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.detail-tag {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.image-detail-label {
|
||||
margin-right: 10px;
|
||||
text-align: left;
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
<button type="button" [disabled]="imageNameInput.projectName.invalid||imageNameInput.repoName.invalid||imageNameInput.tagName.invalid||imageNameInput.noProjectInfo!=''" class="btn btn-primary" (click)="onRetag()">{{'BUTTON.CONFIRM' | translate}}</button>
|
||||
</div>
|
||||
</clr-modal>
|
||||
<div class="row" style="position:relative;">
|
||||
<div class="row tag-row">
|
||||
<div>
|
||||
<div class="row flex-items-xs-right rightPos">
|
||||
<div id="filterArea">
|
||||
@ -36,8 +36,8 @@
|
||||
<a class="filterClose" (click)="closeFilter()">×</a>
|
||||
<label class="filterLabelHeader">{{'REPOSITORY.FILTER_BY_LABEL' | translate}}</label>
|
||||
<div class="form-group"><input type="text" placeholder="Filter labels" [(ngModel)]="filterName" (keyup)="handleInputFilter()"></div>
|
||||
<div [hidden]='imageFilterLabels.length' style="padding-left:10px;">{{'LABEL.NO_LABELS' | translate }}</div>
|
||||
<div [hidden]='!imageFilterLabels.length' style='max-height:300px;overflow-y: auto;'>
|
||||
<div [hidden]='imageFilterLabels.length' class="no-labels">{{'LABEL.NO_LABELS' | translate }}</div>
|
||||
<div [hidden]='!imageFilterLabels.length' class="has-label">
|
||||
<button type="button" class="labelBtn" *ngFor='let label of imageFilterLabels' [hidden]="!label.show"
|
||||
(click)="rightFilterLabel(label)">
|
||||
<clr-icon shape="check" class='pull-left' [hidden]='!label.iconsShow'></clr-icon>
|
||||
@ -62,11 +62,11 @@
|
||||
<clr-dropdown *ngIf="!withAdmiral">
|
||||
<button type="button" class="btn btn-sm btn-secondary" clrDropdownTrigger [disabled]="!(selectedRow.length==1 && developerRoleOrAbove)" (click)="addLabels(selectedRow)" ><clr-icon shape="plus" size="16"></clr-icon>{{'REPOSITORY.ADD_LABELS' | translate}}</button>
|
||||
<clr-dropdown-menu clrPosition="bottom-left" *clrIfOpen>
|
||||
<div style='display:grid'>
|
||||
<div class="filter-grid">
|
||||
<label class="dropdown-header">{{'REPOSITORY.ADD_LABEL_TO_IMAGE' | translate}}</label>
|
||||
<div class="form-group"><input type="text" placeholder="Filter labels" [(ngModel)]="stickName" (keyup)="handleStickInputFilter()"></div>
|
||||
<div [hidden]='imageStickLabels.length' style="padding-left:10px;">{{'LABEL.NO_LABELS' | translate }}</div>
|
||||
<div [hidden]='!imageStickLabels.length' style='max-height:300px;overflow-y: auto;'>
|
||||
<div [hidden]='imageStickLabels.length' class="no-labels">{{'LABEL.NO_LABELS' | translate }}</div>
|
||||
<div [hidden]='!imageStickLabels.length' class="has-label">
|
||||
<button type="button" class="dropdown-item" *ngFor='let label of imageStickLabels' [hidden]='!label.show' (click)="stickLabel(label)">
|
||||
<clr-icon shape="check" class='pull-left' [hidden]='!label.iconsShow'></clr-icon>
|
||||
<div class='labelDiv'><hbr-label-piece [label]="label.label" [labelWidth]="130"></hbr-label-piece></div>
|
||||
@ -78,40 +78,40 @@
|
||||
<button type="button" class="btn btn-sm btn-secondary" [disabled]="!(selectedRow.length===1 && developerRoleOrAbove)" (click)="retag(selectedRow)"><clr-icon shape="copy" size="16"></clr-icon> {{'REPOSITORY.RETAG' | translate}}</button>
|
||||
<button type="button" class="btn btn-sm btn-secondary" *ngIf="hasProjectAdminRole" (click)="deleteTags(selectedRow)" [disabled]="!selectedRow.length"><clr-icon shape="times" size="16"></clr-icon> {{'REPOSITORY.DELETE' | translate}}</button>
|
||||
</clr-dg-action-bar>
|
||||
<clr-dg-column style="width: 120px;" [clrDgField]="'name'">{{'REPOSITORY.TAG' | translate}}</clr-dg-column>
|
||||
<clr-dg-column style="width: 90px;" [clrDgField]="'size'">{{'REPOSITORY.SIZE' | translate}}</clr-dg-column>
|
||||
<clr-dg-column style="min-width: 100px; max-width:220px;">{{'REPOSITORY.PULL_COMMAND' | translate}}</clr-dg-column>
|
||||
<clr-dg-column style="width: 140px;" *ngIf="withClair">{{'REPOSITORY.VULNERABILITY' | translate}}</clr-dg-column>
|
||||
<clr-dg-column style="width: 80px;" *ngIf="withNotary">{{'REPOSITORY.SIGNED' | translate}}</clr-dg-column>
|
||||
<clr-dg-column style="min-width: 130px;">{{'REPOSITORY.AUTHOR' | translate}}</clr-dg-column>
|
||||
<clr-dg-column style="width: 160px;"[clrDgSortBy]="createdComparator">{{'REPOSITORY.CREATED' | translate}}</clr-dg-column>
|
||||
<clr-dg-column style="width: 80px;" [clrDgField]="'docker_version'" *ngIf="!withClair">{{'REPOSITORY.DOCKER_VERSION' | translate}}</clr-dg-column>
|
||||
<clr-dg-column *ngIf="!withAdmiral" style="width: 140px;">{{'REPOSITORY.LABELS' | translate}}</clr-dg-column>
|
||||
<clr-dg-column class="width-130" [clrDgField]="'name'">{{'REPOSITORY.TAG' | translate}}</clr-dg-column>
|
||||
<clr-dg-column class="width-100" [clrDgField]="'size'">{{'REPOSITORY.SIZE' | translate}}</clr-dg-column>
|
||||
<clr-dg-column class="flex-width">{{'REPOSITORY.PULL_COMMAND' | translate}}</clr-dg-column>
|
||||
<clr-dg-column class="width-130" *ngIf="withClair">{{'REPOSITORY.VULNERABILITY' | translate}}</clr-dg-column>
|
||||
<clr-dg-column class="width-100" *ngIf="withNotary">{{'REPOSITORY.SIGNED' | translate}}</clr-dg-column>
|
||||
<clr-dg-column class="flex-min-width">{{'REPOSITORY.AUTHOR' | translate}}</clr-dg-column>
|
||||
<clr-dg-column class="width-160" [clrDgSortBy]="createdComparator">{{'REPOSITORY.CREATED' | translate}}</clr-dg-column>
|
||||
<clr-dg-column class="width-100" [clrDgField]="'docker_version'" *ngIf="!withClair">{{'REPOSITORY.DOCKER_VERSION' | translate}}</clr-dg-column>
|
||||
<clr-dg-column *ngIf="!withAdmiral" class="width-160">{{'REPOSITORY.LABELS' | translate}}</clr-dg-column>
|
||||
<clr-dg-placeholder>{{'TAG.PLACEHOLDER' | translate }}</clr-dg-placeholder>
|
||||
<clr-dg-row *clrDgItems="let t of tags" [clrDgItem]='t'>
|
||||
<clr-dg-cell class="truncated" style="width: 120px;">
|
||||
<clr-dg-cell class="truncated" class="width-130">
|
||||
<a *ngIf="withClair" href="javascript:void(0)" (click)="onTagClick(t)" title="{{t.name}}">{{t.name}}</a>
|
||||
<span *ngIf="!withClair">{{t.name}}</span>
|
||||
</clr-dg-cell>
|
||||
<clr-dg-cell style="width: 90px;">{{sizeTransform(t.size)}}</clr-dg-cell>
|
||||
<clr-dg-cell style="min-width: 100px; max-width:220px;" class="truncated" title="docker pull {{registryUrl}}/{{repoName}}:{{t.name}}">
|
||||
<clr-dg-cell class="width-100">{{sizeTransform(t.size)}}</clr-dg-cell>
|
||||
<clr-dg-cell class="truncated flex-width" title="docker pull {{registryUrl}}/{{repoName}}:{{t.name}}">
|
||||
<hbr-copy-input #copyInput (onCopyError)="onCpError($event)" iconMode="true" defaultValue="docker pull {{registryUrl}}/{{repoName}}:{{t.name}}"></hbr-copy-input>
|
||||
</clr-dg-cell>
|
||||
<clr-dg-cell style="width: 140px;" *ngIf="withClair">
|
||||
<clr-dg-cell class="width-130" *ngIf="withClair">
|
||||
<hbr-vulnerability-bar [repoName]="repoName" [tagId]="t.name" [summary]="t.scan_overview"></hbr-vulnerability-bar>
|
||||
</clr-dg-cell>
|
||||
<clr-dg-cell style="width: 80px;" *ngIf="withNotary" [ngSwitch]="t.signature !== null">
|
||||
<clr-icon shape="check-circle" *ngSwitchCase="true" size="20" style="color: #1D5100;"></clr-icon>
|
||||
<clr-icon shape="times-circle" *ngSwitchCase="false" size="16" style="color: #C92100;"></clr-icon>
|
||||
<clr-dg-cell class="width-100" *ngIf="withNotary" [ngSwitch]="t.signature !== null">
|
||||
<clr-icon shape="check-circle" *ngSwitchCase="true" size="20" class="color-green"></clr-icon>
|
||||
<clr-icon shape="times-circle" *ngSwitchCase="false" size="16" class="color-red"></clr-icon>
|
||||
<a href="javascript:void(0)" *ngSwitchDefault role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right">
|
||||
<clr-icon shape="help" style="color: #565656;" size="16"></clr-icon>
|
||||
<clr-icon shape="help" class="color-gray" size="16"></clr-icon>
|
||||
<span class="tooltip-content">{{'REPOSITORY.NOTARY_IS_UNDETERMINED' | translate}}</span>
|
||||
</a>
|
||||
</clr-dg-cell>
|
||||
<clr-dg-cell class="truncated" style="min-width: 130px;" title="{{t.author}}">{{t.author}}</clr-dg-cell>
|
||||
<clr-dg-cell style="width: 160px;">{{t.created | date: 'short'}}</clr-dg-cell>
|
||||
<clr-dg-cell style="width: 80px;" *ngIf="!withClair">{{t.docker_version}}</clr-dg-cell>
|
||||
<clr-dg-cell *ngIf="!withAdmiral" style="width: 140px;">
|
||||
<clr-dg-cell class="truncated flex-min-width" title="{{t.author}}">{{t.author}}</clr-dg-cell>
|
||||
<clr-dg-cell class="width-160">{{t.created | date: 'short'}}</clr-dg-cell>
|
||||
<clr-dg-cell class="width-100" *ngIf="!withClair">{{t.docker_version}}</clr-dg-cell>
|
||||
<clr-dg-cell *ngIf="!withAdmiral" class="width-160">
|
||||
<hbr-label-piece *ngIf="t.labels?.length" [label]="t.labels[0]" [labelWidth]="90"> </hbr-label-piece>
|
||||
<div class="signpost-item" [hidden]="t.labels?.length<=1">
|
||||
<div class="trigger-item">
|
||||
|
||||
@ -149,6 +149,24 @@
|
||||
min-width: 5rem;
|
||||
max-width: 15rem;
|
||||
border-radius: .125rem;
|
||||
.form-group input {
|
||||
position: relative;
|
||||
margin-left: .5rem;
|
||||
margin-right: .5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.no-labels {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.has-label {
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.filter-grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.labelBtn {
|
||||
@ -186,12 +204,6 @@
|
||||
color: #313131;
|
||||
}
|
||||
|
||||
.labelFilterPanel .form-group input {
|
||||
position: relative;
|
||||
margin-left: .5rem;
|
||||
margin-right: .5rem;
|
||||
}
|
||||
|
||||
.filterClose {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
@ -209,3 +221,40 @@
|
||||
hbr-image-name-input {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tag-row {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.width-100 {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.width-130 {
|
||||
width: 130px;
|
||||
}
|
||||
|
||||
.width-160 {
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.flex-width {
|
||||
min-width: 100px;
|
||||
max-width: 220px;
|
||||
}
|
||||
|
||||
.flex-min-width {
|
||||
min-width: 130px;
|
||||
}
|
||||
|
||||
.color-green {
|
||||
color: #1D5100;
|
||||
}
|
||||
|
||||
.color-red {
|
||||
color: #C92100;
|
||||
}
|
||||
|
||||
.color-gray {
|
||||
color: #565656;
|
||||
}
|
||||
@ -13,13 +13,13 @@
|
||||
</div>
|
||||
<div *ngIf="scanning" class="bar-state bar-state-chart">
|
||||
<div>{{'VULNERABILITY.STATE.SCANNING' | translate}}</div>
|
||||
<div class="progress loop" style="height:2px;"><progress></progress></div>
|
||||
<div class="progress loop loop-height"><progress></progress></div>
|
||||
</div>
|
||||
<div *ngIf="completed" class="bar-state bar-state-chart">
|
||||
<hbr-vulnerability-summary-chart [summary]="summary"></hbr-vulnerability-summary-chart>
|
||||
</div>
|
||||
<div *ngIf="unknown" class="bar-state">
|
||||
<clr-icon shape="warning" class="is-warning" size="24"></clr-icon>
|
||||
<span style="margin-left:-5px;">{{'VULNERABILITY.STATE.UNKNOWN' | translate}}</span>
|
||||
<span class="unknow-text">{{'VULNERABILITY.STATE.UNKNOWN' | translate}}</span>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,4 +1,4 @@
|
||||
<div class="row" style="position:relative;">
|
||||
<div class="row result-row">
|
||||
<div>
|
||||
<div class="row flex-items-xs-right rightPos">
|
||||
<div class="flex-xs-middle option-right">
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
<span>{{'VULNERABILITY.OVERALL_SEVERITY' | translate }} <span class="font-weight-600">{{'VULNERABILITY.SEVERITY.LOW' | translate | titlecase }}</span></span>
|
||||
</ng-template>
|
||||
<ng-template [ngSwitchCase]="2">
|
||||
<clr-icon shape="help" size="24" style="margin-left: 3px;"></clr-icon>
|
||||
<clr-icon shape="help" size="24" class="help-icon"></clr-icon>
|
||||
<span>{{'VULNERABILITY.OVERALL_SEVERITY' | translate }} <span class="font-weight-600">{{'VULNERABILITY.SEVERITY.UNKNOWN' | translate | titlecase }}</span></span>
|
||||
</ng-template>
|
||||
<ng-template [ngSwitchCase]="1">
|
||||
|
||||
@ -4,10 +4,16 @@
|
||||
}
|
||||
.bar-state {
|
||||
text-align: center !important;
|
||||
.unknow-text {
|
||||
margin-left: -5px;
|
||||
}
|
||||
}
|
||||
|
||||
.bar-state-chart {
|
||||
margin-top: 2px;
|
||||
.loop-height {
|
||||
height: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.bar-state-error {
|
||||
@ -131,3 +137,11 @@ hr{
|
||||
right: 35px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.result-row {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.help-icon {
|
||||
margin-left: 3px;
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
<clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="staticBackdrop" [clrModalClosable]="false">
|
||||
<h3 class="modal-title">{{'PROFILE.TITLE' | translate}}</h3>
|
||||
<inline-alert class="modal-title" (confirmEvt)="confirmYes($event)" (closeEvt)="confirmNo($event)"></inline-alert>
|
||||
<div class="modal-body" style="overflow-y: hidden;">
|
||||
<div class="modal-body body-format">
|
||||
<form #accountSettingsFrom="ngForm" class="form">
|
||||
<section class="form-block">
|
||||
<div class="form-group form-group-override">
|
||||
@ -55,7 +55,7 @@
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<span class="spinner spinner-inline" style="top:8px;" [hidden]="showProgress === false"></span>
|
||||
<span class="spinner spinner-inline loading-top" [hidden]="showProgress === false"></span>
|
||||
<button type="button" class="btn btn-outline" (click)="close()">{{'BUTTON.CANCEL' | translate}}</button>
|
||||
<button type="button" class="btn btn-primary" [disabled]="!isValid || showProgress" (click)="submit()">{{'BUTTON.OK' | translate}}</button>
|
||||
</div>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<h3 class="modal-title">{{'RESET_PWD.TITLE' | translate}}</h3>
|
||||
<label class="modal-title reset-modal-title-override">{{'RESET_PWD.CAPTION' | translate}}</label>
|
||||
<inline-alert class="modal-title"></inline-alert>
|
||||
<div class="modal-body" style="overflow-y: hidden; min-height: 130px;">
|
||||
<div class="modal-body body-format password-body">
|
||||
<form #forgotPasswordFrom="ngForm" class="form">
|
||||
<section class="form-block">
|
||||
<div class="form-group form-group-override">
|
||||
@ -24,7 +24,7 @@
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<span class="spinner spinner-inline" style="top:8px;" [hidden]="showProgress === false"></span>
|
||||
<span class="spinner spinner-inline loading-top" [hidden]="showProgress === false"></span>
|
||||
<button type="button" class="btn" [class.btn-outline]="!isSuccess" [class.btn-primary]="isSuccess" (click)="close()">{{btnCancelCaption | translate}}</button>
|
||||
<button *ngIf="!isSuccess" type="button" class="btn btn-primary" [disabled]="!isValid || showProgress" (click)="send()">{{'BUTTON.SEND' | translate}}</button>
|
||||
</div>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="true" [clrModalClosable]="false">
|
||||
<h3 class="modal-title">{{'CHANGE_PWD.TITLE' | translate}}</h3>
|
||||
<inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></inline-alert>
|
||||
<div class="modal-body" style="overflow-y: hidden;">
|
||||
<div class="modal-body body-format">
|
||||
<form #changepwdForm="ngForm" class="form">
|
||||
<section class="form-block">
|
||||
<div class="form-group form-group-override">
|
||||
@ -54,7 +54,7 @@
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<span class="spinner spinner-inline" style="top:8px;" [hidden]="showProgress === false"></span>
|
||||
<span class="spinner spinner-inline loading-top" [hidden]="showProgress === false"></span>
|
||||
<button type="button" class="btn btn-outline" (click)="close()">{{'BUTTON.CANCEL' | translate}}</button>
|
||||
<button type="button" class="btn btn-primary" [disabled]="!isValid || showProgress" (click)="doOk()">{{'BUTTON.OK' | translate}}</button>
|
||||
</div>
|
||||
|
||||
@ -5,3 +5,7 @@
|
||||
.form-group-override {
|
||||
padding-left: 130px !important;
|
||||
}
|
||||
|
||||
.password-body {
|
||||
min-height: 130px;
|
||||
}
|
||||
@ -2,7 +2,7 @@
|
||||
<h3 class="modal-title">{{'RESET_PWD.TITLE' | translate}}</h3>
|
||||
<label class="modal-title reset-modal-title-override">{{'RESET_PWD.CAPTION2' | translate}}</label>
|
||||
<inline-alert class="modal-title"></inline-alert>
|
||||
<div class="modal-body" style="overflow-y: hidden;">
|
||||
<div class="modal-body body-format">
|
||||
<form #resetPwdForm="ngForm" class="form">
|
||||
<section class="form-block">
|
||||
<div class="form-group">
|
||||
@ -43,7 +43,7 @@
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<span class="spinner spinner-inline" style="top:8px;" [hidden]="showProgress === false"></span>
|
||||
<span class="spinner spinner-inline loading-top" [hidden]="showProgress === false"></span>
|
||||
<button type="button" class="btn" [class.btn-outline]="!resetOk" [class.btn-primary]="resetOk" (click)="close()">{{btnCancelCaption | translate}}</button>
|
||||
<button *ngIf="!resetOk" type="button" class="btn btn-primary" [disabled]="!isValid || showProgress" (click)="send()">{{'BUTTON.OK' | translate}}</button>
|
||||
</div>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<h3 class="modal-title">{{'SIGN_UP.TITLE' | translate}}</h3>
|
||||
<new-user-form isSelfRegistration="true" (valueChange)="formValueChange($event)"></new-user-form>
|
||||
<div>
|
||||
<span class="spinner spinner-inline" style="top:8px;" [hidden]="!inProgress"> </span>
|
||||
<span class="spinner spinner-inline loading-top" [hidden]="!inProgress"> </span>
|
||||
<button type="button" class="btn btn-outline" [disabled]="!canBeCancelled" (click)="cancel()">{{'BUTTON.CANCEL' | translate}}</button>
|
||||
<button type="button" class="btn btn-primary" [disabled]="!isValid || inProgress" (click)="create()">{{ 'BUTTON.SIGN_UP' | translate }}</button>
|
||||
</div>
|
||||
@ -22,7 +22,8 @@ import { MessageService } from '../../global-message/message.service';
|
||||
|
||||
@Component({
|
||||
selector: 'sign-up-page',
|
||||
templateUrl: "sign-up-page.component.html"
|
||||
templateUrl: "sign-up-page.component.html",
|
||||
styleUrls: ['../../common.scss']
|
||||
})
|
||||
export class SignUpPageComponent implements OnInit {
|
||||
error: any;
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
<clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="staticBackdrop" [clrModalClosable]="false">
|
||||
<h3 class="modal-title">{{'SIGN_UP.TITLE' | translate}}</h3>
|
||||
<inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></inline-alert>
|
||||
<div class="modal-body" style="overflow-y: hidden;">
|
||||
<div class="modal-body body-format">
|
||||
<new-user-form isSelfRegistration="true" (valueChange)="formValueChange($event)"></new-user-form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<span class="spinner spinner-inline" style="top:8px;" [hidden]="inProgress === false"> </span>
|
||||
<span class="spinner spinner-inline loading-top" [hidden]="inProgress === false"> </span>
|
||||
<button type="button" class="btn btn-outline" (click)="close()">{{'BUTTON.CANCEL' | translate}}</button>
|
||||
<button type="button" class="btn btn-primary" [disabled]="!isValid || inProgress" (click)="create()">{{ 'BUTTON.SIGN_UP' | translate }}</button>
|
||||
</div>
|
||||
|
||||
@ -23,7 +23,8 @@ import { InlineAlertComponent } from '../../shared/inline-alert/inline-alert.com
|
||||
|
||||
@Component({
|
||||
selector: 'sign-up',
|
||||
templateUrl: "sign-up.component.html"
|
||||
templateUrl: "sign-up.component.html",
|
||||
styleUrls: ['../../common.scss']
|
||||
})
|
||||
export class SignUpComponent {
|
||||
opened: boolean = false;
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<div class="search-overlay" *ngIf="state">
|
||||
<div id="placeholder1" style="height: 24px;"></div>
|
||||
<div id="placeholder1"></div>
|
||||
<div class="search-header">
|
||||
<a href="javascript:void(0)" (click)="close()">< {{'SEARCH.BACK' | translate}}</a>
|
||||
</div>
|
||||
|
||||
@ -70,3 +70,7 @@
|
||||
overflow-y: auto;
|
||||
max-height: 85%;
|
||||
}
|
||||
|
||||
#placeholder1 {
|
||||
height: 24px;
|
||||
}
|
||||
@ -3,7 +3,7 @@
|
||||
<a href="javascript:void(0)" class="nav-link" (click)="homeAction()">
|
||||
<!-- <clr-icon shape="vm-bug" *ngIf="!customStyle?.headerLogo"></clr-icon> -->
|
||||
<img src="../../../images/harbor-white-logo.svg" class="harbor-logo" />
|
||||
<img [attr.src]="'static/images/'+customStyle?.headerLogo" *ngIf="customStyle?.headerLogo" style="width: 36px;height: 36px; object-fit: fill;">
|
||||
<img [attr.src]="'static/images/'+customStyle?.headerLogo" *ngIf="customStyle?.headerLogo" class="headerLogo">
|
||||
<span class="title">{{customProjectName?.projectName? customProjectName?.projectName:(appTitle | translate)}}</span>
|
||||
</a>
|
||||
</div>
|
||||
@ -14,9 +14,9 @@
|
||||
<global-search></global-search>
|
||||
<div class="header-actions">
|
||||
<clr-dropdown class="dropdown bottom-left" *ngIf="!isIntegrationMode">
|
||||
<button class="nav-icon" clrDropdownToggle style="width: 98px;">
|
||||
<clr-icon shape="world" style="left:-8px;"></clr-icon>
|
||||
<span style="padding-right: 8px;">{{currentLang}}</span>
|
||||
<button class="nav-icon nav-icon-width" clrDropdownToggle>
|
||||
<clr-icon shape="world" class="icon-left"></clr-icon>
|
||||
<span class="currentLang">{{currentLang}}</span>
|
||||
<clr-icon shape="caret down"></clr-icon>
|
||||
</button>
|
||||
<clr-dropdown-menu *clrIfOpen>
|
||||
@ -29,7 +29,7 @@
|
||||
</clr-dropdown>
|
||||
<clr-dropdown class="dropdown" *ngIf="isSessionValid">
|
||||
<button class="nav-text" clrDropdownToggle>
|
||||
<clr-icon shape="user" class="is-inverse" size="24" style="left: -2px;"></clr-icon>
|
||||
<clr-icon shape="user" class="is-inverse user-icon" size="24"></clr-icon>
|
||||
<span>{{accountName}}</span>
|
||||
<clr-icon shape="caret down"></clr-icon>
|
||||
</button>
|
||||
|
||||
@ -39,3 +39,23 @@
|
||||
width: 40px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.nav-icon-width {
|
||||
width: 98px !important;
|
||||
.icon-left {
|
||||
left: -8px;
|
||||
}
|
||||
.currentLang {
|
||||
padding-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-icon {
|
||||
left: -2px;
|
||||
}
|
||||
|
||||
.headerLogo {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
object-fit: fill;
|
||||
}
|
||||
@ -15,3 +15,11 @@
|
||||
line-height: 12px;
|
||||
left: 170px;
|
||||
}
|
||||
|
||||
.body-format {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.loading-top {
|
||||
top: 8px;
|
||||
}
|
||||
@ -9,7 +9,7 @@
|
||||
<option value="uaa_auth">{{'CONFIG.AUTH_MODE_UAA' | translate }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right" style="top: -1px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right top-1">
|
||||
<clr-icon shape="info-circle" size="24" class="info-tips-icon"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.AUTH_MODE' | translate}}</span>
|
||||
</a>
|
||||
@ -56,7 +56,7 @@
|
||||
{{'TOOLTIP.ITEM_REQUIRED' | translate}}
|
||||
</span>
|
||||
</label>
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right" style="top:-1px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right top-1">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.LDAP_SEARCH_DN' | translate}}</span>
|
||||
</a>
|
||||
@ -81,7 +81,7 @@
|
||||
{{'TOOLTIP.ITEM_REQUIRED' | translate}}
|
||||
</span>
|
||||
</label>
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right" style="top: -1px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right top-1">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.LDAP_BASE_DN' | translate}}</span>
|
||||
</a>
|
||||
@ -106,7 +106,7 @@
|
||||
{{'TOOLTIP.ITEM_REQUIRED' | translate}}
|
||||
</span>
|
||||
</label>
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right" style="top: -1px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right top-1">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.LDAP_UID' | translate}}</span>
|
||||
</a>
|
||||
@ -120,7 +120,7 @@
|
||||
<option value="2">{{'CONFIG.SCOPE_SUBTREE' | translate }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right" style="top:-1px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right top-1">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.LDAP_SCOPE' | translate}}</span>
|
||||
</a>
|
||||
@ -192,7 +192,7 @@
|
||||
<div class="form-group" *ngIf="showSelfReg">
|
||||
<label for="selfReg">{{'CONFIG.SELF_REGISTRATION' | translate}}</label>
|
||||
<clr-checkbox name="selfReg" id="selfReg" [(ngModel)]="currentConfig.self_registration.value" [disabled]="disabled(currentConfig.self_registration)">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right" style="top:-7px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right top-7">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span *ngIf="checkable; else elseBlock" class="tooltip-content">{{'CONFIG.TOOLTIP.SELF_REGISTRATION_ENABLE' | translate}}</span>
|
||||
<ng-template #elseBlock>
|
||||
@ -207,7 +207,7 @@
|
||||
<label for="ldapVerifyCert">{{'CONFIG.LDAP.VERIFY_CERT' | translate}}</label>
|
||||
<clr-checkbox name="ldapVerifyCert" id="ldapVerifyCert" [clrChecked]="currentConfig.ldap_verify_cert.value" [clrDisabled]="disabled(currentConfig.ldap_scope)"
|
||||
(clrCheckedChange)="setVerifyCertValue($event)">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right" style="top:-7px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right top-7">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.TOOLTIP.VERIFY_CERT' | translate}}</span>
|
||||
</a>
|
||||
|
||||
@ -5,3 +5,11 @@ clr-tooltip {
|
||||
.padding-right-28 {
|
||||
padding-right:28px;
|
||||
}
|
||||
|
||||
.top-1 {
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
.top-7 {
|
||||
top: -7px;
|
||||
}
|
||||
@ -1,6 +1,6 @@
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<h2 style="display: inline-block;" class="custom-h2">{{'CONFIG.TITLE' | translate }}</h2>
|
||||
<h2 class="custom-h2 config-title">{{'CONFIG.TITLE' | translate }}</h2>
|
||||
<span class="spinner spinner-inline" [hidden]="inProgress === false"></span>
|
||||
<ul id="configTabs" class="nav" role="tablist">
|
||||
<li role="presentation" class="nav-item">
|
||||
|
||||
@ -14,3 +14,11 @@ clr-icon {
|
||||
clr-icon:hover {
|
||||
color: #007CBB;
|
||||
}
|
||||
|
||||
.config-title {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.tooltip-position {
|
||||
top: -7px;
|
||||
}
|
||||
@ -58,7 +58,7 @@
|
||||
<div class="form-group">
|
||||
<label for="selfReg">{{'CONFIG.MAIL_SSL' | translate}}</label>
|
||||
<clr-checkbox name="emailSSL" id="emailSSL" [(ngModel)]="currentConfig.email_ssl.value" [disabled]="disabled(currentConfig.email_ssl)">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right" style="top:-7px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right tooltip-position">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.SSL_TOOLTIP' | translate}}</span>
|
||||
</a>
|
||||
@ -68,7 +68,7 @@
|
||||
<label for="insecure">{{'CONFIG.MAIL_INSECURE' | translate}}</label>
|
||||
<clr-checkbox name="emaiInsecure" id="emailInsecure" [clrChecked]="!currentConfig.email_insecure.value" [clrDisabled]="disabled(currentConfig.email_insecure)"
|
||||
(clrCheckedChange)="setInsecureValue($event)">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right" style="top:-7px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right tooltip-position">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content">{{'CONFIG.INSECURE_TOOLTIP' | translate}}</span>
|
||||
</a>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<clr-alert [clrAlertType]="globalMessage.type" [clrAlertAppLevel]="isAppLevel" [(clrAlertClosed)]="!globalMessageOpened" (clrAlertClosedChange)="onClose()">
|
||||
<div class="alert-item">
|
||||
<span class="alert-text">{{message}}</span>
|
||||
<div class="alert-actions" *ngIf="needAuth" style="display: inline;">
|
||||
<div class="alert-actions alert-style" *ngIf="needAuth">
|
||||
<button class="btn alert-action" (click)="signIn()">{{ 'BUTTON.LOG_IN' | translate }}</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,3 +1,7 @@
|
||||
.alert-app-level {
|
||||
margin-bottom:20px;
|
||||
}
|
||||
|
||||
.alert-style {
|
||||
display: inline;
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="top:12px;">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 log-top">
|
||||
<div class="row flex-items-xs-right option-right">
|
||||
<div class="flex-xs-middle">
|
||||
<button class="btn btn-link" (click)="toggleOptionalName(currentOption)">{{toggleName[currentOption] | translate}}</button>
|
||||
@ -18,7 +18,7 @@
|
||||
<clr-dropdown-menu [clrPosition]="'bottom-left'" *clrIfOpen>
|
||||
<a href="javascript:void(0)" clrDropdownItem *ngFor="let f of filterOptions" (click)="toggleFilterOption(f.key)">
|
||||
<clr-icon shape="check" [hidden]="!f.checked"></clr-icon>
|
||||
<ng-template [ngIf]="!f.checked"><span style="display: inline-block;width: 16px;"></span></ng-template>
|
||||
<ng-template [ngIf]="!f.checked"><span class="check-span"></span></ng-template>
|
||||
{{f.description | translate}}
|
||||
</a>
|
||||
</clr-dropdown-menu>
|
||||
|
||||
@ -13,3 +13,12 @@
|
||||
.row-right {
|
||||
padding-right: 60px;
|
||||
}
|
||||
|
||||
.log-top {
|
||||
top: 12px;
|
||||
}
|
||||
|
||||
.check-span {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
}
|
||||
@ -4,11 +4,11 @@
|
||||
<div class="modal-body modal-height">
|
||||
<form #projectForm="ngForm">
|
||||
<section class="form-block">
|
||||
<div class="form-group" style="padding-left: 135px;">
|
||||
<div class="form-group">
|
||||
<label for="create_project_name" class="col-md-3 form-group-label-override required">{{'PROJECT.NAME' | translate}}</label>
|
||||
<label for="create_project_name" aria-haspopup="true" role="tooltip" [class.invalid]="!isNameValid" class="tooltip tooltip-validation tooltip-md tooltip-bottom-left">
|
||||
<input type="text" id="create_project_name" [(ngModel)]="project.name"
|
||||
name="create_project_name" size="255" style="width: 296px;"
|
||||
name="create_project_name" size="255" class="input-width"
|
||||
required
|
||||
pattern="^[a-z0-9]+(?:[._-][a-z0-9]+)*$"
|
||||
minlength="2"
|
||||
@ -21,15 +21,15 @@
|
||||
</label>
|
||||
<span class="spinner spinner-inline" [hidden]="!checkOnGoing"></span>
|
||||
</div>
|
||||
<div class="form-group" style="padding-left: 135px;">
|
||||
<div class="form-group">
|
||||
<label class="col-md-4 form-group-label-override">{{'PROJECT.ACCESS_LEVEL' | translate}}</label>
|
||||
<div class="checkbox-inline">
|
||||
<input type="checkbox" id="create_project_public" [(ngModel)]="project.metadata.public" name="public">
|
||||
<label for="create_project_public"></label>
|
||||
<span class="access-level-label">{{ 'PROJECT.PUBLIC' | translate}}</span>
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-md tooltip-right" style="top:-8px; left:-8px;">
|
||||
<a href="javascript:void(0)" role="tooltip" aria-haspopup="true" class="tooltip tooltip-md tooltip-right public-tooltip">
|
||||
<clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
|
||||
<span class="tooltip-content" style="margin-left: 5px;">{{'PROJECT.INLINE_HELP_PUBLIC' | translate }}</span>
|
||||
<span class="tooltip-content inline-help-public">{{'PROJECT.INLINE_HELP_PUBLIC' | translate }}</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -14,4 +14,18 @@
|
||||
.modal-height {
|
||||
height: 15.3em;
|
||||
overflow-y: hidden;
|
||||
.form-block > div {
|
||||
padding-left: 135px;
|
||||
.input-width {
|
||||
width: 296px;
|
||||
}
|
||||
.public-tooltip {
|
||||
top: -8px;
|
||||
left: -8px;
|
||||
}
|
||||
.inline-help-public {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
<div class="row content-space">
|
||||
<div>
|
||||
<div class="row flex-items-xs-between rightPos">
|
||||
<div class="flex-xs-middle option-left" style="position: relative; top: 10px;">
|
||||
<div class="flex-xs-middle option-left">
|
||||
</div>
|
||||
<div class="flex-xs-middle option-right">
|
||||
<hbr-filter [withDivider]="true" filterPlaceholder='{{"MEMBER.FILTER_PLACEHOLDER" | translate}}' (filterEvt)="doSearch($event)" [currentValue]="searchMember"></hbr-filter>
|
||||
|
||||
@ -1,5 +1,7 @@
|
||||
.option-left {
|
||||
padding-left: 16px;
|
||||
position: relative;
|
||||
top: 10px;
|
||||
}
|
||||
|
||||
.option-right {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="top: 8px;">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 config-top">
|
||||
<hbr-project-policy-config [projectId]="projectId" [projectName]="projectName" [hasSignedIn]="hasSignedIn" [hasProjectAdminRole]="hasProjectAdminRole"></hbr-project-policy-config>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,3 @@
|
||||
.config-top {
|
||||
top: 8px;
|
||||
}
|
||||
@ -1,6 +1,6 @@
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="row flex-items-xs-between flex-items-xs-top" style="padding-left: 15px; padding-right: 15px;">
|
||||
<div class="row flex-items-xs-between flex-items-xs-top projectPos">
|
||||
<h2 class="header-title">{{'PROJECT.PROJECTS' | translate}}</h2>
|
||||
<div>
|
||||
<statistics-panel></statistics-panel>
|
||||
@ -8,7 +8,7 @@
|
||||
</div>
|
||||
<div class="row flex-items-xs-between rightPos">
|
||||
<div class="option-right">
|
||||
<div class="select" style="float: left; left:-6px; top:8px;">
|
||||
<div class="select select-option">
|
||||
<select (change)="doFilterProjects()" [(ngModel)]="selecteType">
|
||||
<option value="0" [selected]="currentFilteredType === 0">{{projectTypes[0] | translate}}</option>
|
||||
<option value="1">{{projectTypes[1] | translate}}</option>
|
||||
|
||||
@ -8,6 +8,11 @@
|
||||
|
||||
.option-right {
|
||||
padding-right: 16px;
|
||||
.select-option {
|
||||
float: left;
|
||||
left: -6px;
|
||||
top: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.refresh-btn {
|
||||
@ -20,3 +25,8 @@
|
||||
.rightPos {
|
||||
position: absolute; right: 20px; margin-top: 5px; height:32px; z-index: 100;
|
||||
}
|
||||
|
||||
.projectPos {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
<h2 class="custom-h2">{{'SIDE_NAV.SYSTEM_MGMT.REGISTRY' | translate}}</h2>
|
||||
<div style="margin-top: 4px;">
|
||||
<div class="content-top">
|
||||
<hbr-endpoint></hbr-endpoint>
|
||||
</div>
|
||||
@ -15,7 +15,8 @@ import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'destination-page',
|
||||
templateUrl: 'destination-page.component.html'
|
||||
templateUrl: 'destination-page.component.html',
|
||||
styleUrls: [ '../total-replication/total-replication.component.scss' ]
|
||||
})
|
||||
export class DestinationPageComponent {
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<h2 class="custom-h2">{{'SIDE_NAV.SYSTEM_MGMT.REPLICATION' | translate}}</h2>
|
||||
<div style="margin-top: 4px;">
|
||||
<div class="content-top">
|
||||
<hbr-replication [withReplicationJob]='true' [isSystemAdmin]="isSystemAdmin" [withAdmiral]="withAdmiral" (goToRegistry)="goRegistry()" (redirect)="customRedirect($event)"></hbr-replication>
|
||||
</div>
|
||||
@ -21,7 +21,8 @@ import {AppConfigService} from "../../app-config.service";
|
||||
|
||||
@Component({
|
||||
selector: 'total-replication',
|
||||
templateUrl: 'total-replication-page.component.html'
|
||||
templateUrl: 'total-replication-page.component.html',
|
||||
styleUrls: [ './total-replication.component.scss' ]
|
||||
})
|
||||
export class TotalReplicationPageComponent {
|
||||
|
||||
|
||||
@ -4,3 +4,6 @@
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
|
||||
.content-top {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<div class="repo-wrapper">
|
||||
<div>
|
||||
<h3 style="margin-top: 0px;">{{'REPOSITORY.POP_REPOS' | translate}}</h3>
|
||||
<h3 class="pop-repos">{{'REPOSITORY.POP_REPOS' | translate}}</h3>
|
||||
</div>
|
||||
<div>
|
||||
<list-repository-ro [repositories]="topRepos"></list-repository-ro>
|
||||
|
||||
@ -1,4 +1,7 @@
|
||||
.repo-wrapper {
|
||||
margin-left: 48px;
|
||||
margin-right: 48px;
|
||||
.pop-repos {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
<clr-modal [(clrModalOpen)]="opened" [clrModalClosable]="false" [clrModalStaticBackdrop]="true">
|
||||
<h3 class="modal-title" class="confirmation-title" style="margin-top: 0px;">{{dialogTitle}}</h3>
|
||||
<h3 class="modal-title confirmation-title">{{dialogTitle}}</h3>
|
||||
<div class="modal-body">
|
||||
<div class="confirmation-icon-inline">
|
||||
<clr-icon shape="warning" class="is-warning" size="64"></clr-icon>
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
line-height: 24px;
|
||||
color: #000000;
|
||||
font-size: 22px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.confirmation-content {
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<div class="row flex-items-xs-between flex-items-xs-middle">
|
||||
<div></div>
|
||||
<div id="right_statistic_panel" style="margin-right: 18px; margin-top: 8px;">
|
||||
<div id="right_statistic_panel">
|
||||
<div class="statistic-block">
|
||||
<div class="statistic-column-block">
|
||||
<div>
|
||||
@ -10,7 +10,7 @@
|
||||
<span class="statistic-column-title statistic-column-title-repo">{{'STATISTICS.REPO_ITEM' | translate }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="statistic-column-block" style="margin-left: 16px;">
|
||||
<div class="statistic-column-block">
|
||||
<div>
|
||||
<statistics [data]='originalCopy.private_project_count' [label]='"STATISTICS.INDEX_PRIVATE" | translate'></statistics>
|
||||
</div>
|
||||
@ -18,7 +18,7 @@
|
||||
<statistics [data]='originalCopy.private_repo_count' [label]='"STATISTICS.INDEX_PRIVATE" | translate'></statistics>
|
||||
</div>
|
||||
</div>
|
||||
<div class="statistic-column-block" style="margin-left: 28px;">
|
||||
<div class="statistic-column-block">
|
||||
<div>
|
||||
<statistics [data]='originalCopy.public_project_count' [label]='"STATISTICS.INDEX_PUB" | translate'></statistics>
|
||||
</div>
|
||||
@ -26,7 +26,7 @@
|
||||
<statistics [data]='originalCopy.public_repo_count' [label]='"STATISTICS.INDEX_PUB" | translate'></statistics>
|
||||
</div>
|
||||
</div>
|
||||
<div class="statistic-column-block" style="margin-left: 28px;">
|
||||
<div class="statistic-column-block">
|
||||
<div>
|
||||
<statistics [data]='originalCopy.total_project_count' [label]='"STATISTICS.INDEX_TOTAL" | translate' *ngIf="isValidSession"></statistics>
|
||||
</div>
|
||||
|
||||
@ -56,3 +56,17 @@
|
||||
.statistic-block {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#right_statistic_panel {
|
||||
margin-right: 18px;
|
||||
margin-top: 8px;
|
||||
div:nth-of-type(2) {
|
||||
margin-left: 16px;
|
||||
}
|
||||
div:nth-of-type(3) {
|
||||
margin-left: 28px;
|
||||
}
|
||||
div:nth-of-type(4) {
|
||||
margin-left: 28px;
|
||||
}
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
<clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="true" [clrModalClosable]="false">
|
||||
<h3 class="modal-title">{{'RESET_PWD.TITLE' | translate}}</h3>
|
||||
<inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></inline-alert>
|
||||
<div class="modal-body" style="overflow-y: hidden;">
|
||||
<div class="modal-body body-format">
|
||||
<form #resetPwdForm="ngForm" class="form">
|
||||
<section class="form-block">
|
||||
<div class="form-group">
|
||||
@ -42,7 +42,7 @@
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<span class="spinner spinner-inline" style="top:8px;" [hidden]="showProgress === false"></span>
|
||||
<span class="spinner spinner-inline loading-top" [hidden]="showProgress === false"></span>
|
||||
<button type="button" class="btn btn-outline" (click)="close()">{{'BUTTON.CANCEL' | translate}}</button>
|
||||
<button type="button" class="btn btn-primary" [disabled]="!isValid || showProgress" (click)="send()">{{'BUTTON.OK' | translate}}</button>
|
||||
</div>
|
||||
|
||||
@ -22,7 +22,7 @@ import {TranslateService} from "@ngx-translate/core";
|
||||
@Component({
|
||||
selector: 'change-password',
|
||||
templateUrl: "change-password.component.html",
|
||||
styleUrls: ['./change-password.component.scss']
|
||||
styleUrls: ['./change-password.component.scss', '../../common.scss']
|
||||
})
|
||||
export class ChangePasswordComponent {
|
||||
opened: boolean = false;
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
<clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="true" [clrModalClosable]="false">
|
||||
<h3 class="modal-title">{{'USER.ADD_USER_TITLE' | translate}}</h3>
|
||||
<inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></inline-alert>
|
||||
<div class="modal-body" style="overflow-y: hidden;">
|
||||
<div class="modal-body body-format">
|
||||
<new-user-form (valueChange)="formValueChange($event)"></new-user-form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<span class="spinner spinner-inline" style="top:8px;" [hidden]="inProgress === false"> </span>
|
||||
<span class="spinner spinner-inline loading-top" [hidden]="inProgress === false"> </span>
|
||||
<button type="button" class="btn btn-outline" (click)="close()">{{'BUTTON.CANCEL' | translate}}</button>
|
||||
<button type="button" class="btn btn-primary" [disabled]="!isValid || inProgress" (click)="create()">{{'BUTTON.OK' | translate}}</button>
|
||||
</div>
|
||||
|
||||
@ -23,7 +23,8 @@ import { MessageHandlerService } from '../shared/message-handler/message-handler
|
||||
|
||||
@Component({
|
||||
selector: "new-user-modal",
|
||||
templateUrl: "new-user-modal.component.html"
|
||||
templateUrl: "new-user-modal.component.html",
|
||||
styleUrls: ['../common.scss']
|
||||
})
|
||||
|
||||
export class NewUserModalComponent {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user