Merge pull request #337 from ita-social-projects/#137navigationViaLogo

#137navigation via logo
ita-social-projects · Nov 30, 2023 · 41531b0 · 41531b0
2 parents e39d068 + 488e64f
commit 41531b0
Show file tree

Hide file tree

Showing 12 changed files with 74 additions and 33 deletions.
diff --git a/FrontEnd/public/apple-touch-icon.png b/FrontEnd/public/apple-touch-icon.png
diff --git a/FrontEnd/public/favicon-16x16.png b/FrontEnd/public/favicon-16x16.png
diff --git a/FrontEnd/public/favicon-32x32.png b/FrontEnd/public/favicon-32x32.png
diff --git a/FrontEnd/public/favicon.ico b/FrontEnd/public/favicon.ico
diff --git a/FrontEnd/public/forum-logo.ico b/FrontEnd/public/forum-logo.ico
diff --git a/FrontEnd/public/index.html b/FrontEnd/public/index.html
@@ -8,10 +8,13 @@
     <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
     <link rel="manifest" href="/site.webmanifest" />
 
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">
-    <title>React App</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap"
+      rel="stylesheet"
+    />
+    <title>Forum</title>
   </head>
   <body>
     <div id="root"></div>

diff --git a/FrontEnd/src/components/HeaderFooter/header/navbar/Navbar.jsx b/FrontEnd/src/components/HeaderFooter/header/navbar/Navbar.jsx
@@ -3,18 +3,30 @@ import Menu from './Menu';
 import SearchBox from './SearchBox';
 import Profile from './Profile';
 import Buttons from './Buttons';
+import { Link } from 'react-router-dom';
 
 function Navbar(props) {
-    return (
-        <div className={css['navbar-content']}>
-            <div className={css['navbar-logo__text']}>forum</div>
-            <div className={css['navbar-utility-bar']}>
-                {props.page === 'login' || props.page === 'registration' ? (null):
-                    (<><Menu/><SearchBox></SearchBox></>)}
-                {props.isAuthorized === true ? (<Profile/>) : (<Buttons/>)}
-            </div>
-        </div>
-    );
+  return (
+    <div className={css['navbar-content']}>
+      <div className={css['navbar-logo__text']}>
+        <Link to="/">
+          <img
+            src={`${process.env.REACT_APP_PUBLIC_URL}/forum-logo.ico`}
+            alt="forum-logo"
+          ></img>
+        </Link>
+      </div>
+      <div className={css['navbar-utility-bar']}>
+        {props.page === 'login' || props.page === 'registration' ? null : (
+          <>
+            <Menu />
+            <SearchBox></SearchBox>
+          </>
+        )}
+        {props.isAuthorized === true ? <Profile /> : <Buttons />}
+      </div>
+    </div>
+  );
 }
 
 export default Navbar;
diff --git a/FrontEnd/src/components/HeaderFooter/header/navbar/Navbar.module.css b/FrontEnd/src/components/HeaderFooter/header/navbar/Navbar.module.css
@@ -1,12 +1,12 @@
 .navbar-content {
-    display: flex;
-    width: 1305px;
-    padding: 8px 104px;
-    align-items: center;
-    justify-content: space-between;
+  display: flex;
+  width: 1305px;
+  padding: 8px 104px;
+  align-items: center;
+  justify-content: space-between;
 }
 
