l-min-components 1.0.1089 → 1.0.1091

package/package.json

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

package/src/components/header/assets/svg/setting.jsx

@@ -6,6 +6,7 @@ export const SettingIcon = ({ width, height, fill }) => (
     viewBox="0 0 23 22"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
+    className="setting_icon"
   >
     <path
       d="M11.3219 20.5016L2.85352 15.5988V5.79336L11.3219 0.890625L19.7902 5.79336V15.5988L11.3219 20.5016ZM11.3219 2.95156L4.63633 6.82115V14.571L11.3219 18.4415L18.0074 14.571V6.82115L11.3219 2.95066V2.95156ZM11.3219 14.2617C10.3765 14.259 9.47037 13.8836 8.80008 13.217C7.78053 12.1971 7.47568 10.6635 8.02766 9.33127C8.57965 7.99901 9.87979 7.13047 11.3219 7.13047C12.267 7.133 13.1729 7.50844 13.8428 8.17519C15.2347 9.56757 15.2347 11.8246 13.8428 13.217C13.1728 13.8835 12.2669 14.2589 11.3219 14.2617ZM11.3219 8.91327C10.4713 8.9131 9.7391 9.51377 9.573 10.3479C9.40691 11.1821 9.8532 12.0174 10.6389 12.3431C11.4247 12.6687 12.331 12.3939 12.8037 11.6868C13.2763 10.9797 13.1837 10.0372 12.5823 9.43564C12.2487 9.10027 11.7949 8.9122 11.3219 8.91327Z"

package/src/components/header/index.jsx

@@ -299,7 +299,9 @@ const HeaderComponent = (props) => {
   }, []);
 
   // Determine home page for active style purpose
