From 36072aaaf1a71d85814b1aa9e2a094da18d104c3 Mon Sep 17 00:00:00 2001
From: tito <tito.arrigo@icloud.com>
Date: Tue, 9 May 2023 14:25:08 +0200
Subject: [PATCH] =?UTF-8?q?nuova=20grafica=3F=F0=9F=A4=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/app.component.html                    | 47 ++++++++++---------
 src/app/app.component.ts                      |  2 +
 .../component/detail/detail.component.html    |  6 +--
 src/app/component/list/list.component.html    |  8 ++--
 src/app/component/login/login.component.css   | 10 ++++
 src/app/component/login/login.component.html  | 16 +++----
 src/app/home/home.component.css               |  4 +-
 src/app/home/home.component.html              | 42 +++++++++--------
 8 files changed, 76 insertions(+), 59 deletions(-)

diff --git a/src/app/app.component.html b/src/app/app.component.html
index b1ee570..cbf7d16 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,26 +1,27 @@
-<div class="button-container sticky z-50 flex gap-1 justify-end p-2">
-  <div class="dropdown dropdown-hover" id="translate">
-    <label tabindex="0" class="btn bg-black border-neutral text-base-100 hover:bg-neutral hover:text-base-100"
-           id="translateLabel">{{homeTranslations.translate}}</label>
-    <ul tabindex="0" class="dropdown-content menu mt-1 shadow rounded-box w-52 bg-base-100" id="translateUl">
-      <li (click)="switchLanguage('DE')"><a>DE</a></li>
-      <li (click)="switchLanguage('FR')"><a>FR</a></li>
-      <li (click)="switchLanguage('IT')"><a>IT</a></li>
-      <li (click)="switchLanguage('EN')"><a>EN</a></li>
-    </ul>
+<div class="button-container sticky z-40 flex justify-end p-2">
+  <div class="bg-white p-2 rounded-sm flex gap-1 shadow-md">
+    <div class="dropdown dropdown-hover" id="translate">
+      <label tabindex="0" class="btn bg-black border-neutral text-base-100 hover:bg-neutral hover:text-base-100 rounded-sm"
+             id="translateLabel">{{homeTranslations.translate}}</label>
+      <ul tabindex="0" class="dropdown-content menu mt-3 shadow-2xl rounded-sm w-52 bg-base-100" id="translateUl">
+        <li (click)="switchLanguage('DE')"><a>DE</a></li>
+        <li (click)="switchLanguage('FR')"><a>FR</a></li>
+        <li (click)="switchLanguage('IT')"><a>IT</a></li>
+        <li (click)="switchLanguage('EN')"><a>EN</a></li>
+      </ul>
+    </div>
+    <button (click)="goHome()"
+            class="btn gap-2 border-primary bg-primary text-secondary hover:bg-secondary hover:text-primary hover:border-primary rounded-sm">
+      <br>
+      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
+           class="w-6 h-6">
+        <path stroke-linecap="round" stroke-linejoin="round"
+              d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25"/>
+      </svg>
+      <br>
+
+    </button>
+    <button (click)="clearAllCookies()" class="btn bg-black text-base-100 hover:btn-error rounded-sm" id="logout">Logout</button>
   </div>
-  <button (click)="goHome()"
-          class="btn gap-2 border-primary bg-primary text-secondary hover:bg-secondary hover:text-primary hover:border-primary">
-    <br>
-    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
-         class="w-6 h-6">
-      <path stroke-linecap="round" stroke-linejoin="round"
-            d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25"/>
-    </svg>
-    <br>
-
-  </button>
-  <button (click)="clearAllCookies()" class="btn btn-active hover:btn-error" id="logout">Logout</button>
-
 </div>
 <router-outlet></router-outlet>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 244efd3..8b59164 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -105,4 +105,6 @@ export class AppComponent implements OnInit {
   goHome() {
     this.router.navigate(['/home']);
   }
+
+
 }
diff --git a/src/app/component/detail/detail.component.html b/src/app/component/detail/detail.component.html
index 8367a70..2fa07e4 100644
--- a/src/app/component/detail/detail.component.html
+++ b/src/app/component/detail/detail.component.html
@@ -54,12 +54,12 @@
   <input type="checkbox" id="my-modal-6" class="modal-toggle" #myModal/>
 
   <div class="modal modal-bottom sm:modal-middle" *ngIf="img">
-    <div class="modal-box">
+    <div class="modal-box rounded-sm">
       <h3 class="font-bold text-lg">Congratulations you have
         discovred {{ waypointInfo?.name ? waypointInfo.name : '' }}!</h3>
       <img class="xl:max-w-md max-h-screen py-4 m-auto" [src]="img" *ngIf="img">
       <div class="modal-action">
