l-min-components 1.0.251 → 1.0.255

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "l-min-components",
-  "version": "1.0.251",
+  "version": "1.0.255",
   "type": "module",
   "files": [
     "src/assets",

package/src/components/header/index.styled.js

@@ -495,6 +495,48 @@ export const NavGroup2 = styled.div`
   display: flex;
   justify-content: flex-end;
   gap: 70px;
+  .language_dropdown {
+    display: flex;
+    align-items: center;
+    position: relative;
+    .drop_holder {
+      display: flex;
+      align-items: center;
+      border: 1px solid rgba(173, 178, 178, 1);
+      padding: 9px 12px;
+      border-radius: 37px;
+      cursor: pointer;
+      img {
+        width: 24px;
+        height: 16px;
+        margin-right: 10px;
+      }
+    }
+    .dropdown_list {
+      position: absolute;
+      top: 40px;
+      width: fit-content;
+      background: white;
+      padding: 5px;
+      border-radius: 5px;
+      li {
+        list-style-type: none;
+        display: flex;
+        align-items: center;
+        cursor: pointer;
+        padding: 5px 10px;
+        font-size: 12px;
+        &:hover {
+          background: rgba(173, 178, 178, 0.3);
+        }
+        img {
+          width: 20px;
+          height: 11px;
+          margin-right: 10px;
+        }
+      }
+    }
+  }
 `;
 
 export const CountryFlagGroup2 = styled.div`

package/src/components/header/login-header.jsx

@@ -5,6 +5,7 @@ import { Navbar2, NavGroup2, Nav2, CountryFlagGroup2 } from "./index.styled";
 import { ArrowDownIcon } from "./assets/svg/arrow-down";
 import ButtonComponent from "../button";
 import { useLocation, useNavigate } from "react-router-dom";
+import usFlag from "../../assets/images/18165.jpg";
 
 /**
  * @param {{
@@ -19,6 +20,7 @@ const HeaderComponentTwo = (props) => {
   const [selected, setSelected] = useState("ES");
   const [isOpen, setIsOpen] = useState(false);
   const [searchResultOpen, setSearchResultOpen] = useState(false);
+  const [languageDropdown, setLanguageDropdown] = useState();
 
   const navigate = useNavigate();
   const location = useLocation();
@@ -51,19 +53,31 @@ const HeaderComponentTwo = (props) => {
       </Nav2> */}
 
       <NavGroup2>
-        <CountryFlagGroup2>
-          <ReactFlagsSelect
-            disabled
-            selected={"US"}
-            onSelect={(code) => setSelected(code)}
-            showOptionLabel={true}
-          />
-          <ArrowDownIcon />
-        </CountryFlagGroup2>
+        <div className="language_dropdown">
+          <div
+            className="drop_holder"
+            onClick={() => setLanguageDropdown(!languageDropdown)}
+          >
+            <img src={usFlag} alt="" />
+            <ArrowDownIcon />
+          </div>
+          {languageDropdown && (
+            <ul className="dropdown_list">
+              <li onClick={() => setLanguageDropdown()}>
+                <img src={usFlag} alt="" /> <span>English</span>
+              </li>
+            </ul>
+          )}
+        </div>
 
-        {location.pathname.includes("sign-up") && (
-          <ButtonComponent type="secondary" text="Log in" onClick={goToLogin} />
-        )}
+        {location.pathname.includes("sign-up") &&
+          !location.pathname.includes("organization-details") && (
+            <ButtonComponent
+              type="secondary"
+              text="Log in"
+              onClick={goToLogin}
+            />
+          )}
       </NavGroup2>
     </Navbar2>
   );