From 54dc5e6eb146617569471054c8ebd95332231a49 Mon Sep 17 00:00:00 2001
From: Abinash Karmakar <codeAbinash@gmail.com>
Date: Wed, 28 Jun 2023 23:35:46 +0530
Subject: [PATCH] improved ui

---
 src/components/Header.tsx       | 6 +-----
 src/pages/ManageRoutine.tsx     | 2 +-
 src/pages/NewRoutine.tsx        | 3 ++-
 src/pages/NewRoutinesLoader.tsx | 2 +-
 src/pages/Routines.tsx          | 4 ++--
 5 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index f59e69a..ec31eac 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -7,7 +7,7 @@ import Emoji from 'emoji-store'
 function Header(props: any) {
     const navigate = useNavigate()
     const headerTitle = useRef<HTMLParagraphElement>(null)
-    const inputRef = useRef<HTMLInputElement>(null)
+    // const inputRef = useRef<HTMLInputElement>(null)
     const [isIntersecting, setIsIntersecting] = React.useState(true)
     // { title, notiIcon, placeholder, onSearch }: { title: string, notiIcon: boolean, placeholder: string, onSearch: Function | any }
     const title = props.title || 'Sample Title'
@@ -46,10 +46,6 @@ function Header(props: any) {
                         <img src={icons.search_black_48dp} className='h-[1.65rem] w-[1.65rem] dark:invert opacity-30' />
                     </div>
                     <input type="search" placeholder={placeholder}
-                        onFocus={() => {
-                            setTimeout(() => { inputRef.current?.scrollIntoView({ behavior: 'smooth', block : 'start', inline : 'start' }) }, 100);
-                        }}
-                        ref={inputRef}
                         className='search-full font-[470] bg-transparent placeholder:text-[#000]/30 dark:placeholder:text-[#fff]/30'
                         onInput={oninput}
                     />
diff --git a/src/pages/ManageRoutine.tsx b/src/pages/ManageRoutine.tsx
index 59fe8d1..276c984 100644
--- a/src/pages/ManageRoutine.tsx
+++ b/src/pages/ManageRoutine.tsx
@@ -97,7 +97,7 @@ function Routines({ deleteRoutine }: any) {
 			{
 				routines.length === 0
 					? <div className="min-h-[60dvh] justify-center items-center gap-5 flex flex-col">
-						<img src={icons.app_icon_transparent_256} className="w-[55%]" />
+						<img src={icons.app_icon_transparent_256} className="w-[55%] dark:grayscale dark:opacity-40" />
 						<p className="text-sm text-secondary text-center">
 							You haven't subscribed <br /> to any routine yet.
 						</p>
diff --git a/src/pages/NewRoutine.tsx b/src/pages/NewRoutine.tsx
index d7b0adb..c0c2d80 100644
--- a/src/pages/NewRoutine.tsx
+++ b/src/pages/NewRoutine.tsx
@@ -1,6 +1,6 @@
 import Emoji from 'emoji-store';
 import { useEffect, useMemo, useRef, useState } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router-dom';
 import icons from '../assets/icons/icons';
 import BackHeader from '../components/BackHeader';
 import { MS_IN_DAY, day } from '../lib/date';
@@ -26,6 +26,7 @@ const routineOptions = [
 
 function NewRoutine() {
 	const e = new Emoji();
+	const params = useParams()
 	const [routineName, setRoutineName] = useState('')
 	const [routineDescription, setRoutineDescription] = useState('')
 	const [routineEmoji, setRoutineEmoji] = useState('')
diff --git a/src/pages/NewRoutinesLoader.tsx b/src/pages/NewRoutinesLoader.tsx
index 9066ceb..181bcb1 100644
--- a/src/pages/NewRoutinesLoader.tsx
+++ b/src/pages/NewRoutinesLoader.tsx
@@ -63,7 +63,7 @@ export function GetRoutines({ screenRoutines, allRoutines }: { screenRoutines: R
     if (screenRoutines.length === 0)
         return <div className='h-[50vh] flex flex-col items-center justify-center gap-3'>
             <p className='text-[#777]/50 text-center text-sm font-medium'>No Routine <TextEmoji emoji='🤔' /></p>
-            <img src={icons.app_icon_transparent_256} className="w-[50%] dark:grayscale dark:opacity-30" />
+            <img src={icons.app_icon_transparent_256} className="w-[50%] dark:grayscale dark:opacity-40" />
             <p className='text-xs text-center text-[#777]/50 font-medium'>Go to Routines tab to see all routines <TextEmoji emoji="💫" /></p>
         </div>
 
diff --git a/src/pages/Routines.tsx b/src/pages/Routines.tsx
index 3ba8e3b..9ccacb0 100644
--- a/src/pages/Routines.tsx
+++ b/src/pages/Routines.tsx
@@ -153,7 +153,7 @@ function Routines() {
 //             return AllRoutines(routines.holiday)
 // }
 
-function AllRoutines({ screenRoutines, allRoutines, expiredRoutines }: { screenRoutines: Routine[] | null, allRoutines: Routine[] | null, expiredRoutines : Routine[]}) {
+function AllRoutines({ screenRoutines, allRoutines, expiredRoutines }: { screenRoutines: Routine[] | null, allRoutines: Routine[] | null, expiredRoutines: Routine[] }) {
     // console.log(screenRoutines)
     const navigate = useNavigate()
     const [currentRoutineViewIndex, setCurrentRoutineViewIndex] = useState(0)
@@ -167,7 +167,7 @@ function AllRoutines({ screenRoutines, allRoutines, expiredRoutines }: { screenR
     if (screenRoutines.length === 0) return (
         <div className="flex flex-col gap-10 mt-10 min-h-[55vh] justify-center items-center">
             <div className='flex flex-col gap-5 px-5 justify-center items-center'>
-                <img src={icons.app_icon_transparent_256} className="w-[55%]" />
+                <img src={icons.app_icon_transparent_256} className="w-[55%] dark:grayscale dark:opacity-40" />
                 <p className='text-center text-[#777]/70 text-base font-medium'>No Routine <TextEmoji emoji='🙄' />
                 </p>
                 <p className='text-center text-[#777]/50 text-xs font-[450] mb-5 '>You can create a new routine or apply a <br /> routine from the