From fc62999a85e88dce6265d2ff130e1b2accd0efa0 Mon Sep 17 00:00:00 2001
From: Toufic Batache <taffou2a@gmail.com>
Date: Fri, 15 Sep 2023 11:40:59 +0200
Subject: [PATCH] - Always show test cases carousel - Unify TestCase and
 TestCaseCompare views - Replace svg backgrounds with gradients

---
 .../test_cases/TestCaseCompareView.svelte     |  6 ++---
 src/routes/+page.svelte                       | 22 +++++++++----------
 .../background_compareview_body.svg           |  4 ----
 .../background_compareview_header.svg         |  5 -----
 4 files changed, 13 insertions(+), 24 deletions(-)
 delete mode 100644 static/background_image/background_compareview_body.svg
 delete mode 100644 static/background_image/background_compareview_header.svg

diff --git a/src/lib/components/test_cases/TestCaseCompareView.svelte b/src/lib/components/test_cases/TestCaseCompareView.svelte
index 0ebd13ded..0c362e0f3 100644
--- a/src/lib/components/test_cases/TestCaseCompareView.svelte
+++ b/src/lib/components/test_cases/TestCaseCompareView.svelte
@@ -81,7 +81,7 @@
 </script>
 
 <div
-  class="relative mx-0 rounded-t-sm bg-white shadow-md md:mx-2 md:mb-5 lg:mx-5"
+  class="relative mx-0 rounded-lg border border-gray-200 shadow-md overflow-hidden bg-white md:mx-2 md:mb-5 lg:mx-5"
   id="situation_{situationsToCompareIndex.join('_')}"
 >
   <div class="flex justify-end rounded-t-md bg-gray-100 px-6 py-1">
@@ -103,7 +103,7 @@
   </div>
   <div class="flex border-b-2 border-l border-gray-200">
     <div
-      class="flex w-10/12 justify-self-end bg-[url('/background_image/background_compareview_header.svg')] bg-cover bg-center bg-no-repeat px-4 md:w-11/12"
+      class="flex w-10/12 justify-self-end bg-gradient-to-r from-[#DCDCDC] from-50% to-gray-100 to-50% bg-cover bg-center bg-no-repeat px-4 md:w-11/12"
       id="situation_{situationsToCompareIndex.join('_')}_cases_summary"
     >
       {#each situationsToCompare as situation, index}
@@ -135,7 +135,7 @@
       <div class="flex justify-between bg-gray-100">
         <!-- Impacts et waterfall -->
         <div
-          class="min-h-[30em] w-10/12 border-b-2 border-l border-gray-200 bg-[url('/background_image/background_compareview_body.svg')] bg-cover bg-center bg-no-repeat px-3 text-center md:w-11/12"
+          class="min-h-[30em] w-10/12 bg-gradient-to-r from-gray-100 from-50% to-white to-50% bg-cover bg-center bg-no-repeat px-3 text-center md:w-11/12"
         >
           <div class="relative flex-col border-gray-400 p-3 pb-6">
             {#if Object.values($calculationByName).filter((calculation) => calculation.running && (calculation.situationIndex === undefined || situationsToCompareIndex.includes(calculation.situationIndex))).length > 0}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 41f275852..e5ed42f76 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1598,18 +1598,16 @@
               />
             {/if}
 
-            {#if $testCasesIndex.length === 1}
-              {#if displayMode.parametersVariableName !== undefined}
-                <TestCaseRelatedCarousel
-                  {displayMode}
-                  year={$year}
-                  variable={displayMode.parametersVariableName}
-                  on:openTestCaseSelectModal={() =>
-                    (isTestCaseSelectModalOpen = true)}
-                  on:changeTestCase={({ detail }) =>
-                    (changeTestCaseIndexes = detail)}
-                />
-              {/if}
+            {#if displayMode.parametersVariableName !== undefined}
+              <TestCaseRelatedCarousel
+                {displayMode}
+                year={$year}
+                variable={displayMode.parametersVariableName}
+                on:openTestCaseSelectModal={() =>
+                  (isTestCaseSelectModalOpen = true)}
+                on:changeTestCase={({ detail }) =>
+                  (changeTestCaseIndexes = detail)}
+              />
             {/if}
           {/if}
         </div>
diff --git a/static/background_image/background_compareview_body.svg b/static/background_image/background_compareview_body.svg
deleted file mode 100644
index 92f4bbd16..000000000
--- a/static/background_image/background_compareview_body.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-<svg width="362" height="267" viewBox="0 0 362 267" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect width="362" height="267" fill="#F1F1F1"/>
-<rect x="181" width="181" height="267" fill="white"/>
-</svg>
diff --git a/static/background_image/background_compareview_header.svg b/static/background_image/background_compareview_header.svg
deleted file mode 100644
index 323aaaf22..000000000
--- a/static/background_image/background_compareview_header.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-<svg width="362" height="267" viewBox="0 0 362 267" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect width="362" height="267" fill="white"/>
-<rect width="181" height="267" fill="#DCDCDC"/>
-<rect x="181" width="181" height="267" fill="#F5F5F5"/>
-</svg>
-- 
GitLab