feat: board inplace input in form of tab

src/app/deals/components/shared/CreateBoardButton/CreateBoardButton.tsx

@@ -1,5 +1,5 @@
 import { IconPlus } from "@tabler/icons-react";
-import { Box, Flex } from "@mantine/core";
+import { Box, Flex, rem } from "@mantine/core";
 import { useBoardsContext } from "@/app/deals/contexts/BoardsContext";
 import InPlaceInput from "@/components/ui/InPlaceInput/InPlaceInput";
 import styles from "./CreateBoardButton.module.css";
@@ -8,7 +8,7 @@ const CreateBoardButton = () => {
     const { onCreateBoard } = useBoardsContext();
 
     return (
-        <Flex style={{borderBottom: "2px solid gray"}}>
+        <Flex style={{ borderBottom: "2px solid gray" }}>
             <InPlaceInput
                 placeholder={"Название доски"}
                 onComplete={onCreateBoard}
@@ -19,6 +19,17 @@ const CreateBoardButton = () => {
                         <IconPlus />
                     </Box>
                 )}
+                inputStyles={{
+                    wrapper: {
+                        marginRight: "var(--mantine-spacing-xs)",
+                        paddingBlock: rem(3),
+                        paddingLeft: "var(--mantine-spacing-xs)",
+                        backgroundColor:
+                            "light-dark(var(--mantine-color-gray-2), var(--mantine-color-dark-6))",
+                        borderTopLeftRadius: "var(--mantine-spacing-xs)",
+                        borderTopRightRadius: "var(--mantine-spacing-xs)",
+                    },
+                }}
                 modalTitle={"Создание доски"}
             />
         </Flex>