From 8ea3362b653c231f9c67ee37892e04bb6f9fc737 Mon Sep 17 00:00:00 2001
From: Cyril Gromoff <cyril.gromoff@infomaniak.com>
Date: Tue, 10 Sep 2024 09:24:15 +0200
Subject: [PATCH] remove unnecessary svg component and use var to handle
 changing theme on it

---
 .../infomaniak_channel_search_svg.tsx         | 27 ++++++++++---------
 .../src/sass/base/_css_variables.scss         |  3 +--
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/webapp/channels/src/components/common/svg_images_components/infomaniak_channel_search_svg.tsx b/webapp/channels/src/components/common/svg_images_components/infomaniak_channel_search_svg.tsx
index 52b3b597be..5bd45eb5f7 100644
--- a/webapp/channels/src/components/common/svg_images_components/infomaniak_channel_search_svg.tsx
+++ b/webapp/channels/src/components/common/svg_images_components/infomaniak_channel_search_svg.tsx
@@ -1,5 +1,5 @@
-import React from "react";
-import { useIntl } from "react-intl";
+import React from 'react';
+import {useIntl} from 'react-intl';
 
 export function InfomaniakChannelSearchSvg(props: React.HTMLAttributes<HTMLSpanElement>) {
     const {formatMessage} = useIntl();
@@ -16,35 +16,36 @@ export function InfomaniakChannelSearchSvg(props: React.HTMLAttributes<HTMLSpanE
                 <g clipPath='url(#clip0_5407_2941)'>
                     <path
                         d='M4.04124 25.8945H96.0783C98.3103 25.8945 100.12 27.7039 100.12 29.9358V93.7862C100.12 96.0181 98.3103 97.8275 96.0783 97.8275H35.9673L17.3404 117.671V97.8275H4.04124C1.8093 97.8275 -4.57764e-05 96.0181 -4.57764e-05 93.7862V29.9358C-4.57764e-05 27.7039 1.8093 25.8945 4.04124 25.8945Z'
-                        fill='#7BB4D1'                    />
+                        fill='#7BB4D1'
+                    />
                     <path
                         d='M131.645 107.609L93.7298 83.2319L100.463 72.7596L138.378 97.1371C139.766 98.0294 140.168 99.8779 139.275 101.266L135.773 106.712C134.881 108.1 133.033 108.502 131.645 107.609Z'
-                        fill='var(--no-results-light)'
-                        stroke='var(--no-results-dark)'
+                        fill='var(--ik-btn-secondary)'
+                        stroke='var(--ik-illustration-grey-18)'
                         strokeWidth='0.5'
                     />
                     <path
                         d='M93.0094 28.5154C111.317 40.2865 116.616 64.6703 104.845 82.9782C93.0742 101.286 68.6904 106.585 50.3826 94.8142C32.0747 83.0431 26.7756 58.6592 38.5466 40.3513C50.3177 22.0434 74.7015 16.7443 93.0094 28.5154Z'
-                        fill='var(--ik-illustration-grey-1)'
-                        stroke='var(--no-results-dark)'
+                        fill='var(--ik-illustration-grey-9)'
+                        stroke='var(--ik-illustration-grey-18)'
                         strokeWidth='0.5'
                     />
                     <path
                         d='M87.7562 36.6856C101.552 45.5557 105.545 63.9301 96.6752 77.726C87.8051 91.5219 69.4307 95.5151 55.6349 86.645C41.839 77.7749 37.8458 59.4005 46.7159 45.6046C55.586 31.8087 73.9604 27.8156 87.7562 36.6856Z'
-                        fill='var(--ik-illustration-grey-4)'
-                        stroke='var(--no-results-dark)'
+                        fill='var(--ik-illustration-grey-6)'
+                        stroke='var(--ik-illustration-grey-18)'
                         strokeWidth='0.5'
                     />
                     <path
                         d='M74.2181 41.0963C80.0412 44.8403 81.7266 52.5958 77.9827 58.4189C74.2388 64.2419 66.4832 65.9273 60.6602 62.1834C54.8372 58.4395 53.1517 50.6839 56.8956 44.8609C60.6396 39.0378 68.3951 37.3524 74.2181 41.0963Z'
-                        fill='var(--ik-illustration-grey-2)'
-                        stroke='var(--no-results-dark)'
+                        fill='var(--ik-illustration-grey-11)'
+                        stroke='var(--ik-illustration-grey-18)'
                         strokeWidth='0.5'
                     />
                     <path
                         d='M133.465 98.7907C134.477 99.4412 134.77 100.789 134.119 101.801C133.469 102.813 132.121 103.106 131.109 102.455C130.097 101.804 129.805 100.457 130.455 99.4448C131.106 98.433 132.453 98.1401 133.465 98.7907Z'
-                        fill='var(--ik-illustration-grey-6)'
-                        stroke='var(--no-results-dark)'
+                        fill='white'
+                        stroke='var(--ik-illustration-grey-18'
                         strokeWidth='0.5'
                     />
                 </g>
diff --git a/webapp/channels/src/sass/base/_css_variables.scss b/webapp/channels/src/sass/base/_css_variables.scss
index a64a318391..8bdc78b96c 100644
--- a/webapp/channels/src/sass/base/_css_variables.scss
+++ b/webapp/channels/src/sass/base/_css_variables.scss
@@ -37,8 +37,6 @@
     --dark-modal-font-color:#fff;
     --code-color: #f80;
     --code-block-color: #fff;
-    --no-results-light: #F1F1F1
-    --no-results-dark: #9F9F9F
 
     // Default RGB values to be replaced by applyTheme() (do not add opacity mutations here)
     // these are define to prevent flashes of unstyled content
@@ -126,4 +124,5 @@
     --ik-illustration-grey-15: #F1F1F1;
     --ik-illustration-grey-16: #F1F1F1;
     --ik-illustration-grey-17: #F5F5F5;
+    --ik-illustration-grey-18: #9F9F9F;
 }