-        <button for="my-modal-6" class="btn bg-white hover:bg-blue-400" (click)="downloadImage()">
+        <button for="my-modal-6" class="btn bg-white hover:bg-blue-400 rounded-sm" (click)="downloadImage()">
           <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
                width="17.334" height="23.4863">
             <g>
@@ -68,7 +68,7 @@
             </g>
           </svg>
         </button>
-        <button class="btn btn-primary" (click)="closeModal()">OK</button>
+        <button class="btn btn-primary rounded-sm" (click)="closeModal()">OK</button>
       </div>
     </div>
   </div>
diff --git a/src/app/component/list/list.component.html b/src/app/component/list/list.component.html
index f366d70..7b2957e 100644
--- a/src/app/component/list/list.component.html
+++ b/src/app/component/list/list.component.html
@@ -18,9 +18,11 @@
 </div>
 
 <div *ngIf="!isNear && location && waypoints" class="container">
-  <h1>
-    {{location.location}}
-  </h1>
+  <div class="flex-row flex-nowrap">
+    <h1>
+      {{location.location}}
+    </h1>
+  </div>
   <div class="container2">
     <div class="left">
       <div *ngFor="let waypoint of waypoints, let i = index" class="row">
diff --git a/src/app/component/login/login.component.css b/src/app/component/login/login.component.css
index e69de29..3572874 100644
--- a/src/app/component/login/login.component.css
+++ b/src/app/component/login/login.component.css
@@ -0,0 +1,10 @@
+.bg-image {
+  padding-top: 15%;
+  background-image: url('src/assets/img/mountains.png');
+  background-size: cover;
+  background-repeat: no-repeat;
+  background-position: center center;
+  height: 94vh;
+  display: flex;
+  flex-direction: column;
+}
diff --git a/src/app/component/login/login.component.html b/src/app/component/login/login.component.html
index 8654f24..83abf01 100644
--- a/src/app/component/login/login.component.html
+++ b/src/app/component/login/login.component.html
@@ -1,7 +1,7 @@
 <div class="h-screen w-screen flex items-center justify-center">
   <div class="max-w-md">
 
-    <div class="bg-white px-6 py-8 rounded-lg shadow-md w-[400px]">
+    <div class="bg-white px-6 py-8 rounded-md shadow-2xl w-[400px]">
       <div style="padding-bottom: 30px" *ngIf="errorLogin || errorCreateUser">
         <div class="alert alert-error shadow-lg">
           <div>
@@ -19,24 +19,24 @@
       <h2 *ngIf="login" class="text-center text-2xl font-bold mb-8">{{ loginTranslation.login }}</h2>
       <h2 *ngIf="!login" class="text-center text-2xl font-bold mb-8">{{ loginTranslation.register }}</h2>
 
-      <form (submit)="submit()">
+      <form (submit)="submit()" class="rounded-sm">
 
         <div class="mb-4">
           <label for="email" class="block text-gray-700 font-bold mb-2">{{ loginTranslation.register }}:</label>
           <input type="text" id="email" name="email" placeholder="{{ loginTranslation.usernamePlaceholder }}"
-                 class="w-full px-4 py-2 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-600 focus:border-transparent"
+                 class="w-full px-4 py-2 rounded-sm shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-600 focus:border-transparent"
                  [(ngModel)]="newUser.username">
         </div>
 
         <div class="mb-4">
           <label for="password" class="block text-gray-700 font-bold mb-2">{{ loginTranslation.login }}:</label>
           <input type="password" id="password" name="password" placeholder="{{ loginTranslation.passwordPlaceholder }}"
-                 class="w-full px-4 py-2 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-600 focus:border-transparent"
+                 class="w-full px-4 py-2 rounded-sm shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-600 focus:border-transparent"
                  [(ngModel)]="newUser.password">
         </div>
 
         <div class="mb-4">
-          <button type="submit" class="btn gap-2 border-primary bg-primary text-secondary hover:bg-secondary hover:text-primary hover:border-primary py-2 w-full">
+          <button type="submit" class="btn gap-2 border-primary bg-primary text-secondary hover:bg-secondary hover:text-primary hover:border-primary py-2 w-full rounded-sm">
             <span *ngIf="login">{{ loginTranslation.login }}</span>
             <span *ngIf="!login">{{ loginTranslation.register }}</span>
           </button>
@@ -45,9 +45,9 @@
       </form>
 
 
-      <a (click)="switch()">
-        <button class="btn-link" *ngIf="login">{{ loginTranslation.register }}</button>
-        <button  class="btn-link" *ngIf="!login">{{ loginTranslation.login }}</button>
+      <a (click)="switch()" class="">
+        <button class="btn-link no-underline" *ngIf="login">{{ loginTranslation.register }}</button>
+        <button  class="btn-link no-underline" *ngIf="!login">{{ loginTranslation.login }}</button>
       </a>
 
     </div>
diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css
index e2615cf..791acce 100644
--- a/src/app/home/home.component.css
+++ b/src/app/home/home.component.css
@@ -4,7 +4,7 @@
   flex-direction: column;
 }
 
-input {
+/*input {
   display: flex;
   justify-content: center;
   align-items: center;
@@ -30,7 +30,7 @@ input {
   align-items: center;
   align-content: center;
   gap: 20px;
-}
+}*/
 
 .bg-image {
   padding-top: 15%;
diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html
index 55f182e..3700efd 100644
--- a/src/app/home/home.component.html
+++ b/src/app/home/home.component.html
@@ -1,7 +1,8 @@
 <div [ngClass]="{'background-color': backgroundColor}">
 
-  <div class="alert alert-warning shadow-lg" *ngIf="allert" id="alert">
-    <div>
+  <div class="p-2 mt-2 absolute w-screen h-screen pointer-events-none top-0 z-50">
+    <div class="alert alert-warning shadow-lg flex justify-end gap-1 rounded-sm align-middle w-full" *ngIf="allert"
+         id="alert">
       <svg xmlns="http://www.w3.org/2000/svg" class="stroke-current flex-shrink-0 h-6 w-6" fill="none"
            viewBox="0 0 24 24">
         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
@@ -13,17 +14,17 @@
 
   <div class="bg-image">
 
-    <div class="search">
+    <div class="search flex">
 
-      <div class="inputElements">
+      <div class="inputElements flex justify-center">
         <input #myInput type="text" [(ngModel)]="luogoSelezionato" (keyup)="cercaLuogo(myInput.value)"
                (keydown)="selezionaSuggerimento($event)" placeholder="{{translations.searchPlaceholder}}"
-               class="input input-bordered input-primary btn-wide">
+               class="input input-bordered focus:outline-none shadow-lg  input-primary btn-wide rounded-sm">
 
         <button
-          class="btn gap-2 border-primary bg-primary text-secondary hover:bg-secondary hover:text-primary hover:border-primary"
+          class="btn gap-2 border-primary bg-primary text-secondary hover:bg-secondary hover:text-primary hover:border-primary rounded-sm shadow-2xl"
           (click)="onSearch()">
-          {{translations.searchButton}}
+          <!--          {{translations.searchButton}}-->
           <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
             <path
               d="M18.125,15.804l-4.038-4.037c0.675-1.079,1.012-2.308,1.01-3.534C15.089,4.62,12.199,1.75,8.584,1.75C4.815,1.75,1.982,4.726,2,8.286c0.021,3.577,2.908,6.549,6.578,6.549c1.241,0,2.417-0.347,3.44-0.985l4.032,4.026c0.167,0.166,0.43,0.166,0.596,0l1.479-1.478C18.292,16.234,18.292,15.968,18.125,15.804 M8.578,13.99c-3.198,0-5.716-2.593-5.733-5.71c-0.017-3.084,2.438-5.686,5.74-5.686c3.197,0,5.625,2.493,5.64,5.624C14.242,11.548,11.621,13.99,8.578,13.99 M16.349,16.981l-3.637-3.635c0.131-0.11,0.721-0.695,0.876-0.884l3.642,3.639L16.349,16.981z"></path>
@@ -31,20 +32,21 @@
         </button>
 
       </div>
+      <ng-container *ngIf="locationsPopup | async as locations;">
+        <ul *ngIf="locations.length > 0" class="menu bg-base-200 p-2 m-2 rounded-sm shadow-lg z-50" id="list"
+            [style.width.px]="myInput.offsetWidth">
+
+          <li class="menu-title flex justify-center">
+            <span class="p-0 text-lg">{{translations.menuPlaces}}</span>
+          </li>
+
+          <li *ngFor="let luogo of locations" (click)="luogoSelezionato=luogo.location; cercaLuogo(luogo.location)">
+            {{luogo.location}}
+          </li>
+
+        </ul>
+      </ng-container>
     </div>
-    <ng-container *ngIf="locationsPopup | async as locations;">
-      <ul *ngIf="locations.length > 0" class="menu bg-base-200 p-2 rounded-box" id="list"
-          [style.width.px]="myInput.offsetWidth">
 
-        <li class="menu-title">
-          <span>{{translations.menuPlaces}}</span>
-        </li>
-
-        <li *ngFor="let luogo of locations" (click)="luogoSelezionato=luogo.location; cercaLuogo(luogo.location)">
-          {{luogo.location}}
-        </li>
-
-      </ul>
-    </ng-container>
   </div>
 </div>