-.navbar-logo__text {
+/* .navbar-logo__text {
     color: #292E32;
     font-feature-settings: 'calt' off;
     font-family: Geologica;
@@ -15,9 +15,14 @@
     font-weight: 500;
     line-height: 24px;
     letter-spacing: -0.24px;
+} */
+
+.navbar-logo__img {
+  width: 600px;
+  height: 400px;
 }
 
 .navbar-utility-bar {
-    display: flex;
-    gap: 24px;
+  display: flex;
+  gap: 24px;
 }
diff --git a/FrontEnd/src/components/HeaderFooter/header/navbar/SearchBox.module.css b/FrontEnd/src/components/HeaderFooter/header/navbar/SearchBox.module.css
@@ -15,6 +15,16 @@
   align-items: flex-start;
   gap: 10px;
   flex: 1 0 0;
+  position: relative;
+}
+
+.header-search-form::after {
+  content: "";
+  position: absolute;
+  border-right: 1px solid #d9d9d9;
+  height: 32px;
+  top: -3.5px;
+  right: 0;
 }
 
 .header-search-form__input {
@@ -27,9 +37,15 @@
 }
 
 .header-search-form__addon {
+  display: flex;
+  padding: 6px;
+  justify-content: center;
+  align-items: center;
+  gap: 8px;
+  align-self: stretch;
   background-color: transparent;
   cursor: pointer;
-  border: 1px solid rgba(0, 0, 0, 0.25);
+  border: none;
 }
 
 .header-search-form__addon img {
@@ -52,4 +68,4 @@ textarea:focus,
 .header-search-form__input:focus {
   border: none;
   outline: none;
-}
+}
diff --git a/FrontEnd/src/components/SearchPage/Search.jsx b/FrontEnd/src/components/SearchPage/Search.jsx
@@ -77,13 +77,15 @@ export function Search({ isAuthorized, userData }) {
         <img className={styles['frame-img-right']} src={frame42} alt="frame" />
         <div className={styles['new-companies-search_count']}>
           {searchResults && (
-            <h3 className={styles['search_results_text']}>
+            <div><h3 className={styles['search_results_text']}>
               РЕЗУЛЬТАТІВ ЗА ПОШУКОМ{' '}
               <span className={styles['search_field_entered_value']}>
                 {searchTerm}
               </span>{' '}
               : {searchResults.length > 0 ? searchResults.length : 0}
             </h3>
+            <br/>
+            </div>
           )}
           <br />
         </div>
@@ -99,14 +101,17 @@ export function Search({ isAuthorized, userData }) {
               />
               <br />
             </>
-          ) : (
+          ) : ( <div>
+          <br />
             <p className={styles['search_result_error']}>
               Пошук не дав результатів: компанії з іменем{' '}
               <span className={styles['.search_result_error']}>
                 {searchTerm}
               </span>{' '}
               не було виявлено на даний момент
             </p>
+             <br />
+          </div>
           )}
         </div>
         <div className={styles['new-companies-result_pages']}>

diff --git a/FrontEnd/src/components/SearchPage/search_page.module.css b/FrontEnd/src/components/SearchPage/search_page.module.css
@@ -20,8 +20,8 @@
 }
 
 .search_field_entered_value {
-  color: var(----main-style-signs-color);
-  font: Inter;
+  color: #0b6c61;
+  font: normal normal normal 20px/2 Inter;
   font-weight: 600;
   font-style: italic;
 }
@@ -34,7 +34,8 @@
 .search_result_error {
   font-weight: 600;
   color: var(--text-color);
-  font: Inter;
+  font: normal normal bold 20px/2 Inter;
+  margin: 145px;
 }
 
 .frame-img-right {

diff --git a/FrontEnd/src/components/cookieacception/CookieMod.module.css b/FrontEnd/src/components/cookieacception/CookieMod.module.css
@@ -19,7 +19,6 @@
   padding: 20px;
   border-radius: 12px;
   background-color: white;
-  height: 230px;
   width: 300px;
 }
 
@@ -30,8 +29,8 @@
   border-style: solid;
   font-size: 15px;
   border-radius: 4px;
-  margin: 10px;
-  margin-right: 40px;
+  margin: 14px;
+  margin-right: 50px;
   padding: 4px;
 }
 
@@ -48,7 +47,7 @@
 }
 
 .cookie-image {
-  margin-left: 55px;
+  margin-left: 95px;
   margin-right: 50px;
   width: 100px;
   height: 70px;