From 43cdb7607d9423109758334155acfe844eab6ea5 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Mon, 20 Dec 2021 19:06:49 +0100
Subject: chore: define search form visibility

---
 src/components/Toolbar/Toolbar.tsx | 8 ++++++++
 1 file changed, 8 insertions(+)

(limited to 'src/components/Toolbar/Toolbar.tsx')

diff --git a/src/components/Toolbar/Toolbar.tsx b/src/components/Toolbar/Toolbar.tsx
index 6be2029..fdab76a 100644
--- a/src/components/Toolbar/Toolbar.tsx
+++ b/src/components/Toolbar/Toolbar.tsx
@@ -1,5 +1,6 @@
 import { ButtonSearch } from '@components/Buttons';
 import MainNav from '@components/MainNav/MainNav';
+import SearchForm from '@components/SearchForm/SearchForm';
 import { useEffect, useState } from 'react';
 import styles from './Toolbar.module.scss';
 
@@ -15,6 +16,10 @@ const Toolbar = () => {
     if (isSearchOpened) setIsNavOpened(false);
   }, [isSearchOpened]);
 
+  const searchClasses = `${styles.search} ${
+    isSearchOpened ? styles['search--opened'] : styles['search--closed']
+  }`;
+
   return (
     <div className={styles.wrapper}>
       <MainNav isOpened={isNavOpened} setIsOpened={setIsNavOpened} />
@@ -22,6 +27,9 @@ const Toolbar = () => {
         isActivated={isSearchOpened}
         setIsActivated={setIsSearchOpened}
       />
+      <div className={searchClasses}>
+        <SearchForm isOpened={isSearchOpened} />
+      </div>
     </div>
   );
 };
-- 
cgit v1.2.3