From 4f97da9c6ccb69f09ad57635380bba303990b84c Mon Sep 17 00:00:00 2001
From: tito <tito.arrigo@icloud.com>
Date: Thu, 27 Apr 2023 11:02:41 +0200
Subject: [PATCH] inizio styling detail + corezione di alcuni bug

---
 src/app/detail/detail.component.html | 66 ++++++++++++++++++----------
 src/app/detail/detail.component.ts   |  6 +--
 2 files changed, 47 insertions(+), 25 deletions(-)

diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html
index ee6607d..b6e3cde 100644
--- a/src/app/detail/detail.component.html
+++ b/src/app/detail/detail.component.html
@@ -1,28 +1,50 @@
-<div>
-  <h1 class="titolo">{{test.name}}</h1>
-  <p>{{test.description}}</p>
-  <p ng-model="showNav" *ngIf="showNav">Distanza: {{distance}}</p>
-  <div id="nav" ng-model="showNav" *ngIf="showNav">
-    <iframe
-      width="500"
-      height="300"
-      frameborder="0" style="border:0"
-      referrerpolicy="no-referrer-when-downgrade"
-      [src]='embed | safe '
-      allowfullscreen>
-    </iframe>
+<!--
+  <div class="infos">
+    <h1 class="titolo">{{test.name}}</h1>
+    <p>{{test.description}}</p>
   </div>
 
-  <!--<label for="my-modal-6"  (click)="generateQR()">
-    <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>
-        <rect height="23.4863" opacity="0" width="17.334" x="0" y="0"/>
-        <path d="M3.06641 22.041L14.2676 22.041C16.3086 22.041 17.334 21.0254 17.334 19.0137L17.334 9.26758C17.334 7.25586 16.3086 6.24023 14.2676 6.24023L11.543 6.24023L11.543 7.8125L14.2383 7.8125C15.2051 7.8125 15.7617 8.33984 15.7617 9.35547L15.7617 18.9258C15.7617 19.9414 15.2051 20.4688 14.2383 20.4688L3.08594 20.4688C2.10938 20.4688 1.57227 19.9414 1.57227 18.9258L1.57227 9.35547C1.57227 8.33984 2.10938 7.8125 3.08594 7.8125L5.79102 7.8125L5.79102 6.24023L3.06641 6.24023C1.02539 6.24023 0 7.25586 0 9.26758L0 19.0137C0 21.0254 1.02539 22.041 3.06641 22.041ZM8.66211 14.3945C9.08203 14.3945 9.44336 14.043 9.44336 13.6328L9.44336 3.60352L9.38477 2.13867L10.0391 2.83203L11.5234 4.41406C11.6602 4.57031 11.8555 4.64844 12.0508 4.64844C12.4512 4.64844 12.7637 4.35547 12.7637 3.95508C12.7637 3.75 12.6758 3.59375 12.5293 3.44727L9.22852 0.263672C9.0332 0.0683594 8.86719 0 8.66211 0C8.4668 0 8.30078 0.0683594 8.0957 0.263672L4.79492 3.44727C4.64844 3.59375 4.57031 3.75 4.57031 3.95508C4.57031 4.35547 4.86328 4.64844 5.27344 4.64844C5.45898 4.64844 5.67383 4.57031 5.81055 4.41406L7.28516 2.83203L7.94922 2.13867L7.89062 3.60352L7.89062 13.6328C7.89062 14.043 8.24219 14.3945 8.66211 14.3945Z" fill="#000000"/>
-      </g>
-    </svg>
-  </label>-->
+  <div class="nav">
+    <p ng-model="showNav" *ngIf="showNav">Distanza: {{distance}}</p>
+    <div id="nav" ng-model="showNav" *ngIf="showNav">
+      <iframe
+        width="500"
+        height="300"
+        frameborder="0" style="border:0"
+        referrerpolicy="no-referrer-when-downgrade"
+        [src]='embed | safe '
+        allowfullscreen>
+      </iframe>
+    </div>
+  </div>
 
-  <!-- Put this part before </body> tag -->
+  <div class="image">
+    <img src="assets/testDetail/img.jpg" alt="image">
+  </div>-->
+<div>
+  <div class="grid grid-cols-2 gap-4">
+    <div class="p-4">
+      <h1 class="text-xl font-bold mb-2">{{test.name}}</h1>
+      <p class="text-gray-700">{{test.description}}</p>
+      <div class="mb-4">
+        <p class="text-lg font-medium">Distanza: {{distance === undefined ? '...' : distance}} Km</p>
+      </div>
+    </div>
+
+    <div class="p-4">
+      <img class="w-full" src="assets/testDetail/img.png" alt="image">
+    </div>
+
+    <div class="p-4 col-start-1 col-span-2 lg:col-start-2 lg:col-span-1">
+      <div>
+        <iframe class="w-full" height="300" frameborder="0" style="border:0" referrerpolicy="no-referrer-when-downgrade" [src]='embed | safe' allowfullscreen></iframe>
+      </div>
+    </div>
+  </div>
+
+
+
+<!-- Put this part before </body> tag -->
   <input type="checkbox" id="my-modal-6" class="modal-toggle" #myModal/>
 
   <div class="modal modal-bottom sm:modal-middle" *ngIf="img">
diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts
index b32a6e4..6d55b18 100755
--- a/src/app/detail/detail.component.ts
+++ b/src/app/detail/detail.component.ts
@@ -17,9 +17,9 @@ export class DetailComponent implements OnInit {
 
   test = {
     name: 'SPAI',
-    cordinates: '46.16980727184211, 8.795563727809393',
-    lat: 46.16980727184211,
-    lng: 8.795563727809393,
+    cordinates: '50.16980727184211, 10.795563727809393',
+    lat: 50.16980727184211,
+    lng: 9.795563727809393,
     description: "Lorem ipsum"
   }