fix: added blinking corsor effects

brightshift · Nov 7, 2024 · b25bb79 · b25bb79
1 parent 0040f0c
commit b25bb79
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 0 deletions.
diff --git a/app/dashboard/main-components/mai-search/SearchMailModal.tsx b/app/dashboard/main-components/mai-search/SearchMailModal.tsx
@@ -153,6 +153,7 @@ export const SearchMailModal = ({ ...props }: Props) => {
                   }
                   style={{ width }}
                 />
+                <span className=" h-4 w-[0.1rem] animate-blink bg-white"></span>
               </form>
             )}
 

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -59,6 +59,10 @@ module.exports = {
         sans: ["var(--font-sans)", ...fontFamily.sans],
       },
       keyframes: {
+        blink: {
+          "0%, 100%": { opacity: 1 },
+          "50%": { opacity: 0 },
+        },
         "accordion-down": {
           from: {
             height: "0",
@@ -117,6 +121,7 @@ module.exports = {
         spotlight: "spotlight 2s ease .75s 1 forwards",
         "accordion-down": "accordion-down 0.2s ease-out",
         "accordion-up": "accordion-up 0.2s ease-out",
+        blink: "blink 1s step-end infinite",
       },
     },
   },