Fix the bug that markdown icon does not display on the page

Signed-off-by: FangyuanCheng <fangyuanc@vmware.com>

src/portal/lib/src/repository/repository.component.html

@@ -24,7 +24,9 @@
       <form #repoInfoForm="ngForm">
         <div id="info-edit-button">
           <button class="btn btn-sm" [disabled]="editing || !hasProjectAdminRole " (click)="editInfo()" ><clr-icon shape="pencil" size="16"></clr-icon>&nbsp;{{'BUTTON.EDIT' | translate}}</button>
-          <img [src]="'../../../src/images/markdown.png'" class="markdown">
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 1024" preserveAspectRatio="xMinYMin" class="markdown">
+              <path d="M950.154 192H73.846C33.127 192 0 225.12699999999995 0 265.846v492.308C0 798.875 33.127 832 73.846 832h876.308c40.721 0 73.846-33.125 73.846-73.846V265.846C1024 225.12699999999995 990.875 192 950.154 192zM576 703.875L448 704V512l-96 123.077L256 512v192H128V320h128l96 128 96-128 128-0.125V703.875zM767.091 735.875L608 512h96V320h128v192h96L767.091 735.875z"/>
+            </svg>
           <span>{{ 'REPOSITORY.MARKDOWN' | translate }}</span>
         </div>
         <div *ngIf="!editing">

src/portal/lib/src/repository/repository.component.scss

@@ -49,9 +49,13 @@
   margin-bottom: 12px;
   font-size: 12px;
   .markdown {
+    position: relative;
     width: 20px;
+    height: 20px;
     margin-right: 10px;
     margin-left: 10px;
+    top: 6px;
+    fill: gray;
   }
 }