Upstream/harbor
1
0
Fork 0
mirror of https://github.com/goharbor/harbor.git synced 2024-12-25 01:58:35 +01:00
Code Issues Projects Releases Wiki Activity

Move inline css style to scss

Browse Source 
Signed-off-by: FangyuanCheng <fangyuanc@vmware.com>
This commit is contained in:
FangyuanCheng 2018-12-11 10:47:14 +08:00
parent 06eec7b3ed
commit c36e9daea1
87 changed files with 528 additions and 212 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/portal/lib/src/config/registry-config.component.scss
View File

@ -4,4 +4,18 @@
.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;
}

6
src/portal/lib/src/config/replication/replication-config.component.html
View File

@ -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>

8
src/portal/lib/src/config/system/system-settings.component.html
View File

@ -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>

12
src/portal/lib/src/config/system/system-settings.component.scss
View File

@ -0,0 +1,12 @@
.subtitle {
font-size: 14px;
font-weight: 600;
}
.create-tooltip {
top: -1;
}
.read-tooltip {
top: -7px;
}

6
src/portal/lib/src/config/vulnerability/vulnerability-config.component.html
View File

@ -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>

10
src/portal/lib/src/config/vulnerability/vulnerability-config.component.scss
View File

@ -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{

2
src/portal/lib/src/confirmation-dialog/confirmation-dialog.component.html
View File

@ -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>

1
src/portal/lib/src/confirmation-dialog/confirmation-dialog.component.scss
View File

@ -6,6 +6,7 @@
line-height: 24px;
color: #000000;
font-size: 22px;
margin-top: 0;
}
.confirmation-content {

2
src/portal/lib/src/create-edit-endpoint/create-edit-endpoint.component.html
View File

@ -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>

4
src/portal/lib/src/create-edit-endpoint/create-edit-endpoint.component.scss
View File

@ -6,4 +6,8 @@
clr-tooltip {
top: 3px;
position: relative;
}
.form-height {
height: 30px;
}

14
src/portal/lib/src/create-edit-rule/create-edit-rule.component.html
View File

@ -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 &nbsp;</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>

24
src/portal/lib/src/create-edit-rule/create-edit-rule.component.scss
View File

@ -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;
}

4
src/portal/lib/src/create-edit-rule/filter-label.component.html
View File

@ -2,9 +2,9 @@
<a class="filterClose" (click)="closeFilter()">&times;</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>

41
src/portal/lib/src/create-edit-rule/filter-label.component.scss
View File

@ -12,34 +12,39 @@
max-width: 15rem;
border-radius: .125rem;
z-index: 100;
.filterClose {
position: absolute;
right: 8px;
top: 5px;
cursor: pointer;
font-size: 20px;
}
.filterLabelHeader {
font-size: .5rem;
font-weight: 600;
letter-spacing: normal;
padding: 0 .5rem;
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;}
.filterLabelHeader {
font-size: .5rem;
font-weight: 600;
letter-spacing: normal;
padding: 0 .5rem;
line-height: .75rem;
margin: 0;
color: #313131;
}
.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;

2
src/portal/lib/src/endpoint/endpoint.component.html
View File

@ -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">

4
src/portal/lib/src/endpoint/endpoint.component.scss
View File

@ -21,4 +21,8 @@
right: 35px;
margin-top: 4px;
height: 24px;
}
.endpoint-view {
position: relative;
}

2
src/portal/lib/src/filter/filter.component.html
View File

@ -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>

4
src/portal/lib/src/filter/filter.component.scss
View File

@ -22,4 +22,8 @@
.search-btn:hover {
color: #007CBB;
}
.filter-input {
padding-left: 15px;
}

2
src/portal/lib/src/label/label.component.html
View File

@ -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">

44
src/portal/lib/src/label/label.component.scss
View File

@ -1,27 +1,25 @@
.option-left {
padding-left: 16px;
margin-top: -6px;
.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;
}
}
}
}
}
.option-right {
padding-right: 16px;
}
.refresh-btn {
cursor: pointer;
}
.refresh-btn:hover {
color: #007CBB;
}
.rightPos {
position: absolute;
z-index: 100;
right: 35px;
margin-top: 4px;
height: 24px;
}
.content-mt {
margin-top: -12px;
}

6
src/portal/lib/src/list-replication-rule/list-replication-rule.component.html
View File

