Desktop Design

Mobile Design

<button class="cursor-pointer hover:text-Very-Dark-Grayish-Blue text-bright-blue" role="tab" aria-se ...

<button class="cursor-pointer" aria-label="switch theme to dark or light"><img class="w-7 h-7" alt=" ...

<form class="flex gap-4 items-center  py-4 px-6 rounded-md  bg-white"><div class="w-fit flex items-c ...

<input class="focus:outline-none placeholder:text-Dark-Grayish-Blue placeholder:text-Dark-Grayish-Bl ...

<p class="break-words whitespace-normal min-w-0 w-full  line-through text-Light-Grayish-Blue " role= ...

<div id="DndLiveRegion-0" role="status" aria-live="assertive" aria-atomic="true" style="position: fi ...

return list.filter((e)=>e.completed===false); break;

import { useContext, useMemo, useRef } from 'react'