color 2

NishilJ · Nov 20, 2024 · 74f81dc · 74f81dc
1 parent 031b8a7
commit 74f81dc
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 7 deletions.
diff --git a/src/components/Departures.tsx b/src/components/Departures.tsx
@@ -206,7 +206,8 @@ const Departures: React.FC = () => {
         <Flex direction="row" gap="size-200" alignItems="start" wrap="nowrap" width="100%">
             {/* First box for the ComboBox and Buttons */}
             <View
-                backgroundColor="gray-100"
+                colorVersion={6}
+                backgroundColor="seafoam-100"
                 padding="size-300"
                 borderRadius="medium"
                 flex="1"
@@ -253,7 +254,8 @@ const Departures: React.FC = () => {
                 {/* Conditional rendering for Favorites section */}
                 {showFavoritesMenu && (
                     <View
-                        backgroundColor="gray-100"
+                        colorVersion={6}
+                        backgroundColor="seafoam-100"
                         padding="size-300"
                         borderRadius="medium"
                         marginTop="size-200"
@@ -284,7 +286,8 @@ const Departures: React.FC = () => {
 
             {/* Second box for departures information */}
             <View
-                backgroundColor="gray-100"
+                colorVersion={6}
+                backgroundColor="seafoam-100"
                 padding="size-300"
                 paddingTop="size-200"
                 borderRadius="medium"
@@ -337,7 +340,8 @@ const Departures: React.FC = () => {
                                 const arrivalTime = selectedStop.place?.arrival;
 
                                 return (
-                                    <View key={idx} marginBottom="size-200" padding="size-200" backgroundColor="gray-200" borderRadius="medium">
+                                    <View key={idx} marginBottom="size-200" padding="size-200" colorVersion={6}
+                                          backgroundColor="seafoam-300" borderRadius="medium">
                                         <Text>
                                             <strong>Route:</strong> {selectedStop.routeShortName} <br />
                                             <strong>Headsign:</strong> {selectedStop.headsign} <br />

diff --git a/src/components/TripPlanner.tsx b/src/components/TripPlanner.tsx
@@ -300,7 +300,8 @@ const TripPlanner: React.FC = () => {
 
                 {/* Display Trip Suggestions */}
                 {showTrips && (
-                    <View backgroundColor="gray-100" padding="size-300" width="size-6000" marginX="auto"
+                    <View colorVersion={6}
+                          backgroundColor="seafoam-100" padding="size-300" width="size-6000" marginX="auto"
                           borderRadius="medium">
                         {error ? (
                             <Text UNSAFE_style={{color: 'red'}}>{error}</Text>
@@ -330,7 +331,8 @@ const TripPlanner: React.FC = () => {
             <Flex direction="column" justifyContent="center">
                 {/* Display Trip Details */}
                 {showTripDetails && (
-                    <View backgroundColor="gray-100" padding="size-300" borderRadius="medium" width="size-6000"
+                    <View colorVersion={6}
+                          backgroundColor="seafoam-100" padding="size-300" borderRadius="medium" width="size-6000"
                           marginTop="size-300" maxHeight="size-8000" overflow="auto">
                         <Content>
                             <Heading level={4}>{fromPlace?.name} - {toPlace?.name}</Heading>

diff --git a/src/components/UpdateAccount.tsx b/src/components/UpdateAccount.tsx
@@ -115,7 +115,8 @@ const UpdateAccount: React.FC = () => {
 
   return (
     <Flex justifyContent="center">
-      <View padding="size-300" backgroundColor="gray-50" width="size-4600" borderRadius="medium">
+      <View padding="size-300" colorVersion={6}
+            backgroundColor="seafoam-100" width="size-4600" borderRadius="medium">
         <Heading level={2}>Account Settings</Heading>
         <Divider marginBottom="size-300" />
         <Flex direction="column" gap="size-200">