@ -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>&nbsp;{{'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">

7
src/portal/lib/src/list-replication-rule/list-replication-rule.component.scss
View File

@ -0,0 +1,7 @@
.list-rule {
padding-bottom: 15px;
}
.text-alignment {
vertical-align: text-bottom;
}

24
src/portal/lib/src/operation/operation.component.css
View File

@ -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;
}

24
src/portal/lib/src/operation/operation.component.html
View File

@ -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>

2
src/portal/lib/src/operation/operation.component.ts
View File

@ -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 {

2
src/portal/lib/src/push-image/copy-input.coponent.html
View File

@ -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>

2
src/portal/lib/src/push-image/push-image.component.html
View File

@ -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>

11
src/portal/lib/src/push-image/push-image.scss
View File

@ -44,4 +44,15 @@
}
.hide{
display:none;
}
.inputTarget {
width: 1px;
min-width: 0;
padding: 0;
opacity: .1;
}
.dropdown-width {
min-width: 500px;
}

8
src/portal/lib/src/replication/replication.component.html
View File

@ -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)"

27
src/portal/lib/src/replication/replication.component.scss
View File

@ -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;
@ -37,4 +29,23 @@
.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;
}
}
}

6
src/portal/lib/src/repository-gridview/repository-gridview.component.html
View File

@ -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"

8
src/portal/lib/src/repository-gridview/repository-gridview.component.scss
View File

@ -78,4 +78,12 @@
height: 24px;
width: 24px;
margin-right: 12px;
}
.position-relative {
position: relative;
}
.push-image-button {
display: inline-block;
}

2
src/portal/lib/src/tag/tag-detail.component.html
View File

@ -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>

4
src/portal/lib/src/tag/tag-detail.component.scss
View File

@ -118,6 +118,10 @@ $size24:24px;
font-size: 14px;
}
.detail-tag {
margin-bottom: 2px;
}
.image-detail-label {
margin-right: 10px;
text-align: left;

56
src/portal/lib/src/tag/tag.component.html
View File

@ -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()">&times;</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,56 +62,56 @@
<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>
</button>
</div>
</div>
</div>
</clr-dropdown-menu>
</clr-dropdown>
<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>&nbsp;{{'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>&nbsp;{{'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">

61
src/portal/lib/src/tag/tag.component.scss
View File

@ -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;
@ -208,4 +220,41 @@
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;
}

4
src/portal/lib/src/vulnerability-scanning/result-bar-chart-component.html
View File

@ -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>

2
src/portal/lib/src/vulnerability-scanning/result-grid.component.html
View File

@ -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">

2
src/portal/lib/src/vulnerability-scanning/result-tip.componnent.html
View File

@ -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">

14
src/portal/lib/src/vulnerability-scanning/scanning.scss
View File

@ -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 {
@ -130,4 +136,12 @@ hr{
z-index: 100;
right: 35px;
margin-top: 4px;
}
.result-row {
position: relative;
}
.help-icon {
margin-left: 3px;
}

4
src/portal/src/app/account/account-settings/account-settings-modal.component.html
View File

@ -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>

4
src/portal/src/app/account/account-settings/account-settings-modal.component.scss
View File

@ -8,7 +8,7 @@ clr-modal {
padding-left: 3px;
padding-right: 3px;
}
position: relative;
bottom: 9px;
position: relative;
bottom: 9px;
}
}

4
src/portal/src/app/account/password-setting/forgot-password/forgot-password.component.html
View File

@ -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>

4
src/portal/src/app/account/password-setting/password-setting.component.html
View File

@ -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>

4
src/portal/src/app/account/password-setting/password-setting.component.scss
View File

@ -4,4 +4,8 @@
.form-group-override {
padding-left: 130px !important;
}
.password-body {
min-height: 130px;
}

4
src/portal/src/app/account/password-setting/reset-password/reset-password.component.html
View File

@ -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>

2
src/portal/src/app/account/sign-up/sign-up-page.component.html
View File

@ -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>

3
src/portal/src/app/account/sign-up/sign-up-page.component.ts
View File

@ -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;

4
src/portal/src/app/account/sign-up/sign-up.component.html
View File

@ -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>

3
src/portal/src/app/account/sign-up/sign-up.component.ts
View File

@ -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;

2
src/portal/src/app/base/global-search/search-result.component.html
View File

@ -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()">&lt;&nbsp;{{'SEARCH.BACK' | translate}}</a>
</div>

4
src/portal/src/app/base/global-search/search.component.scss
View File

@ -69,4 +69,8 @@
#results {
overflow-y: auto;
max-height: 85%;
}
#placeholder1 {
height: 24px;
}

10
src/portal/src/app/base/navigator/navigator.component.html
View File

@ -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>

20
src/portal/src/app/base/navigator/navigator.component.scss
View File

@ -38,4 +38,24 @@
.harbor-logo {
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;
}

8
src/portal/src/app/common.scss
View File

@ -14,4 +14,12 @@
font-weight: 400;
line-height: 12px;
left: 170px;
}
.body-format {
overflow-y: hidden;
}
.loading-top {
top: 8px;
}

14
src/portal/src/app/config/auth/config-auth.component.html
View File

@ -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>

8
src/portal/src/app/config/auth/config-auth.component.scss
View File

