wip: small random ui changes

client/src/components/Widgets/AlertChanges.jsx

@@ -62,10 +62,10 @@ export default function AlertChanges({ settings, widgetID}) {
 
   // Alert colors are now light/dark mode responsive
   const alertColors = {
-    Red: "alertRed",
+    Red: "Red",
-    Orange: "alertOrange",
+    Orange: "Orange",
-    Yellow: "alertYellow",
+    Yellow: "Yellow",
-    Green: "alertGreen",
+    Green: "Green",
   };
 
   if (isLoading) return (
@@ -126,7 +126,7 @@ export default function AlertChanges({ settings, widgetID}) {
                               {object?.alert_scheme_domain === "aviation" && <Plane size={15} />}
                               {object?.alert_scheme_domain === "maritime" && <Sailboat size={15} />}
                             </Timeline.Indicator>
-                            <Timeline.Indicator h="50%" outline="none" bg="widgetBadgeBg" color="iconColor" size="lg">
+                            <Timeline.Indicator h="50%" outline="none" bg="transparent" color="iconColor" size="lg">
                               {object?.change_type === "increase" ? <TrendingUp /> : <TrendingDown />}
                             </Timeline.Indicator>
                           </Timeline.Connector>

client/src/components/Widgets/IvansAlerts.jsx

@@ -111,18 +111,17 @@ export default function IvansAlerts({ settings, widgetID }) {
                   <Collapsible.Content w="100%" h="auto">
                     {/* This box needs to be at h="100%" for the pdf toolbar to appear */}
                     <Box w="100%" h="100%" p={1} borderBottomRadius="lg" bg="widgetItemExpandedBg">
-                      <Flex direction="column" gap={2} bg="widgetItemBg" borderRadius="lg" p={2} align="end">
+                      <Flex direction="column" gap={2} borderRadius="lg" p={2} align="start">
-                        <Text w="100%" h="100%" fontSize="sm" color="text" textAlign="left" whiteSpace="pre-line">{item?.summary}</Text>
                         <Text w="fit" fontSize="sm" color="text" pl={1} pr={1} bg="widgetBadgeBg" borderRadius="md">Preparer: {item?.preparer}</Text>
+                        <Text w="100%" h="100%" fontSize="sm" color="text" textAlign="left" whiteSpace="pre-line">{item?.summary}</Text>
                       </Flex>
                       {item?.files?.map((file, index) => {
                         return (
                           <Box w="100%" h="100%" key={index} p={1}>
-                            <br />
                             <Flex mb={2} justify="space-between">
                               <Text pl={1} pr={1} bg="widgetBadgeBg" borderRadius="md" fontSize="xs" color="text">{file?.name}</Text>
                               <Box borderRadius="lg" bg="widgetBadgeBg" color="text" pl={1} pr={1} fontSize={13} asChild>
-                                <a href={`${file?.url}#view=FitV&toolbar=1`} target="_blank" rel="noopener noreferrer">
+                                <a href={`${file?.url}#view=FitV&toolbar=0`} target="_blank" rel="noopener noreferrer">
                                   Open
                                 </a>
                               </Box>

client/src/components/Widgets/RemoteSensing.jsx

@@ -96,7 +96,7 @@ export default function RemoteSensing({ settings, widgetID }) {
                   <Collapsible.Content w="100%" h="auto">
                     {/* This box needs to be at h="100%" for the pdf toolbar to appear */}
                     <Box w="100%" h="100%" p={1} borderBottomRadius="lg" bg="widgetItemExpandedBg">
-                      <Flex direction="column" gap={2} bg="widgetItemBg" borderRadius="lg" p={2} align="end">
+                      <Flex direction="column" gap={2} borderRadius="lg" p={2} align="end">
                         <Text w="100%" h="100%" fontSize="sm" color="text" textAlign="left" whiteSpace="pre-line">{item?.summary}</Text>
                         <Text w="fit" fontSize="sm" color="text" pl={1} pr={1} bg="widgetBadgeBg" borderRadius="md">Source: {item?.sender}</Text>
                       </Flex>