Merge pull request #578 from AnushkaChouhan25/main

Enhance Registration Form background design
Luson045 · Oct 30, 2024 · 8e41e25 · 8e41e25
2 parents 9d036f8 + 3af9338
commit 8e41e25
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 3 deletions.
diff --git a/client/src/components/MultiStepRegistration.jsx b/client/src/components/MultiStepRegistration.jsx
@@ -3,6 +3,7 @@ import { Steps, message } from 'antd';
 import StepOne from './StepOne';
 import { Provider } from '../store/RegistrationContext';
 import StepTwo from './StepTwo';
+import '../styles/Login.css';
 import ReviewDetails from './ReviewDetails';
 import { useRecoilValue } from 'recoil'; // Import Recoil for dark mode state
 import { mode } from '../store/atom'; // Import the dark mode atom

diff --git a/client/src/styles/Login.css b/client/src/styles/Login.css
@@ -40,11 +40,11 @@
   height: 200%;
   background: linear-gradient(
     45deg,
-    rgba(255, 255, 255, 0.4),
+    #111827,
     rgba(255, 255, 255, 0)
   );
   transform: rotate(0deg);
-  animation: shine 3s infinite;
+  animation: shine 5s infinite;
   pointer-events: none;
 }
 

diff --git a/client/src/styles/OPD.css b/client/src/styles/OPD.css
@@ -9,9 +9,41 @@
     background-color 0.3s ease,
     color 0.3s ease;
 }
+.form-container::before {
+  content: '';
+  position: absolute;
+  top: -50px;
+  left: -50px;
+  width: 60%;
+  height: 63%;
+  background: linear-gradient(
+    45deg,
+    #ABCFFC,
+    rgba(255, 255, 255, 0)
+  );
+  transform: rotate(0deg);
+  animation: shine 2s infinite;
+  pointer-events: none;
+}
+.dark .form-container::before {
+  content: '';
+  position: absolute;
+  top: -50px;
+  left: -50px;
+  width: 60%;
+  height: 65%;
+  background: linear-gradient(
+    45deg,
+    #525356,
+    rgba(255, 255, 255, 0)
+  );
+  transform: rotate(0deg);
+  animation: shine 2s infinite;
+  pointer-events: none;
+}
 
 .dark .form-container {
-  background-color: #333;
+  background-color: #111827;
   color: #f1f1f1;
   box-shadow: 0 6px 16px rgba(255, 255, 255, 0.1);
 }