Add Dark Mode, Password Hashing for better security , Settings Page, Policy PDF in Policy section,UI Changes

This commit is contained in:
arav
2026-01-10 19:39:40 +05:30
parent 933c0741ab
commit 9b605279e6
35 changed files with 1344 additions and 659 deletions

View File

@@ -39,9 +39,11 @@ function Input({
return (
<div
key={sectionIndex}
className="space-y-4 bg-white p-6 rounded-lg shadow-md min-w-fit border-t-4 border-red-700 mb-4"
className="space-y-4 bg-white dark:bg-google-gray p-6 rounded-lg shadow-md min-w-fit border-t-4 border-red-700 mb-4 transition-colors duration-200"
>
<h3 className="text-xl font-semibold mt-2 mb-4">{section.label}</h3>
<h3 className="text-xl font-semibold mt-2 mb-4 dark:text-google-text">
{section.label}
</h3>
<div
className={`${
section.label === "Expense Details"
@@ -76,11 +78,11 @@ function Input({
return (
<div
key={formFeild.name}
className="space-y-1 bg-slate-50 p-3 rounded-md"
className="space-y-1 bg-slate-50 dark:bg-[#3c4043] p-3 rounded-md transition-colors duration-200"
>
<label
htmlFor={formFeild.name}
className="block font-medium"
className="block font-medium dark:text-google-text"
>
{formFeild.label}
</label>
@@ -90,7 +92,7 @@ function Input({
onChange={handleChange}
onBlur={handleBlur}
value={values[formFeild.name] || ""}
className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-red-700 transition duration-300 ease-in-out"
className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md focus:outline-none focus:ring-2 focus:ring-red-700 transition duration-300 ease-in-out dark:bg-[#303134] dark:text-white"
disabled={formFeild?.disabled}
>
<option value="" label="Select option" />
@@ -119,11 +121,11 @@ function Input({
return (
<div
key={formFeild.name}
className="space-y-1 bg-slate-50 p-3 rounded-md"
className="space-y-1 bg-slate-50 dark:bg-[#3c4043] p-3 rounded-md transition-colors duration-200"
>
<label
htmlFor={formFeild.name}
className="inline-flex items-center space-x-2"
className="inline-flex items-center space-x-2 dark:text-google-text"
>
<input
type="checkbox"
@@ -149,11 +151,11 @@ function Input({
return (
<div
key={formFeild.name}
className="space-y-1 bg-slate-50 p-3 rounded-md"
className="space-y-1 bg-slate-50 dark:bg-[#3c4043] p-3 rounded-md transition-colors duration-200"
>
<label
htmlFor={formFeild.name}
className="block font-medium"
className="block font-medium dark:text-google-text"
>
{formFeild.label}
</label>
@@ -163,7 +165,7 @@ function Input({
onChange={handleChange}
onBlur={handleBlur}
value={values[formFeild.name] || ""}
className="w-full px-3 py-2 border border-gray-300 rounded-md max-h-32 min-h-20 focus:outline-none focus:ring-2 focus:ring-red-700 transition duration-300 ease-in-out"
className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md max-h-32 min-h-20 focus:outline-none focus:ring-2 focus:ring-red-700 transition duration-300 ease-in-out dark:bg-[#303134] dark:text-white"
disabled={formFeild?.disabled}
/>
<p className="text-red-500 text-sm">
@@ -178,11 +180,11 @@ function Input({
return (
<div
key={formFeild.name}
className="space-y-1 bg-slate-50 p-3 rounded-md"
className="space-y-1 bg-slate-50 dark:bg-[#3c4043] p-3 rounded-md transition-colors duration-200"
>
<label
htmlFor={formFeild.name}
className="block font-medium"
className="block font-medium dark:text-google-text"
>
{formFeild.label}
</label>
@@ -206,7 +208,7 @@ function Input({
setFieldValue(formFeild.name, e.target.files[0]);
}}
onBlur={handleBlur}
className="w-full bg-white px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-red-700 transition duration-300 ease-in-out"
className="w-full bg-white dark:bg-[#303134] dark:text-white px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md focus:outline-none focus:ring-2 focus:ring-red-700 transition duration-300 ease-in-out"
/>
<p className="text-red-500 text-sm">
{errors[formFeild.name] &&
@@ -222,7 +224,7 @@ function Input({
return (
<div
key={formFeild.name}
className="space-y-4 bg-slate-50 p-6 rounded-md w-full"
className="space-y-4 bg-slate-50 dark:bg-[#3c4043] p-6 rounded-md w-full transition-colors duration-200"
>
{pdfIsVisible && (
<PdfViewer
@@ -235,7 +237,7 @@ function Input({
<div className="flex flex-col sm:flex-row sm:justify-between sm:items-center mb-4">
<label
htmlFor={formFeild.name}
className="block text-lg font-medium text-gray-800 mb-3 sm:mb-0 sm:w-1/2"
className="block text-lg font-medium text-gray-800 dark:text-google-text mb-3 sm:mb-0 sm:w-1/2"
>
{`${formFeild.label}: ₹${values[formFeild.name]
?.reduce(
@@ -341,11 +343,11 @@ function Input({
return (
<div
key={formFeild.name}
className="space-y-1 bg-slate-50 p-3 rounded-md"
className="space-y-1 bg-slate-50 dark:bg-[#3c4043] p-3 rounded-md transition-colors duration-200"
>
<label
htmlFor={formFeild.name}
className="block font-medium"
className="block font-medium dark:text-google-text"
>
{formFeild.label}
</label>
@@ -356,7 +358,7 @@ function Input({
onChange={handleChange}
onBlur={handleBlur}
value={values[formFeild.name] || ""}
className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-red-700 transition duration-300 ease-in-out"
className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md focus:outline-none focus:ring-2 focus:ring-red-700 transition duration-300 ease-in-out dark:bg-[#303134] dark:text-white"
disabled={formFeild?.disabled}
max={formFeild?.max}
min={formFeild?.min}