From 2cf998e5f46e8680a575f39144d80f0b27118c68 Mon Sep 17 00:00:00 2001
From: Hugo <hnouts@grandlyon.com>
Date: Tue, 27 Jul 2021 16:41:59 +0200
Subject: [PATCH] update & fixes

- Opening and closing hours displayed as column for mobile & row for desktop / tablet
- Fix structureDetails opening panel from tooltip
- Check opening hours before formating them to avoid undefined errors in structure-detail-print
---
 .../structure-detail-print.component.html     |  4 ++--
 .../structure-detail-print.component.scss     | 21 +++++++++++++++++++
 .../orientation-form.component.html           |  2 +-
 .../orientation-form.component.scss           | 18 ++++++++++++++--
 .../structure-details.component.html          |  2 +-
 5 files changed, 41 insertions(+), 6 deletions(-)

diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
index d47786172..b6e592955 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
@@ -10,7 +10,7 @@
           <h3>{{ structure.getLabelTypeStructure() }}</h3>
         </div>
       </div>
-      <div fxLayout="row" class="mobile-column">
+      <div class="mobile-column">
         <div fxLayout="column" fxFlex="50%">
           <div *ngIf="structure.address" fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="13px">
             <app-svg-icon [type]="'ico'" [icon]="'adress'" [title]="'Adresse'"></app-svg-icon>
@@ -119,7 +119,7 @@
               <h4>{{ day.key | day }}</h4>
               <div class="opening-time" fxLayout="row" fxLayoutAlign="none flex-end">
                 <div *ngFor="let timeRange of day.value.time; let isFirst = first">
-                  <p *ngIf="isFirst">de {{ timeRange.formatOpeningDate() }} à {{ timeRange.formatClosingDate() }}</p>
+                  <p *ngIf="isFirst && timeRange.opening">de {{ timeRange.formatOpeningDate() }} à {{ timeRange.formatClosingDate() }}</p>
                   <p *ngIf="!isFirst && timeRange.opening">
                     et de {{ timeRange.formatOpeningDate() }} à {{ timeRange.formatClosingDate() }}
                   </p>
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
index 5edae1720..664e18f7a 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
@@ -137,3 +137,24 @@ p,
   margin-top: 15px;
   background: #348899;
 }
+
+.mobile-column {
+  @media #{$tablet} {
+    flex-direction: row;
+  }
+  @media #{$desktop} {
+    flex-direction: row;
+  }
+  @media #{$large-desktop} {
+    flex-direction: row;
+  }
+  @media #{$phone} {
+    flex-direction: column;
+  }
+  @media #{$small-phone} {
+    flex-direction: column;
+  }
+  @media #{$large-phone} {
+    flex-direction: column;
+  }
+}
\ No newline at end of file
diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index bcb1bfd7d..02e379de3 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -320,7 +320,7 @@
           [selectedMarkerId]="selectedMarkerId"
           [locate]="locate"
           (locatationTrigger)="locatationTrigger($event)"
-          (selectedStructure)="showDetailStructure($event)"
+          (selectedStructure)="showDetails($event)"
           [isMapPhone]="isMapPhone"
           [searchedValue]="searchedValue"
           class="right-pane deep-map"
diff --git a/src/app/form/orientation-form/orientation-form.component.scss b/src/app/form/orientation-form/orientation-form.component.scss
index 315456fee..dbeffc59d 100644
--- a/src/app/form/orientation-form/orientation-form.component.scss
+++ b/src/app/form/orientation-form/orientation-form.component.scss
@@ -124,7 +124,7 @@
 .btnSwitch {
   position: fixed;
   left: 50%;
-  bottom: $footer-height;
+  bottom: $footer-height + 5px;
   transform: translate(-50%, -50%);
   margin: 0 auto;
   display: none;
@@ -138,5 +138,19 @@
 }
 
 .loader-gif {
-  width: 20%;
+  @media #{$desktop} {
+    width: 20%;
+  }
+  @media #{$large-desktop} {
+    width: 20%;
+  }
+  @media #{$large-phone} {
+    width: 100%;
+  }
+  @media #{$small-phone} {
+    width: 100%;
+  }
+  @media #{$phone} {
+    width: 100%;
+  }
 }
diff --git a/src/app/structure-list/components/structure-details/structure-details.component.html b/src/app/structure-list/components/structure-details/structure-details.component.html
index 5d5fcd8d6..14d8b2826 100644
--- a/src/app/structure-list/components/structure-details/structure-details.component.html
+++ b/src/app/structure-list/components/structure-details/structure-details.component.html
@@ -187,7 +187,7 @@
               <h4>{{ day.key | day }}</h4>
               <div class="opening-time" fxLayout="row" fxLayoutAlign="none flex-end">
                 <div *ngFor="let timeRange of day.value.time; let isFirst = first">
-                  <p *ngIf="isFirst">de {{ timeRange.formatOpeningDate() }} à {{ timeRange.formatClosingDate() }}</p>
+                  <p *ngIf="isFirst && timeRange.opening">de {{ timeRange.formatOpeningDate() }} à {{ timeRange.formatClosingDate() }}</p>
                   <p *ngIf="!isFirst && timeRange.opening">
                     et de {{ timeRange.formatOpeningDate() }} à {{ timeRange.formatClosingDate() }}
                   </p>
-- 
GitLab