From fe93da9d8a8d1c460f37a7bcf2c3f555e630d836 Mon Sep 17 00:00:00 2001
From: Robin Gloster <mail@glob.in>
Date: Sat, 21 Oct 2023 19:42:11 +0200
Subject: [PATCH] UI: border between multiple ATISs

---
 atciss-frontend/src/components/ADInfo.tsx |  2 +-
 atciss-frontend/src/components/Atis.tsx   | 11 ++++++++++-
 atciss-frontend/src/views/AtisAfw.tsx     |  3 ++-
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/atciss-frontend/src/components/ADInfo.tsx b/atciss-frontend/src/components/ADInfo.tsx
index bbdc4251..163e960e 100644
--- a/atciss-frontend/src/components/ADInfo.tsx
+++ b/atciss-frontend/src/components/ADInfo.tsx
@@ -63,7 +63,7 @@ export const ADinfo = ({ sx }: { sx?: ThemeUIStyleObject }) => {
         flexDirection: "column",
         fontSize: 3,
         fontFamily: "monospace",
-        gap: "1px",
+        gap: "2px",
         backgroundColor: "primary",
       }}
     >
diff --git a/atciss-frontend/src/components/Atis.tsx b/atciss-frontend/src/components/Atis.tsx
index 0787ac04..de1ff53e 100644
--- a/atciss-frontend/src/components/Atis.tsx
+++ b/atciss-frontend/src/components/Atis.tsx
@@ -25,7 +25,14 @@ const Atis = ({ sx }: { sx?: ThemeUIStyleObject }) => {
 
   if (!metarIsLoading && metars && !atisIsLoading && !adIsLoading && ads) {
     return (
-      <Flex sx={{ ...sx, flexDirection: "column" }}>
+      <Flex
+        sx={{
+          ...sx,
+          flexDirection: "column",
+          gap: "2px",
+          backgroundColor: "primary",
+        }}
+      >
         {aerodromes
           .filter((ad) => metars[ad] && ads[ad])
           .map((aerodrome) => {
@@ -56,9 +63,11 @@ const Atis = ({ sx }: { sx?: ThemeUIStyleObject }) => {
             return (
               <Flex
                 sx={{
+                  padding: 1,
                   flexDirection: "column",
                   fontSize: 3,
                   fontFamily: "monospace",
+                  backgroundColor: "white",
                 }}
                 key={aerodrome}
               >
diff --git a/atciss-frontend/src/views/AtisAfw.tsx b/atciss-frontend/src/views/AtisAfw.tsx
index 58e7b656..85d29d2c 100644
--- a/atciss-frontend/src/views/AtisAfw.tsx
+++ b/atciss-frontend/src/views/AtisAfw.tsx
@@ -23,8 +23,9 @@ const AtisAfw = ({ sx }: { sx?: ThemeUIStyleObject }) => {
     >
       <Atis
         sx={{
-          gridColumnEnd: "span 2",
           ...gridItemSx,
+          gridColumnEnd: "span 2",
+          padding: 0,
         }}
       />
       <Flex