Merge pull request #6500 from pureshine/svg-format

Change the image in png format to the image in svg format

src/portal/lib/src/shared/shared.const.ts

@@ -92,7 +92,7 @@ export const LabelColor = [
 
 export const RoleMapping = { 'projectAdmin': 'MEMBER.PROJECT_ADMIN', 'developer': 'MEMBER.DEVELOPER', 'guest': 'MEMBER.GUEST' };
 
-export const DefaultHelmIcon = '/images/helm-gray.png';
+export const DefaultHelmIcon = '/images/helm-gray.svg';
 
 export enum Roles {
   PROJECT_ADMIN = 1,

src/portal/src/app/base/base.module.ts

@@ -26,7 +26,6 @@ import { GlobalSearchComponent } from './global-search/global-search.component';
 import { FooterComponent } from './footer/footer.component';
 import { HarborShellComponent } from './harbor-shell/harbor-shell.component';
 import { SearchResultComponent } from './global-search/search-result.component';
-import { StartPageComponent } from './start-page/start.component';
 
 import { SearchTriggerService } from './global-search/search-trigger.service';
 
@@ -46,7 +45,6 @@ import { SearchTriggerService } from './global-search/search-trigger.service';
     FooterComponent,
     HarborShellComponent,
     SearchResultComponent,
-    StartPageComponent
   ],
   exports: [ HarborShellComponent ],
   providers: [SearchTriggerService]

src/portal/src/app/base/navigator/navigator.component.html

@@ -2,7 +2,7 @@
     <div class="branding">
         <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 [src]="'images/harbor-logo.svg'" class="harbor-logo" />
             <img [attr.src]="'static/images/'+customStyle?.headerLogo" *ngIf="customStyle?.headerLogo" style="width: 36px;height: 36px; object-fit: fill;">
             <span class="title">{{customProjectName?.projectName? customProjectName?.projectName:(appTitle | translate)}}</span>
         </a>

src/portal/src/app/base/start-page/start.component.html

@@ -1,29 +0,0 @@
-<!-- Authenticated-->
-<div class="row row-fill-height row-margin" *ngIf="isSessionValid">
-    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
-        <statistics-panel></statistics-panel>
-        <top-repo></top-repo>
-    </div>
-</div>
-
-<!-- Guest -->
-<div class="row row-fill-height" *ngIf="!isSessionValid">
-    <div class="col-xs-12 col-sm-12 col-md-5 col-lg-5 col-xl-5 column-fill-height">
-        <div class="start-card">
-            <div class="card-img my-card-img">
-            </div>
-            <div class="card-block">
-                <h3 class="card-title">Getting Start</h3>
-                <p class="card-text">
-                    {{'START_PAGE.GETTING_START' | translate}}
-                </p>
-            </div>
-            <div class="card-footer my-card-footer">
-                <a href="https://goharbor.io" target="_blank" class="btn btn-sm btn-link">Learn More</a>
-            </div>
-        </div>
-    </div>
-    <div class="col-xs-12 col-sm-12 col-md-7 col-lg-7 col-xl-7">
-        <top-repo></top-repo>
-    </div>
-</div>

src/portal/src/app/base/start-page/start.component.scss

@@ -1,30 +0,0 @@
-.start-card {
-    border-right: 1px solid #cccccc;
-    padding: 24px;
-    background-color: white;
-    height: 100%;
-}
-
-.row-fill-height {
-    height: 100%;
-}
-
-.row-margin {
-    margin-left: 24px;
-}
-
-.column-fill-height {
-    height: 100%;
-}
-
-.my-card-img {
-    background-image: url('../../../images/harbor-logo.png');
-    background-repeat: no-repeat;
-    background-size: contain;
-    height: 160px;
-}
-
-.my-card-footer {
-    float: right;
-    margin-top: 100px;
-}

src/portal/src/app/base/start-page/start.component.ts

@@ -1,33 +0,0 @@
-// Copyright Project Harbor Authors
-//
-// Licensed under the Apache License, Version 2.0 (the "License");
-// you may not use this file except in compliance with the License.
-// You may obtain a copy of the License at
-//
-//    http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// See the License for the specific language governing permissions and
-// limitations under the License.
-import { Component, OnInit } from '@angular/core';
-
-import { SessionService } from '../../shared/session.service';
-
-@Component({
-    selector: 'start-page',
-    templateUrl: "start.component.html",
-    styleUrls: ['start.component.scss']
-})
-export class StartPageComponent implements OnInit {
-    isSessionValid: boolean = false;
-
-    constructor(
-        private session: SessionService
-    ) { }
-
-    ngOnInit(): void {
-        this.isSessionValid = this.session.getCurrentUser() != null;
-    }
-}

src/portal/src/app/shared/about-dialog/about-dialog.component.html

@@ -1,7 +1,7 @@
 <clr-modal [(clrModalOpen)]="opened" [clrModalClosable]="false" [clrModalStaticBackdrop]="false">
     <div class="modal-body dialog-body">
         <div class="harbor-logo-black">
-            <img [src]="'images/harbor-black-logo.png'">
+            <img [src]="'images/harbor-logo.svg'" class="harbor-icon">
         </div>
         <div class="content">
             <div>{{customName?.projectName? customName?.projectName : ('APP_TITLE.HARBOR' | translate)}}</div>

src/portal/src/app/shared/about-dialog/about-dialog.component.scss

@@ -15,4 +15,10 @@
 
 .content {
     margin:0 10px 10px 10px;
+}
+
+.harbor-icon {
+    transform: translateX(-100%);
+    width: 56px;
+    filter: drop-shadow(rgb(0, 0, 0) 58px 2px);
 }

src/portal/src/images/helm-gray.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 121.02 126.41"><defs><style>.ed7893be-f72e-4d49-983e-3ddcacf196ab{fill:#a2a2a2;}</style></defs><path class="ed7893be-f72e-4d49-983e-3ddcacf196ab" d="M453.41,121.78c-.91-.64-2-2.73-2.61-5.06a37.72,37.72,0,0,1-.38-10.23,12,12,0,0,0,.17-1.89,16.89,16.89,0,0,0-1.89-.29,46.62,46.62,0,0,1-16.5-5.26,13.83,13.83,0,0,0-2-1,5,5,0,0,0-1.12,1.65c-2.2,4.23-6,8.42-8.94,9.79a4.18,4.18,0,0,1-3.14.27c-1-.53-1.28-2.63-.69-5a29.48,29.48,0,0,1,3.35-6.89,38.1,38.1,0,0,1,2.55-3.26l1.5-1.68-.78-.74c-2.06-2-5.92-6.51-5.92-7a61.13,61.13,0,0,1,5.65-3.92c.2-.06.67.41,1.31,1.29a45.53,45.53,0,0,0,7.25,7.17,37.93,37.93,0,0,0,52.57-7,6.94,6.94,0,0,1,1.45-1.56A55.26,55.26,0,0,1,490.88,85c.16.26-2.11,3.22-4.06,5.26a16.35,16.35,0,0,0-1.68,1.94,15.29,15.29,0,0,0,1.62,1.88c2.81,3,5.57,7.59,6.34,10.61.59,2.32.3,4.42-.69,5a3.58,3.58,0,0,1-1.26.2c-3,0-8-4.87-11-10.68a9.12,9.12,0,0,0-1.23-2,6.61,6.61,0,0,0-1.3.72A46.94,46.94,0,0,1,461.11,104a13.84,13.84,0,0,0-2.38.52c-.15.12-.13.68.07,1.94a37.74,37.74,0,0,1-.26,9.73,11,11,0,0,1-2.19,5c-1.07,1.17-1.91,1.34-3,.6ZM393.88,76.39c0-.14-.07-7.52,0-16.4l.06-16.16h8.46l.06,6c0,4.45.11,6,.3,6.1a39,39,0,0,0,4.71.17c3.47,0,4.51-.06,4.68-.27s.24-2.21.28-6.11V43.88h8.47V76.59h-8.47V70.35c0-4.2-.13-6.33-.28-6.51s-1.21-.27-4.71-.27-4.53.06-4.71.27-.24,2.31-.28,6.51v6.24l-4.19.06C394.92,76.64,394,76.59,393.88,76.39Zm34.26,0c0-.14-.07-7.52,0-16.41V43.83h21l.06,3.58V51H436.8l-.06,2.41c0,1.79,0,2.45.2,2.57a47.92,47.92,0,0,0,5.36.17h5.09l-.06,3.58v3.59l-5.24.1-5.24.1v5.65l6.45.1,6.45.1v7.07l-10.74,0c-8.48,0-10.76,0-10.84-.2Zm28.22,0c0-.14-.07-7.52,0-16.41V43.83h8.46l.11,12.72.1,12.72,6.14.1,6.15.1v7.07l-10.43,0c-8.25,0-10.46,0-10.54-.2Zm26.81,0c0-.14-.07-7.52,0-16.4l.06-16.16h4.43a38.16,38.16,0,0,1,4.66.11c.3.2,4.77,12.39,5.76,15.69s.95,3.23,1.18,3a21.38,21.38,0,0,0,1.06-3c1-3.41,5.17-15.23,5.44-15.59.15-.19,1.24-.24,4.65-.2h4.46V76.55l-3.77.06-3.78,0-.13-.53c-.28-1.11.09-12.8.51-16.13.67-5.26.56-5.34-1-.81-1.69,4.89-5,13.89-5.36,14.38S500.9,74,499,74c-1.43,0-2.15-.08-2.29-.26s-4.36-11.51-5.48-14.93c-.8-2.42-1.23-3.29-1.22-2.44,0,.2.19,1.86.42,3.7.41,3.43.78,14.93.51,16l-.13.53H487c-2.8,0-3.76-.06-3.83-.25Zm2.66-37.29a39.91,39.91,0,0,0-4.48-5.64,37.5,37.5,0,0,0-20-11.07c-2.31-.5-2.92-.54-7.16-.55-5,0-6.09.11-10,1.12A37.22,37.22,0,0,0,430,30.22a46.3,46.3,0,0,0-6.64,7c-.86,1.19-1.28,1.64-1.51,1.55a43.94,43.94,0,0,1-5.65-3.8c0-.48,3.32-4.63,5.57-7l2.33-2.43-1.54-1.67c-2.81-3.05-5.51-7.59-6.26-10.54-.59-2.33-.3-4.42.69-5a3.37,3.37,0,0,1,1.26-.21c3,0,8.05,4.87,11,10.68a10.93,10.93,0,0,0,1.2,2,13.21,13.21,0,0,0,1.75-.91,47,47,0,0,1,16.65-5.27,8.92,8.92,0,0,0,1.78-.28c.18-.11.16-.65-.1-2.21a35.31,35.31,0,0,1,.28-10.81c1-3.7,2.55-5.77,4.14-5.47s2.93,2.71,3.68,6.2a40.46,40.46,0,0,1,0,10.77,4.56,4.56,0,0,0-.2,1.56,13,13,0,0,0,2.15.45,45,45,0,0,1,17.27,6.36c.4.24.79.36.85.26s.61-1.19,1.22-2.41c2.36-4.73,6.17-9,9.28-10.48a4.18,4.18,0,0,1,3.14-.27c1,.53,1.28,2.62.69,5a29.92,29.92,0,0,1-3.57,7.21,33.88,33.88,0,0,1-3.13,3.74l-1.87,1.89,1.84,2A59.77,59.77,0,0,1,492,35.46c.27.53.28.67,0,.88a52.14,52.14,0,0,1-5.68,3.34c-.13,0-.4-.27-.6-.6Z" transform="translate(-393.85 4.18)"/></svg>