Design of button to disting multiple to only one

Xhelliom · Aug 23, 2020 · b183540 · b183540
1 parent e06836e
commit b183540
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 7 deletions.
diff --git a/src/app/header/header-desktop/header-desktop.component.css b/src/app/header/header-desktop/header-desktop.component.css
@@ -46,6 +46,10 @@ button#sing-in mat-icon {
   z-index: 100;
 }
 
+#refresh{
+  margin-left: 25px;
+}
+
 #upload-picture {
   margin-right: 20px;
 }

diff --git a/src/app/header/header-desktop/header-desktop.component.html b/src/app/header/header-desktop/header-desktop.component.html
@@ -1,19 +1,25 @@
 <div class="fixed-wrapper">
+      <!-- Logo and refresh-->
   <mat-toolbar>
     <div id="brand">
       <a routerLink="" (click)="homePressed.emit()">
         <span>Amazing Pictures</span>
       </a>
+      <a mat-icon-button routerLink="" id="refresh" (click)="homePressed.emit()">
+        <mat-icon>refresh</mat-icon>
+      </a>
     </div>
+        <!-- Search bar-->
     <div id="search">
       <app-search-box [homePressed]="homePressed"></app-search-box>
     </div>
+    <!-- button profile and add pictures-->
     <div class="align-right">
-      <button *ngIf="accountService.user" mat-icon-button id="upload-picture" (click)="selectPicture()">
-        <mat-icon>add_photo_alternate</mat-icon>
+      <button *ngIf="accountService.user" mat-raised-button color="primary" id="upload-picture" (click)="selectPicture()">
+        <mat-icon>add_photo_alternate</mat-icon> Une image
       </button>
-      <a *ngIf="accountService.user" class="button" mat-icon-button id="upload-mutiple-picture" routerLink="multiple-upload">
-        <mat-icon>playlist_add</mat-icon>
+      <a *ngIf="accountService.user" class="button" mat-raised-button color="primary" id="upload-mutiple-picture" routerLink="multiple-upload">
+        <mat-icon>playlist_add</mat-icon> Plusieurs images
       </a>
       <input #pictureInput id="picture-input" type="file" aria-label="Upload a profile picture"
              accept="image/png, image/jpeg" (change)="uploadPicture($event)">

diff --git a/src/app/header/header-mobile/header-mobile.component.css b/src/app/header/header-mobile/header-mobile.component.css
@@ -80,7 +80,6 @@ mat-progress-bar {
   z-index: 100;
 }
 
-
 #picture-input {
   display: none;
 }
diff --git a/src/app/header/header-mobile/header-mobile.component.html b/src/app/header/header-mobile/header-mobile.component.html
@@ -23,11 +23,13 @@
   </mat-menu>
   <div *ngIf="accountService.user === undefined" id="profile-picture-placeholder"></div>
 </mat-card>
-<button *ngIf="accountService.user" mat-fab id="upload-picture" (click)="selectPicture()">
+<button *ngIf="accountService.user" mat-fab  id="upload-picture" (click)="selectPicture()">
   <mat-icon>add_photo_alternate</mat-icon>
 </button>
+
 <a *ngIf="accountService.user" mat-fab id="upload-mutiple-picture" class="button" routerLink="multiple-upload">
-  <mat-icon>playlist_add</mat-icon>
+multiple
 </a>
+
 <input #pictureInput id="picture-input" type="file" aria-label="Upload a profile picture"
        accept="image/png, image/jpeg" (change)="uploadPicture($event)">