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

Fix style issues on chart detail values page

Browse Source 
1. Fix margin of title
2. Fix icon size to 24px
This commit is contained in:
Deng, Qian 2018-08-06 20:33:45 +08:00
parent d1a205581d
commit 637c43bef6
4 changed files with 22 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/ui_ng/lib/src/helm-chart/chart-detail/chart-detail-summary.component.html
View File

@ -18,7 +18,7 @@
<tbody>
<tr>
<td class="left">{{'HELM_CHART.HOME' | translate }}</td>
<td class="left text-wrappe">
<td class="left text-wrapper">
<a href="{{summary.home}}">{{summary.home}}</a>
</td>
</tr>

22
src/ui_ng/lib/src/helm-chart/chart-detail/chart-detail-value.component.html
View File

@ -1,21 +1,22 @@
<div class="row flex-items-xs-right">
<div class="swichy-container">
<div class="row flex-items-xs-between values-header">
<div *ngIf="valueMode" class="title-container">
<label>{{'HELM_CHART.SHOW_KV' | translate }}</label>
</div>
<div *ngIf="!valueMode" class="title-container">
<label>{{'HELM_CHART.SHOW_YAML' | translate }}</label>
</div>
<div class="switch-container">
<span class="card-btn" (click)="showYamlFile(false)" (mouseenter)="mouseEnter('value') " (mouseleave)="mouseLeave('value')">
<clr-icon size="36" shape="view-list" title='list values'
[ngClass]="{'is-highlight': isValueMode || isHovering('value') }" ></clr-icon>
<clr-icon size="24" shape="view-list" title='list values' [ngClass]="{'is-highlight': isValueMode || isHovering('value') }"></clr-icon>
</span>
<span class="list-btn" (click)="showYamlFile(true)" (mouseenter)="mouseEnter('yaml') " (mouseleave)="mouseLeave('yaml')">
<clr-icon size="36" shape="file" title="yaml file"
[ngClass]="{'is-highlight': !isValueMode || isHovering('yaml') }"></clr-icon>
<clr-icon size="24" shape="file" title="yaml file" [ngClass]="{'is-highlight': !isValueMode || isHovering('yaml') }"></clr-icon>
</span>
</div>
</div>
<div class="row value-container">
<div class="col-xs-8" *ngIf="valueMode">
<div>
<label>{{'HELM_CHART.SHOW_KV' | translate }}</label>
</div>
<table class="table">
<tbody>
<tr *ngFor="let key of objKeys(values)">
@ -26,9 +27,6 @@
</table>
</div>
<div class="col-xs-8" *ngIf="!valueMode">
<div>
<label>{{'HELM_CHART.SHOW_YAML' | translate }}</label>
</div>
<div class="yaml-container" [innerHTML]="yaml | language : 'yaml' | markdown"></div>
</div>
</div>

13
src/ui_ng/lib/src/helm-chart/chart-detail/chart-detail-value.component.scss
View File

@ -4,11 +4,18 @@
}
}
.swichy-container {
margin-top: 3px;
margin-right: 15px;
.values-header {
margin-top: 12px;
.title-container {
margin-left: 15px;
}
.switch-container {
margin-right: 15px;
}
}
pre {
max-height: max-content;
padding-left: 21px;

2
src/ui_ng/lib/src/helm-chart/versions/helm-chart-version.component.html
View File

@ -60,7 +60,7 @@
<span class="list-img">
<img [src]="v.icon ?v.icon:chartDefaultIcon" (error)="getDefaultIcon(v);" />
</span>
<a href="#" (click)="onVersionClick(v)">{{ v.version }}</a>
<a href="javascript:void(0)" (click)="onVersionClick(v)">{{ v.version }}</a>
</clr-dg-cell>
<clr-dg-cell>{{ v.engine }}</clr-dg-cell>
<clr-dg-cell>{{ getMaintainerString(v.maintainers) }}</clr-dg-cell>