Merge pull request #2985 from pengpengshui/master

fix bug about tooltips issues
This commit is contained in:
Steven Zou 2017-08-08 11:04:04 +08:00 committed by GitHub
commit 4f7716d482
3 changed files with 23 additions and 12 deletions

View File

@ -84,9 +84,9 @@ export class ResultTipComponent implements OnInit {
} }
this.translate.get(this.packageText(this.totalPackages)).subscribe((p1: string) => { this.translate.get(this.packageText(this.totalPackages)).subscribe((p1: string) => {
this.translate.get(this.unitText(this.packagesWithVul)).subscribe((vul: string) => { this.translate.get(this.unitText(this.packagesWithVul)).subscribe((vul: string) => {
let messageKey: string = "VULNERABILITY.CHART.TOOLTIPS_TITLE"; let messageKey: string = "VULNERABILITY.CHART.TOOLTIPS_TITLE_SINGULAR";
if (this.packagesWithVul > 1) { if (this.packagesWithVul > 1) {
messageKey = "VULNERABILITY.CHART.TOOLTIPS_TITLE_SINGULAR"; messageKey = "VULNERABILITY.CHART.TOOLTIPS_TITLE";
} }
this.translate.get(messageKey, this.translate.get(messageKey,
{ {

View File

@ -75,6 +75,16 @@ export const SCANNING_STYLES: string = `
margin-top: 3px; margin-top: 3px;
margin-bottom: 3px; margin-bottom: 3px;
} }
.bar-summary-item span:nth-child(1){
width: 30px;
text-align: center;
display: inline-block;
}
.bar-summary-item span:nth-child(2){
width: 28px;
display: inline-block;
}
.option-right { .option-right {
padding-right: 16px; padding-right: 16px;
} }
@ -116,4 +126,5 @@ hr{
.font-weight-600{ .font-weight-600{
font-weight:600; font-weight:600;
} }
`; `;

View File

@ -35,24 +35,24 @@ export const TIP_COMPONENT_HTML: string = `
</div> </div>
<div class="bar-summary bar-tooltip-fon"> <div class="bar-summary bar-tooltip-fon">
<div *ngIf="hasHigh" class="bar-summary-item"> <div *ngIf="hasHigh" class="bar-summary-item">
<clr-icon shape="exclamation-circle" class="is-error" size="24"></clr-icon> <span><clr-icon shape="exclamation-circle" class="is-error" size="24"></clr-icon></span>
<span>{{highCount}} {{'VULNERABILITY.SEVERITY.HIGH' | translate }}</span> <span>{{highCount}}</span><span>{{'VULNERABILITY.SEVERITY.HIGH' | translate }}</span>
</div> </div>
<div *ngIf="hasMedium" class="bar-summary-item"> <div *ngIf="hasMedium" class="bar-summary-item">
<clr-icon *ngIf="hasMedium" shape="exclamation-triangle" class="tip-icon-medium" size="22"></clr-icon> <span><clr-icon *ngIf="hasMedium" shape="exclamation-triangle" class="tip-icon-medium" size="22"></clr-icon></span>
<span>{{mediumCount}} {{'VULNERABILITY.SEVERITY.MEDIUM' | translate }}</span> <span>{{mediumCount}}</span><span>{{'VULNERABILITY.SEVERITY.MEDIUM' | translate }}</span>
</div> </div>
<div *ngIf="hasLow" class="bar-summary-item"> <div *ngIf="hasLow" class="bar-summary-item">
<clr-icon shape="play" class="tip-icon-low rotate-90" size="20"></clr-icon> <span><clr-icon shape="play" class="tip-icon-low rotate-90" size="20"></clr-icon></span>
<span>{{lowCount}} {{'VULNERABILITY.SEVERITY.LOW' | translate }}</span> <span>{{lowCount}}</span><span>{{'VULNERABILITY.SEVERITY.LOW' | translate }}</span>
</div> </div>
<div *ngIf="hasUnknown" class="bar-summary-item"> <div *ngIf="hasUnknown" class="bar-summary-item">
<clr-icon shape="help" size="18" style="margin-left: 3px;"></clr-icon> <span><clr-icon shape="help" size="18"></clr-icon></span>
<span>{{unknownCount}} {{'VULNERABILITY.SEVERITY.UNKNOWN' | translate }}</span> <span>{{unknownCount}}</span><span>{{'VULNERABILITY.SEVERITY.UNKNOWN' | translate }}</span>
</div> </div>
<div *ngIf="hasNone" class="bar-summary-item"> <div *ngIf="hasNone" class="bar-summary-item">
<clr-icon shape="check-circle" class="is-success" size="24"></clr-icon> <span><clr-icon shape="check-circle" class="is-success" size="24"></clr-icon></span>
<span>{{noneCount}} {{'VULNERABILITY.SEVERITY.NONE' | translate }}</span> <span>{{noneCount}}</span><span>{{'VULNERABILITY.SEVERITY.NONE' | translate }}</span>
</div> </div>
</div> </div>
<div> <div>