Merged in task/dspace-cris-2023_02_x/DSC-1513 (pull request DSpace#1703)

[DSC-1513] Improve buttons appearance

Approved-by: Francesco Molinaro

Author: alisaismailati

src/app/access-control/bulk-access/bulk-access.component.html

@@ -7,9 +7,11 @@
 
   <div class="d-flex justify-content-end">
     <button class="btn btn-outline-primary mr-3" (click)="reset()">
+      <i class="fas fa-times mr-1"></i>
       {{ 'access-control-cancel' | translate }}
     </button>
     <button class="btn btn-primary" [disabled]="!canExport()" (click)="submit()">
+      <i class="fas fa-cogs mr-1"></i>
       {{ 'access-control-execute' | translate }}
     </button>
   </div>

src/app/admin/admin-edit-user-agreement/admin-edit-user-agreement.component.html

@@ -8,8 +8,8 @@ <h2>{{'admin.edit-user-agreement.header' | translate}}</h2>
   <div class="col-md">
     <button class="btn btn-primary float-right m-2" (click)="$event.preventDefault();confirmEdit(content)" >
       <span>
-        <i class="fas fa-edit"></i>
-        &nbsp;{{ 'admin.edit-user-agreement.save-button' | translate }}
+        <i class="fas fa-save mr-1"></i>
+        {{ 'admin.edit-user-agreement.save-button' | translate }}
       </span>
     </button>
   </div>

src/app/admin/admin-import-batch-page/batch-import-page.component.html

@@ -28,7 +28,7 @@ <h2 id="header">{{'admin.batch-import.page.header' | translate}}</h2>
   <small class="form-text text-muted">
     {{'admin.batch-import.page.toggle.help' | translate}}
   </small>
-  
+
 
   <ds-file-dropzone-no-uploader
     *ngIf="isUpload"
@@ -47,6 +47,8 @@ <h2 id="header">{{'admin.batch-import.page.header' | translate}}</h2>
     <button class="btn btn-secondary" id="backButton"
             (click)="this.onReturn();">{{'admin.metadata-import.page.button.return' | translate}}</button>
     <button class="btn btn-primary" id="proceedButton"
-            (click)="this.importMetadata();">{{'admin.metadata-import.page.button.proceed' | translate}}</button>
+            (click)="this.importMetadata();">
+            <i class="fas fa-arrow-right mr-1"></i>
+            {{'admin.metadata-import.page.button.proceed' | translate}}</button>
   </div>
 </div>

src/app/admin/admin-import-metadata-page/metadata-import-page.component.html

@@ -23,6 +23,9 @@ <h2 id="header">{{'admin.metadata-import.page.header' | translate}}</h2>
     <button class="btn btn-secondary" id="backButton"
             (click)="this.onReturn();">{{'admin.metadata-import.page.button.return' | translate}}</button>
     <button class="btn btn-primary" id="proceedButton"
-            (click)="this.importMetadata();">{{'admin.metadata-import.page.button.proceed' | translate}}</button>
+            (click)="this.importMetadata();">
+            <i class="fas fa-arrow-right mr-1"></i>
+            {{'admin.metadata-import.page.button.proceed' | translate}}
+    </button>
   </div>
 </div>

src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.html

@@ -5,7 +5,10 @@
       <h2 id="header" class="border-bottom pb-2 ">{{'admin.registries.bitstream-formats.head' | translate}}</h2>
 
       <p id="description">{{'admin.registries.bitstream-formats.description' | translate}}</p>
-      <p id="create-new" class="mb-2"><a [routerLink]="'add'" class="btn btn-success">{{'admin.registries.bitstream-formats.create.new' | translate}}</a></p>
+      <p id="create-new" class="mb-2"><a [routerLink]="'add'" class="btn btn-success">
+        <i class="fas fa-plus mr-1"></i>
+        {{'admin.registries.bitstream-formats.create.new' | translate}}</a>
+      </p>
 
 
       <ds-pagination
@@ -50,8 +53,14 @@ <h2 id="header" class="border-bottom pb-2 ">{{'admin.registries.bitstream-format
       </div>
 
       <div>
-        <button *ngIf="(bitstreamFormats | async)?.payload?.page?.length > 0" class="btn btn-primary deselect" (click)="deselectAll()">{{'admin.registries.bitstream-formats.table.deselect-all' | translate}}</button>
-        <button *ngIf="(bitstreamFormats | async)?.payload?.page?.length > 0" type="submit" class="btn btn-danger float-right" (click)="deleteFormats()">{{'admin.registries.bitstream-formats.table.delete' | translate}}</button>
+        <button *ngIf="(bitstreamFormats | async)?.payload?.page?.length > 0" class="btn btn-primary deselect" (click)="deselectAll()">
+          <i class="far fa-minus-square mr-1"></i>
+          {{'admin.registries.bitstream-formats.table.deselect-all' | translate}}
+        </button>
+        <button *ngIf="(bitstreamFormats | async)?.payload?.page?.length > 0" type="submit" class="btn btn-danger float-right" (click)="deleteFormats()">
+          <i class="fas fa-trash mr-1"></i>
+          {{'admin.registries.bitstream-formats.table.delete' | translate}}
+        </button>
       </div>
     </div>
   </div>

src/app/admin/edit-cms-metadata/edit-cms-metadata.component.html

@@ -10,6 +10,7 @@ <h3 class="mb-4">{{'menu.section.cms.edit.metadata.head' | translate}}</h3>
       </select>
       <span class="input-group-btn">
         <button id="edit-metadata-btn" class="btn btn-primary" (click)="editSelectedMetadata()" [disabled]="!selectedMetadata">
+          <i class="fas fa-edit mr-1"></i>
           {{'admin.edit-cms-metadata.edit-button' | translate}}
         </button>
     </span>
@@ -39,14 +40,14 @@ <h2 class=" mb-5">{{'admin.edit-cms-metadata.title' | translate}} '{{selectedMet
     <div class="col-md">
       <button id="save-metadata-btn" class="btn btn-primary float-right m-2" (click)="saveMetadata()">
           <span>
-            <i class="fas fa-edit"></i>
-            &nbsp;{{ 'admin.edit-cms-metadata.save-button' | translate }}
+            <i class="fas fa-save mr-1"></i>
+            {{ 'admin.edit-cms-metadata.save-button' | translate }}
           </span>
       </button>
       <button id="back-metadata-btn" class="btn btn-outline-secondary float-right m-2" (click)="back()">
           <span>
-            <i class="fas fa-arrow-left"></i>
-            &nbsp;{{ 'admin.edit-cms-metadata.back-button' | translate }}
+            <i class="fas fa-arrow-left mr-1"></i>
+            {{ 'admin.edit-cms-metadata.back-button' | translate }}
           </span>
       </button>
     </div>

src/app/curation-form/curation-form.component.html

@@ -15,6 +15,9 @@
                 <small class="text-muted">{{'curation.form.handle.hint' |translate }}</small>
             </div>
         </div>
-        <button class="btn btn-default btn-primary" type="submit">{{'curation.form.submit' |translate }}</button>
+        <button class="btn btn-default btn-primary" type="submit">
+          <i class="fas fa-play mr-1"></i>
+          {{'curation.form.submit' |translate }}
+        </button>
     </div>
 </form>

src/app/shared/explore/section-component/search-section/search-section.component.html

@@ -20,8 +20,14 @@ <h2 *ngIf="searchSection.displayTitle">{{ 'explore.search-section.' + sectionId
             </div>
         </div>
         <div class="d-flex justify-content-end" style="gap: 20px;">
-          <button type="button" id="resetButton" class="btn btn-outline-primary float-right" (click)="onReset()">{{'explore.search-section.reset-button' | translate}}</button>
-          <button type="submit" id="searchButton" class="btn btn-primary float-right">{{'explore.search-section.search-button' | translate}}</button>
+          <button type="button" id="resetButton" class="btn btn-outline-primary float-right" (click)="onReset()">
+            <i class="fas fa-redo mr-1"></i>
+            {{'explore.search-section.reset-button' | translate}}
+          </button>
+          <button type="submit" id="searchButton" class="btn btn-primary float-right">
+            <i class="fas fa-search mr-1"></i>
+            {{'explore.search-section.search-button' | translate}}
+          </button>
         </div>
     </form>
 

src/app/system-wide-alert/alert-form/system-wide-alert-form.component.html

@@ -103,11 +103,12 @@ <h2 id="header">{{'system-wide-alert.form.header' | translate}}</h2>
 
     <div class="btn-row float-right space-children-mr mt-2">
         <button (click)="back()"
-                class="btn btn-outline-secondary"><i
-                class="fas fa-arrow-left"></i> {{'system-wide-alert.form.cancel' | translate}}</button>
+                class="btn btn-outline-secondary">
+                <i class="fas fa-times mr-1"></i>
+                {{'system-wide-alert.form.cancel' | translate}}</button>
         <button class="btn btn-primary" [disabled]="alertForm.invalid"
                 (click)="save()">
-            <i class="fa fa-save"></i> {{ 'system-wide-alert.form.save' | translate}}
+            <i class="fa fa-save mr-1"></i> {{ 'system-wide-alert.form.save' | translate}}
         </button>
     </div>