-  const isHomePage = () => window.location.pathname === "/";
+  const isHomePage = () =>
+    window.location.pathname === "/" ||
+    window.location.pathname.includes("developer");
 
   // Determine the label based on the current path
   const getNavLinkLabel = () => {

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

@@ -72,92 +72,6 @@ export const NavGroup = styled.div`
   }
 `;
 
-// export const Nav = styled.ul`
-//   display: flex;
-//   list-style: none;
-//   align-items: center;
-//   margin: 0 10px;
-//   padding: 0 5px;
-//   width: 57%;
-//   @media screen and (max-width: 1530px) {
-//     width: 40%;
-//   }
-
-//   & li {
-//     display: flex;
-//     align-items: center;
-//     margin: 0 10px;
-//   }
-
-//   & li:nth-of-type(1) {
-//     margin-right: 75px;
-//     margin-left: 35px;
-//   }
-
-//   & a {
-//     text-decoration: none;
-//     display: flex;
-//     align-items: center;
-//     color: #4a4d4d;
-//     font-size: 15px;
-//     font-weight: 600;
-//     position: relative;
-
-//     &:hover,
-//     &.active {
-//       color: rgba(0, 194, 194, 1);
-//       font-weight: 600;
-//       &::after {
-//         content: "";
-//         position: absolute;
-//         left: 0;
-//         bottom: -9px;
-//         width: 40px;
-//         height: 4px;
-//         background-color: rgba(0, 194, 194, 1);
-//         transition: width 0.3s ease-in-out;
-//       }
-//     }
-
-//     & svg {
-//       margin-right: 12px;
-//     }
-
-//     & svg path {
-//       stroke: ${({ isActive }) =>
-//         isActive ? "rgba(0, 194, 194, 1)" : "currentcolor"};
-//     }
-  
-
-//     &.disabled {
-//         color: #d3d3d3 !important;
-//         cursor: not-allowed;
-       
-//         &::before {
-//           display: none;
-//         }
-
-//         &:hover {
-//           color: #d3d3d3 !important;
-//         cursor: not-allowed;
-
-//           &::before {
-//             content: "";
-//             height: 30px;
-//             width: 3px;
-//             border-radius: 10px;
-//             position: absolute;
-//             top: 15px;
-//             left: 50%;
-//             display: block;
-//             background: #fff !important;
-//             transform: rotate(90deg);
-//           }
-//         }
-//       }
-//   }
-// `;
-
 export const Nav = styled.ul`
   display: flex;
   list-style: none;
@@ -210,13 +124,15 @@ export const Nav = styled.ul`
     & svg {
       margin-right: 12px;
     }
+    .setting_icon path {
+      fill: ${({ isActive }) =>
+        isActive ? "rgba(0, 194, 194, 1)" : "currentcolor"};
+      stroke: none !important;
+    }
 
     & svg path {
       stroke: ${({ isActive }) =>
         isActive ? "rgba(0, 194, 194, 1)" : "currentcolor"};
-      /* fill: ${({ isActive }) =>
-        isActive ? "rgba(0, 194, 194, 1)" : "currentcolor"}; */
-        
     }
 
     &.disabled {
@@ -232,15 +148,15 @@ export const Nav = styled.ul`
         cursor: not-allowed;
 
         &::after {
-        content: "";
-        position: absolute;
-        left: 0;
-        bottom: -9px;
-        width: 40px;
-        height: 4px;
-        background-color: #fff;
-        transition: width 0.3s ease-in-out;
-      }
+          content: "";
+          position: absolute;
+          left: 0;
+          bottom: -9px;
+          width: 40px;
+          height: 4px;
+          background-color: #fff;
+          transition: width 0.3s ease-in-out;
+        }
       }
     }
   }
@@ -847,7 +763,6 @@ export const LanguageDropdownContainer = styled.div`
   }
 `;
 
-
 export const Help = styled.div`
   display: flex;
   align-items: center;
@@ -857,7 +772,7 @@ export const Help = styled.div`
   font-weight: 600;
   color: #4a4d4d;
 
-  svg{
+  svg {
     margin-right: 5px;
   }
-`
+`;

package/src/components/loader/index.jsx

@@ -6,9 +6,9 @@ import styled from "styled-components";
  * @param {{zoom: number, color: string}} param0
  * @returns
  */
-const Loader = ({ zoom, color }) => {
+const Loader = ({ zoom, color, isOpen }) => {
   return (
-    <Wrap zoom={zoom}>
+    <Wrap zoom={zoom} isOpen={isOpen}>
       <Container zoom={zoom} color={color}>
         <div></div>
         <div></div>
@@ -19,8 +19,10 @@ const Loader = ({ zoom, color }) => {
 };
 
 const Wrap = styled.div`
-  width: ${({ zoom }) => (zoom ? (zoom * 100 * 80) / 100 : 80)}px;
-  height: ${({ zoom }) => (zoom ? (zoom * 100 * 80) / 100 : 80)}px;
+  width: ${({ zoom, isOpen }) =>
+    zoom && isOpen ? (zoom * 100 * 80) / 100 : 30}px;
+  height: ${({ zoom, isOpen }) =>
+    zoom && isOpen ? (zoom * 100 * 80) / 100 : 30}px;
   display: flex;
   align-items: center;
   justify-content: "center";

package/src/components/sideBar/userCard/index.jsx

@@ -64,7 +64,7 @@ const UserCard = ({ user, isOpen, findText }) => {
   return (
     <UserCardContainer isOpen={isOpen}>
       {userDetails?.loading && !organizationName ? (
-        <Loader zoom={0.3} />
+        <Loader zoom={0.3} isOpen={isOpen} />
       ) : (
         <>
           <Avatar
@@ -94,14 +94,16 @@ const UserCard = ({ user, isOpen, findText }) => {
               if (window.location.pathname.includes("instructor")) {
                 window.location.href = `${window.location.protocol}//${window.location.hostname}/instructor/profile`;
               }
-            }}>
+            }}
+          >
             <UserName>{findText("Hello")}</UserName>
             <Handle
               style={{
                 textTransform: "capitalize",
                 fontWeight: 700,
                 fontSize: 15,
-              }}>{`${
+              }}
+            >{`${
               organizationName
                 ? organizationName
                 : generalData?.selectedAccount?.display_name ?? ""