fix: adjust duration and primary light color

Author: malessani

components/data/GlobalStylesProvider/index.tsx

@@ -12,7 +12,7 @@ const CustomStyles = createGlobalStyle<GlobalStyleProps>`
     --primary-s: ${({ primaryColor }) => primaryColor?.s};
     --primary-l: ${({ primaryColor }) => primaryColor?.l};
     --primary: hsl(var(--primary-h), var(--primary-s), var(--primary-l));
-    --primary-light: hsla(var(--primary-h), var(--primary-s), var(--primary-l), 0.1);
+    --primary-light: hsla(var(--primary-h), var(--primary-s), var(--primary-l), 0.4);
     --primary-dark: hsl(var(--primary-h), var(--primary-s), calc(var(--primary-l) * 0.5));
     --contrast-threshold: 75%;
     --switch: calc((var(--primary-l) - var(--contrast-threshold)) * -10000);

components/ui/Accordion/index.tsx

@@ -71,16 +71,16 @@ const AccordionTab = styled.div`
   }
 `
 const AccordionTabHeader = styled.div`
-  ${tw`text-black relative flex items-start justify-between pb-3 pt-5 cursor-pointer transition ease-in-out duration-500 focus:bg-gray-400 md:pt-6 md:pb-0`}
+  ${tw`text-black relative flex items-start justify-between pb-3 pt-5 cursor-pointer transition ease-in-out duration-100 focus:bg-gray-400 md:pt-6 md:pb-0`}
   .disabled & {
     ${tw`pointer-events-none`}
   }
 `
 const AccordionTitle = styled.div`
-  ${tw`transition ease-in-out duration-500`}
+  ${tw`transition ease-in-out duration-100`}
 `
 const AccordionIcon = styled.div`
-  ${tw`transform transition ease-in-out duration-500`}
+  ${tw`transform transition ease-in-out duration-100`}
   .active & {
     ${tw`-rotate-180`}
   }
@@ -90,7 +90,7 @@ const AccordionIcon = styled.div`
   }
 `
 const AccordionBody = styled.div`
-  ${tw`max-h-0 transition duration-200 ease-in opacity-0`}
+  ${tw`max-h-0 transition duration-100 ease-in opacity-0`}
   .active & {
     ${tw`max-h-full opacity-100`}
   }

components/ui/form/Input.tsx

@@ -2,7 +2,7 @@ import { css } from "styled-components"
 import tw from "twin.macro"
 
 export const InputCss = css`
-  ${tw`text-black block w-full border-gray-300 border rounded-md p-3 transition duration-500 ease-in-out focus:border-primary focus:ring focus:ring-offset-0 focus:ring-primary-light focus:ring-opacity-50  sm:text-sm`}
+  ${tw`text-black block w-full border-gray-300 border rounded-md shadow-sm p-3 transition duration-100 ease-in-out focus:border-primary focus:ring focus:ring-offset-0 focus:ring-primary-light focus:ring-opacity-50  sm:text-sm`}
 
   &:-webkit-autofill {
     &,