From 4b04ea90a6eff134855f1fe281a72b87a569edf1 Mon Sep 17 00:00:00 2001
From: Desmond Atikpui <desmondatikpui3003@gmail.com>
Date: Sat, 5 Oct 2024 11:40:13 -0400
Subject: [PATCH 1/2] Fixing the styling issue in Students page etc

---
 .../src/components/RideModal/Pages/RideTimes.tsx |  4 ++++
 .../components/RideModal/ridemodal.module.css    | 16 ++++------------
 2 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/frontend/src/components/RideModal/Pages/RideTimes.tsx b/frontend/src/components/RideModal/Pages/RideTimes.tsx
index aa6bbb35..4c4a6871 100644
--- a/frontend/src/components/RideModal/Pages/RideTimes.tsx
+++ b/frontend/src/components/RideModal/Pages/RideTimes.tsx
@@ -194,6 +194,7 @@ const RideTimesPage: React.FC<RideTimesProps> = ({
                 },
               })}
               aria-required="true"
+              className={cn(styles.dateStyle)}
             />
             {errors.date?.type === 'required' && (
               <p className={styles.error}>Please enter a date</p>
@@ -211,6 +212,7 @@ const RideTimesPage: React.FC<RideTimesProps> = ({
               {...register('repeats', {
                 required: 'Please select a repeat option',
               })}
+              className={cn(styles.selectInputContainer,styles.selectInput)}
             >
               {repeatOptions.map((option) => (
                 <option key={option.id} value={option.id}>
@@ -228,6 +230,7 @@ const RideTimesPage: React.FC<RideTimesProps> = ({
             <Input
               id="pickupTime"
               type="time"
+              className={cn(styles.timeStyle)}
               {...register('pickupTime', {
                 required: true,
                 validate: (pickupTime: string) => {
@@ -250,6 +253,7 @@ const RideTimesPage: React.FC<RideTimesProps> = ({
             <Input
               id="dropoffTime"
               type="time"
+              className={cn(styles.timeStyle)}
               {...register('dropoffTime', {
                 required: true,
                 validate: (dropoffTime: string) => {
diff --git a/frontend/src/components/RideModal/ridemodal.module.css b/frontend/src/components/RideModal/ridemodal.module.css
index d45447cd..a7e1acd7 100644
--- a/frontend/src/components/RideModal/ridemodal.module.css
+++ b/frontend/src/components/RideModal/ridemodal.module.css
@@ -25,9 +25,9 @@
 }
 
 /* Input styles */
-input[type='date'],
-input[type='time'],
-select {
+.dateStyle,
+.timeStyle,
+.selectInputContainer {
   width: 100%;
   padding: 0.75rem;
   font-size: 1rem;
@@ -37,16 +37,8 @@ select {
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
 }
 
-input[type='date']:focus,
-input[type='time']:focus,
-select:focus {
-  outline: none;
-  border-color: #80bdff;
-  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
-}
-
 /* Styled select */
-select {
+.selectInput {
   appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;

From 60067efa6aadcda451e148b1df470d7e56243c35 Mon Sep 17 00:00:00 2001
From: Desmond Atikpui <desmondatikpui3003@gmail.com>
Date: Sat, 5 Oct 2024 11:42:48 -0400
Subject: [PATCH 2/2] Prettier Fix again :/

---
 frontend/src/components/RideModal/Pages/RideTimes.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/RideModal/Pages/RideTimes.tsx b/frontend/src/components/RideModal/Pages/RideTimes.tsx
index 4c4a6871..a797d7ae 100644
--- a/frontend/src/components/RideModal/Pages/RideTimes.tsx
+++ b/frontend/src/components/RideModal/Pages/RideTimes.tsx
@@ -212,7 +212,7 @@ const RideTimesPage: React.FC<RideTimesProps> = ({
               {...register('repeats', {
                 required: 'Please select a repeat option',
               })}
-              className={cn(styles.selectInputContainer,styles.selectInput)}
+              className={cn(styles.selectInputContainer, styles.selectInput)}
             >
               {repeatOptions.map((option) => (
                 <option key={option.id} value={option.id}>