Merge pull request #344 from EscolaLMS/feature/front-changes

front changes
EscolaLMS · Mar 21, 2024 · 4c92a40 · 4c92a40
2 parents 59fa720 + b436ffd
commit 4c92a40
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 10 deletions.
diff --git a/src/components/atoms/BreadCrumbs/BreadCrumbs.tsx b/src/components/atoms/BreadCrumbs/BreadCrumbs.tsx
@@ -50,7 +50,7 @@ const StyledNav = styled("nav")`
     justify-content: flex-start;
     align-items: center;
     align-content: center;
-    gap: 5px;
+    gap: 2px;
     li {
       &,
       & > a,

diff --git a/src/components/atoms/Button/Button.tsx b/src/components/atoms/Button/Button.tsx
@@ -19,7 +19,7 @@ const ModeTypes = {
   GRAY: "gray",
 } as const;
 
-type ModeProp = (typeof ModeTypes)[keyof typeof ModeTypes];
+type ModeProp = typeof ModeTypes[keyof typeof ModeTypes];
 
 export interface ButtonProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement>,

diff --git a/src/components/atoms/Link/Link.tsx b/src/components/atoms/Link/Link.tsx
@@ -29,6 +29,7 @@ const StyledAnchor = styled("a")<LinkProps>`
 
   & > * {
     vertical-align: middle;
+    transition: color 0.3s ease-out;
   }
   & > svg {
     margin: 0 0.5em;
@@ -38,22 +39,27 @@ const StyledAnchor = styled("a")<LinkProps>`
     content: "";
     position: absolute;
     width: 100%;
-    transform: ${(props) => (props.underline ? "scaleX(1)" : "scaleX(0)")};
+    /* transform: ${(props) =>
+      props.underline ? "scaleX(1)" : "scaleX(0)"}; */
     height: 1px;
     bottom: 0;
     left: 0;
-    background-color: ${({ theme }) =>
-      getStylesBasedOnTheme(theme.mode, theme.gray5, theme.gray1, "black")};
-    transform-origin: ${(props) =>
+    /* background-color: ${({ theme }) =>
+      getStylesBasedOnTheme(theme.mode, theme.gray5, theme.gray1, "black")}; */
+    /* transform-origin: ${(props) =>
       props.underline ? "bottom left" : "bottom right"};
-    transition: transform 0.25s ease-out;
+    transition: transform 0.25s ease-out; */
   }
 
   &:hover,
   &:active {
+    * {
+      color: ${({ theme }) => theme.primaryColor};
+    }
+
     &:after {
-      transform: ${(props) => (props.underline ? "scaleX(0)" : "scaleX(1)")};
-      transform-origin: bottom left;
+      /* transform: ${(props) => (props.underline ? "scaleX(0)" : "scaleX(1)")};
+      transform-origin: bottom left; */
     }
   }
 `;

diff --git a/src/components/molecules/DropdownMenu/DropdownMenu.tsx b/src/components/molecules/DropdownMenu/DropdownMenu.tsx
@@ -122,7 +122,7 @@ const DropdownMenu: FC<Props> = ({
               onClick={() => onListItemClick(index)}
               onKeyDown={closeMenu}
             >
-              <Text size="14" noMargin bold>
+              <Text size="14" noMargin>
                 {content}
               </Text>
             </MenuItem>

diff --git a/src/components/molecules/Search/Search.tsx b/src/components/molecules/Search/Search.tsx
@@ -108,6 +108,7 @@ const StyledSearch = styled("div")<StyledSearchProps>`
     box-shadow: 0px 10px 15px #00000019;
 
     > * {
+      font-weight: 400;
       padding: 15px;
       cursor: pointer;
       transition: background-color 0.2s ease-in-out;

diff --git a/src/components/organisms/SearchCourses/SearchCourses.tsx b/src/components/organisms/SearchCourses/SearchCourses.tsx
@@ -13,6 +13,9 @@ const SearchWrapper = styled.div`
     border-radius: 21px !important;
     background-color: ${({ theme }) => theme.gray4} !important;
   }
+  .fieldset {
+    border-radius: 21px !important;
+  }
 `;
 
 const ItemButton = styled(Button)`