@ -4,4 +4,12 @@ clr-tooltip {
.padding-right-28 {
padding-right:28px;
}
.top-1 {
top: -1px;
}
.top-7 {
top: -7px;
}

2
src/portal/src/app/config/config.component.html
View File

@ -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">

8
src/portal/src/app/config/config.component.scss
View File

@ -13,4 +13,12 @@ clr-icon {
}
clr-icon:hover {
color: #007CBB;
}
.config-title {
display: inline-block;
}
.tooltip-position {
top: -7px;
}

4
src/portal/src/app/config/email/config-email.component.html
View File

@ -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
src/portal/src/app/global-message/message.component.html
View File

@ -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>

4
src/portal/src/app/global-message/message.component.scss
View File

@ -1,3 +1,7 @@
.alert-app-level {
margin-bottom:20px;
}
.alert-style {
display: inline;
}

4
src/portal/src/app/log/audit-log.component.html
View File

@ -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>

9
src/portal/src/app/log/audit-log.component.scss
View File

@ -12,4 +12,13 @@
.row-right {
padding-right: 60px;
}
.log-top {
top: 12px;
}
.check-span {
display: inline-block;
width: 16px;
}

32
src/portal/src/app/project/create-project/create-project.component.html
View File

@ -4,32 +4,32 @@
<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;"
required
pattern="^[a-z0-9]+(?:[._-][a-z0-9]+)*$"
minlength="2"
#projectName="ngModel"
autocomplete="off"
(keyup)='handleValidation()'>
<span class="tooltip-content">
{{ nameTooltipText | translate }}
</span>
</label>
<input type="text" id="create_project_name" [(ngModel)]="project.name"
name="create_project_name" size="255" class="input-width"
required
pattern="^[a-z0-9]+(?:[._-][a-z0-9]+)*$"
minlength="2"
#projectName="ngModel"
autocomplete="off"
(keyup)='handleValidation()'>
<span class="tooltip-content">
{{ nameTooltipText | translate }}
</span>
</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>

16
src/portal/src/app/project/create-project/create-project.scss
View File

@ -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;
}
}
}

2
src/portal/src/app/project/member/member.component.html
View File

@ -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>

2
src/portal/src/app/project/member/member.component.scss
View File

@ -1,5 +1,7 @@
.option-left {
padding-left: 16px;
position: relative;
top: 10px;
}
.option-right {

2
src/portal/src/app/project/project-config/project-config.component.html
View File

@ -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>

3
src/portal/src/app/project/project-config/project-config.component.scss
View File

@ -0,0 +1,3 @@
.config-top {
top: 8px;
}

4
src/portal/src/app/project/project.component.html
View File

@ -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>

10
src/portal/src/app/project/project.component.scss
View File

@ -8,6 +8,11 @@
.option-right {
padding-right: 16px;
.select-option {
float: left;
left: -6px;
top: 8px;
}
}
.refresh-btn {
@ -19,4 +24,9 @@
}
.rightPos {
position: absolute; right: 20px; margin-top: 5px; height:32px; z-index: 100;
}
.projectPos {
padding-left: 15px;
padding-right: 15px;
}

2
src/portal/src/app/replication/destination/destination-page.component.html
View File

@ -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>

3
src/portal/src/app/replication/destination/destination-page.component.ts
View File

@ -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 {
}

2
src/portal/src/app/replication/total-replication/total-replication-page.component.html
View File

@ -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>

3
src/portal/src/app/replication/total-replication/total-replication-page.component.ts
View File

@ -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 {

3
src/portal/src/app/replication/total-replication/total-replication.component.scss
View File

@ -4,3 +4,6 @@
margin-bottom: 11px;
}
.content-top {
margin-top: 4px;
}

2
src/portal/src/app/repository/top-repo/top-repo.component.html
View File

@ -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>

3
src/portal/src/app/repository/top-repo/top-repo.component.scss
View File

@ -1,4 +1,7 @@
.repo-wrapper {
margin-left: 48px;
margin-right: 48px;
.pop-repos {
margin-top: 0;
}
}

2
src/portal/src/app/shared/confirmation-dialog/confirmation-dialog.component.html
View File

@ -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>

1
src/portal/src/app/shared/confirmation-dialog/confirmation-dialog.component.scss
View File

@ -6,6 +6,7 @@
line-height: 24px;
color: #000000;
font-size: 22px;
margin-top: 0;
}
.confirmation-content {

8
src/portal/src/app/shared/statictics/statistics-panel.component.html
View File

@ -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>

14
src/portal/src/app/shared/statictics/statistics.component.scss
View File

@ -55,4 +55,18 @@
.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;
}
}

4
src/portal/src/app/user/change-password/change-password.component.html
View File

@ -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>

2
src/portal/src/app/user/change-password/change-password.component.ts
View File

@ -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;

4
src/portal/src/app/user/new-user-modal.component.html
View File

@ -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>

3
src/portal/src/app/user/new-user-modal.component.ts
View File

@ -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 {