Skip to content

GitLab

Commit a773115c authored by AllForNothing's avatar AllForNothing
Browse files

Fix UI issues with label target 2.0.1 


Signed-off-by: default avatarAllForNothing <sshijun@vmware.com>
parent c261555b
Hide whitespace changes
Inline Side-by-side
Showing with 95 additions and 100 deletions
src/portal/src/app/base/harbor-shell/harbor-shell.component.html
View file @ a773115c
......@@ -80,28 +80,22 @@
</clr-vertical-nav-group-children>
</clr-vertical-nav-group>
</div>
<div>
<ng-container *ngFor="let theme of themeArray;let i=index">
<ng-container *ngIf="theme.showStyle === styleMode">
<div class="mb-1">
<ng-container *ngFor="let theme of themeArray;let i=index">
<ng-container *ngIf="theme.showStyle === styleMode">
<a clrVerticalNavLink (click)="themeChanged(theme)">
<clr-icon clrVerticalNavIcon size="20" *ngIf="styleMode ==='DARK'" shape="sun" class="is-solid"></clr-icon>
<clr-icon clrVerticalNavIcon size="20" *ngIf="styleMode ==='LIGHT'" shape="moon" class="is-solid"></clr-icon>
<clr-icon clrVerticalNavIcon size="20" *ngIf="styleMode ==='DARK'" shape="sun"
class="is-solid"></clr-icon>
<clr-icon clrVerticalNavIcon size="20" *ngIf="styleMode ==='LIGHT'" shape="moon"
class="is-solid"></clr-icon>
{{ theme.text | translate }}
</a>
</ng-container>
</ng-container>
<clr-vertical-nav-group routerLinkActive="active">
<clr-icon shape="network-globe" clrVerticalNavIcon></clr-icon>
{{'SIDE_NAV.API_EXPLORER' | translate}}
<a routerLink="#" hidden aria-hidden="true"></a>
<clr-vertical-nav-group-children *clrIfExpanded="true">
<a class="font-size-13" clrVerticalNavLink target="_blank" routerLink="/devcenter-api-2.0"
routerLinkActive="active">
<clr-icon shape="network-globe" clrVerticalNavIcon></clr-icon>
{{'SIDE_NAV.HARBOR_API_MANAGEMENT' | translate}}
</a>
</clr-vertical-nav-group-children>
</clr-vertical-nav-group>
</ng-container>
</ng-container>
<a clrVerticalNavLink routerLinkActive="active" target="_blank" routerLink="/devcenter-api-2.0">
<clr-icon shape="network-globe" clrVerticalNavIcon></clr-icon>
{{'SIDE_NAV.HARBOR_API_MANAGEMENT' | translate}}
</a>
</div>
</clr-vertical-nav>
<hbr-operation-model *ngIf="isUserExisting"></hbr-operation-model>
......
src/portal/src/app/config/config.component.scss
View file @ a773115c
.info-tips-icon {
color: grey;
}
.info-tips-icon:hover {
color: #007CBB;
}
clr-icon {
color: grey;
margin-top: -3px;
}
clr-icon:hover {
color: #007CBB;
}
.clr-validate-icon {
color: red;
}
.config-title {
display: inline-block;
}
......
src/portal/src/app/config/scanner/config-scanner.component.scss
View file @ a773115c
......@@ -4,18 +4,10 @@
display: flex;
justify-content: flex-end;
}
.refresh-btn {
cursor: pointer;
margin-top: 7px;
}
.clr-icon {
color: #0079b8;
margin-top: 0;
}
.color-b {
color: #bbb;
}
.margin-left-5 {
margin-left: 5px;
}
......
src/portal/src/app/project/helm-chart/helm-chart-detail/chart-detail/chart-detail-value.component.scss
View file @ a773115c
.value-container {
::ng-deep pre {
min-height: fit-content;
max-height: none !important;
}
}
......@@ -19,4 +20,4 @@
pre {
max-height: max-content;
padding-left: 21px;
}
\ No newline at end of file
}
src/portal/src/app/project/helm-chart/list-chart-versions/helm-chart-versions-detail/helm-chart-version.component.scss
View file @ a773115c
......@@ -20,8 +20,7 @@
.filter-divider {
display: inline-block;
height: 16px;
width: 2px;
background-color: #cccccc;
width: 1px;
padding-top: 12px;
padding-bottom: 12px;
position: relative;
......@@ -115,4 +114,4 @@ hbr-resource-label-signpost {
.version-position {
position: relative;
}
\ No newline at end of file
}
src/portal/src/app/project/helm-chart/list-charts-detail/helm-chart.component.scss
View file @ a773115c
......@@ -18,8 +18,7 @@ $size60:60px;
.filter-divider {
display: inline-block;
height: 16px;
width: 2px;
background-color: #ccc;
width: 1px;
padding-top: 12px;
padding-bottom: 12px;
position: relative;
......@@ -133,4 +132,4 @@ button {
.version-position {
position: relative;
}
\ No newline at end of file
}
src/portal/src/app/project/list-project/list-project.component.ts
View file @ a773115c
......@@ -200,6 +200,9 @@ export class ListProjectComponent implements OnDestroy {
observableLists.push(this.delOperate(data));
});
forkJoin(...observableLists).subscribe(item => {
this.translate.get("BATCH.DELETED_SUCCESS").subscribe(res => {
this.msgHandler.showSuccess(res);
});
let st: State = this.getStateAfterDeletion();
this.selectedRow = [];
if (!st) {
......@@ -208,6 +211,10 @@ export class ListProjectComponent implements OnDestroy {
this.clrLoad(st);
this.statisticHandler.refresh();
}
}, error => {
this.translate.get("BATCH.DELETED_FAILURE").subscribe(res => {
this.msgHandler.handleError(res);
});
});
}
}
......@@ -220,13 +227,10 @@ export class ListProjectComponent implements OnDestroy {
operMessage.state = OperationState.progressing;
operMessage.data.name = project.name;
this.operationService.publishInfo(operMessage);
return this.proService.deleteProject(project.project_id)
.pipe(map(
() => {
this.translate.get("BATCH.DELETED_SUCCESS").subscribe(res => {
operateChanges(operMessage, OperationState.success);
});
operateChanges(operMessage, OperationState.success);
}), catchError(
error => {
const message = errorHandler(error);
......
src/portal/src/app/project/repository/artifact-list-page/artifact-list/artifact-list-tab/artifact-list-tab.component.html
View file @ a773115c
......@@ -299,7 +299,7 @@
<div class="trigger-item">
<clr-signpost>
<button class="btn btn-link" clrSignpostTrigger>...</button>
<clr-signpost-content [clrPosition]="'left-top'" *clrIfOpen>
<clr-signpost-content [clrPosition]="'top-middle'" *clrIfOpen>
<div>
<hbr-label-piece *ngFor="let label of artifact.labels" [label]="label">
</hbr-label-piece>
......
src/portal/src/app/project/repository/repository-gridview.component.scss
View file @ a773115c
......@@ -56,8 +56,7 @@
.filter-divider {
display: inline-block;
height: 16px;
width: 2px;
background-color: #ccc;
width: 1px;
padding-top: 12px;
padding-bottom: 12px;
position: relative;
......
src/portal/src/app/project/repository/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.html
View file @ a773115c
......@@ -15,14 +15,10 @@
<clr-tooltip>
<div clrTooltipTrigger class="tip-block">
<div *ngIf="!isNone" class="circle-block">
<div class="black-point-container margin-left-10">
<div class="black-point"></div>
</div>
<div class="black-point-container margin-left-10"></div>
<span class="margin-left-10 font-weight-800 font-size-14">{{total}}</span>
<span class="margin-left-5 font-size-14">{{'SCANNER.TOTAL' | translate}}</span>
<div class="black-point-container margin-left-10">
<div class="black-point "></div>
</div>
<div class="black-point-container margin-left-10">-</div>
<span class="margin-left-10 font-weight-800 font-size-12">{{fixableCount}}</span>
<span class="margin-left-5 font-size-12">{{'SCANNER.FIXABLE' | translate}}</span>
</div>
......@@ -32,7 +28,7 @@
<div class="bar-tooltip-font-larger">
<div *ngIf="!isNone" class="level-border clr-display-inline-block margin-right-5">
<div [className]="getClass()">
<div class="inner">
<div class="inner" [ngClass]="{'is-white': !isThemeLight(), 'is-dark': isThemeLight()}">
{{vulnerabilitySummary?.severity | slice:0:1}}
</div>
</div>
......
src/portal/src/app/project/repository/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.scss
View file @ a773115c
$thirty-pixel: 30px;
$twenty-two-pixel: 22px;
$thirty-pixel: 26px;
$twenty-two-pixel: 18px;
.bar-wrapper {
width: 144px;
......@@ -235,11 +235,10 @@ hr {
height: $twenty-two-pixel;
width: $twenty-two-pixel;
line-height: $twenty-two-pixel;
font-size: 14px;
font-size: 12px;
font-weight: 600;
border-radius: 50%;
text-align: center;
background-color: #fff;
}
.level-critical {
......@@ -294,4 +293,10 @@ hr {
}
.margin-right-5 {
margin-right: 5px;
}
\ No newline at end of file
}
.is-white {
background-color: #fff;
}
.is-dark {
background-color: #000;
}
src/portal/src/app/project/tag-feature-integration/immutable-tag/immutable-tag.component.scss
View file @ a773115c
......@@ -22,18 +22,7 @@
.font-size-54 {
font-size: 0.541667rem;
}
::ng-deep {
.normal-wrapper-box {
.normal-wrapper {
.font-style {
width: 150px !important;
}
}
.btn {
margin-left: 150px !important;
}
}
}
.flex-150 {
flex: 0 0 150px;
}
......
src/portal/src/app/project/tag-feature-integration/tag-feature-integration.component.html
View file @ a773115c
<div class="btn-group btn-tag-integration">
<div class="radio btn">
<input type="radio" name="btn-group-demo-radios" id="btn-retention">
<label class="p-0" for="btn-retention"><a class="nav-link" routerLink="tag-retention" routerLinkActive="active" >{{'TAG_RETENTION.TAG_RETENTION' | translate}}</a></label>
<label class="p-0" for="btn-retention"><a class="strategy-nav-link" routerLink="tag-retention" routerLinkActive="active" >{{'TAG_RETENTION.TAG_RETENTION' | translate}}</a></label>
</div>
<div class="radio btn">
<input type="radio" name="btn-group-demo-radios" id="btn-immutable">
<label class="p-0" for="btn-immutable"><a class="nav-link" routerLink="immutable-tag" routerLinkActive="active" >{{'PROJECT_DETAIL.IMMUTABLE_TAG' | translate}}</a></label>
<label class="p-0" for="btn-immutable"><a class="strategy-nav-link" routerLink="immutable-tag" routerLinkActive="active" >{{'PROJECT_DETAIL.IMMUTABLE_TAG' | translate}}</a></label>
</div>
</div>
<router-outlet></router-outlet>
\ No newline at end of file
<router-outlet></router-outlet>
src/portal/src/app/project/tag-feature-integration/tag-feature-integration.component.scss
View file @ a773115c
.btn-tag-integration {
margin-top: 1.5rem;
margin-bottom: 1rem;
.nav-link {
.strategy-nav-link {
height: 100%;
width: 100%;
display: inline-block;
padding-left: 0.5rem;
padding-right: 0.5rem;
text-decoration: none;
color: #0077b8;
}
.active {
background: #0077b8;
color: #fff;
}
}
src/portal/src/app/project/tag-feature-integration/tag-retention/tag-retention.component.html
View file @ a773115c
......@@ -67,7 +67,7 @@
</div>
</div>
<div class="cron-selection">
<cron-selection [buttonMarginLeft]="'150px'" [disabled]="!(retention?.rules?.length > 0)" #cronScheduleComponent [labelCurrent]="label" [labelEdit]='label' [originCron]='originCron()' (inputvalue)="openConfirm($event)"></cron-selection>
<cron-selection [labelWidth]="'150px'" [disabled]="!(retention?.rules?.length > 0)" #cronScheduleComponent [labelCurrent]="label" [labelEdit]='label' [originCron]='originCron()' (inputvalue)="openConfirm($event)"></cron-selection>
</div>
<div class="clr-row pt-1">
<div class="clr-col-2 pt-2 flex-150"><label class="label-left font-size-54">{{'TAG_RETENTION.RETENTION_RUNS' | translate}}</label></div>
......
src/portal/src/app/project/tag-feature-integration/tag-retention/tag-retention.component.scss
View file @ a773115c
......@@ -44,7 +44,7 @@
z-index: 999;
}
.cron-selection {
margin-top: 20px;
margin-top: 30px;
display: flex;
align-items: center;
}
......
src/portal/src/app/project/webhook/webhook.component.html
View file @ a773115c
......@@ -82,7 +82,7 @@
<div class="trigger-item">
<clr-signpost>
<button class="btn btn-link ellipsis-btn font-size-20" clrSignpostTrigger>...</button>
<clr-signpost-content [clrPosition]="'left-top'" *clrIfOpen>
<clr-signpost-content [clrPosition]="'top-middle'" *clrIfOpen>
<div>
<div *ngFor="let e of w?.event_types" class="bar-state">
<span class="label not-scan">{{eventTypeToText(e)}}</span>
......
src/portal/src/css/common.scss
View file @ a773115c
......@@ -122,6 +122,32 @@ hbr-tag {
}
}
.filter-divider {
background-color: $filter-divider-bg-color ;
}
.selectBox {
background: $select-back-color !important;
color: $select-option-color !important;
}
.selectBox ul li:hover{
background-image: linear-gradient(180deg,$selectBox-option-hover-bg-color-start 0,$selectBox-option-hover-bg-color-end) !important;
}
.btn-tag-integration {
.active {
background: $btn-tag-integration-active-bg-color;
color: $btn-tag-integration-active-color;
}
}
hbr-result-tip-histogram {
.inner {
background-color: $hbr-result-tip-histogram-inner-bg-color;
}
}
// style of hbr-artifact-summary component
@mixin align-text-mixin($values...) {
@each $var in $values {
......@@ -136,6 +162,10 @@ hbr-tag {
padding: 2px 4px;
}
:not(pre) > code[class*="language-"], pre[class*="language-"] {
background-color: $color-yaml;
}
.md-div {
code:not([class*="language-"]) {
@extend %code-block;
......@@ -187,4 +217,4 @@ hbr-tag {
clr-header {
background-color: $header-color;
}
\ No newline at end of file
}
src/portal/src/css/dark-theme.scss
View file @ a773115c
......@@ -25,5 +25,12 @@ $color-f2: none;
$color-657b83: none;
$color-fdf6e3: none;
$header-color: hsl(198, 100%, 15%)!important;
$color-yaml: #253c46;
$filter-divider-bg-color: #495865;
$selectBox-option-hover-bg-color-start: #4aaed9;
$selectBox-option-hover-bg-color-end: #0077b8;
$btn-tag-integration-active-bg-color: #4aaed9;
$btn-tag-integration-active-color: #000;
$hbr-result-tip-histogram-inner-bg-color: #21333b;
@import "./common.scss";
src/portal/src/css/light-theme.scss
View file @ a773115c
......@@ -27,5 +27,12 @@ $color-f2: #f2f2f2;
$color-657b83: #657b83;
$color-fdf6e3: #fdf6e3;
$header-color: rgb(0, 74, 112);
$color-yaml: none;
$filter-divider-bg-color: #ccc;
$selectBox-option-hover-bg-color-start: #f5f5f5;
$selectBox-option-hover-bg-color-end: #e8e8e8;
$btn-tag-integration-active-bg-color: #0077b8;
$btn-tag-integration-active-color: #fff;
$hbr-result-tip-histogram-inner-bg-color: #fff;
@import "./common.scss";
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment