feat: deal card, deal status, deal new dates, indicator, hide navbar

src/components/HideNavbarAffix/HideNavbarAffix.module.css

@@ -0,0 +1,10 @@
+.icon {
+    box-shadow: 3px 3px 20px 2px rgb(0 0 0 / 8%), -3px -3px 20px 2px rgba(0, 0, 0, 0.08);
+    @mixin dark {
+        background-color: #454545;
+    }
+    @mixin light {
+        background-color: #f1f6f8;
+        color: var(--mantine-color-dark-3);
+    }
+}

src/components/HideNavbarAffix/HideNavbarAffix.tsx

@@ -0,0 +1,52 @@
+import { ActionIcon, Affix, AffixProps, rem, Transition } from "@mantine/core";
+import { IconArrowRight } from "@tabler/icons-react";
+import { useSelector } from "react-redux";
+import { RootState, useAppDispatch } from "../../redux/store.ts";
+import { setHideNavbar } from "../../features/uiSlice.ts";
+import { FC } from "react";
+import stylesCss from "./HideNavbarAffix.module.css";
+
+type Props = AffixProps;
+const HideNavbarAffix: FC<Props> = (props) => {
+    const uiState = useSelector((state: RootState) => state.ui);
+    const dispatch = useAppDispatch();
+    return (
+        <>
+            {/*{uiState.hideNavbar && (*/}
+            <Transition
+                transition={"slide-right"}
+                mounted={uiState.hideNavbar}
+            >
+                {styles => (
+                    <Affix
+                        style={styles}
+                        position={{
+                            top: "50%",
+                            left: rem(20),
+                        }}
+                        {...props}
+                    >
+                        <ActionIcon
+                            onClick={() => {
+                                dispatch(setHideNavbar(false));
+
+                            }}
+                            className={stylesCss["icon"]}
+                            // color={"#2d2d2d"}
+                            radius="xl"
+                            size={45}>
+                            <IconArrowRight
+                                stroke={1.5}
+                                // size={30}
+                            />
+                        </ActionIcon>
+                    </Affix>)}
+            </Transition>
+            {/*)*/}
+            {/*}*/}
+        </>
+
+    );
+};
+
+export default HideNavbarAffix;