From 2fd2e93f55e66fd47cc10f035065d4fc8298697e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Tue, 16 Apr 2024 21:58:08 -0500
Subject: [PATCH] feat: shadows

---
 src/app/tools/statistics/components/Day.tsx | 52 +++++++--------------
 1 file changed, 17 insertions(+), 35 deletions(-)

diff --git a/src/app/tools/statistics/components/Day.tsx b/src/app/tools/statistics/components/Day.tsx
index bc2a80780..4fbb36159 100644
--- a/src/app/tools/statistics/components/Day.tsx
+++ b/src/app/tools/statistics/components/Day.tsx
@@ -69,48 +69,30 @@ export function Day({ offset }: DayProps) {
                 overflowY: 'hidden',
               }}
             >
-              <Flex
-                align="center"
-                justify="center"
+              <img
+                src={tankIcon(tank.id)}
                 style={{
                   position: 'absolute',
-                  width: 128,
+                  width: 128 + 32,
                   height: '200%',
                   top: '-50%',
-                  left: 16,
-                }}
-              >
-                <img
-                  src={tankIcon(tank.id)}
-                  style={{
-                    objectFit: 'contain',
-                    objectPosition: 'left',
-                    overflow: 'hidden',
-                  }}
-                />
-              </Flex>
-
-              <Flex
-                style={{
-                  position: 'absolute',
-                  top: 0,
                   left: 0,
-                  width: 128,
-                  height: '100%',
-                  paddingLeft: 32,
-                  background:
-                    'linear-gradient(90deg, #00000000, #00000060, #00000000)',
+                  boxShadow: 'inset 128px 0 64px -64px #00000040',
+                  objectFit: 'contain',
+                  objectPosition: '50% 50%',
+                  overflow: 'hidden',
+                }}
+              />
+
+              <Text
+                style={{
+                  position: 'relative',
+                  textWrap: 'nowrap',
+                  textShadow: 'black 0 0 4px',
                 }}
-                align="center"
               >
-                <Text
-                  style={{
-                    textWrap: 'nowrap',
-                  }}
-                >
-                  {tank.name}
-                </Text>
-              </Flex>
+                {tank.name}
+              </Text>
             </Table.RowHeaderCell>
             <Table.Cell align="right">{random(1, 10)}</Table.Cell>
             <Table.Cell align="right">