feat: styled create status button and header
This commit is contained in:
@ -28,7 +28,8 @@ const BoardsMobile = () => {
|
|||||||
offsetScrollbars={"x"}
|
offsetScrollbars={"x"}
|
||||||
scrollbars={"x"}
|
scrollbars={"x"}
|
||||||
scrollbarSize={0}
|
scrollbarSize={0}
|
||||||
w={"100vw"}>
|
w={"100vw"}
|
||||||
|
mt={5}>
|
||||||
<Group
|
<Group
|
||||||
wrap={"nowrap"}
|
wrap={"nowrap"}
|
||||||
gap={0}>
|
gap={0}>
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Box, Text } from "@mantine/core";
|
import { IconPlus } from "@tabler/icons-react";
|
||||||
|
import { Box } from "@mantine/core";
|
||||||
import { useStatusesContext } from "@/app/deals/contexts/StatusesContext";
|
import { useStatusesContext } from "@/app/deals/contexts/StatusesContext";
|
||||||
import InPlaceInput from "@/components/ui/InPlaceInput/InPlaceInput";
|
import InPlaceInput from "@/components/ui/InPlaceInput/InPlaceInput";
|
||||||
|
|
||||||
@ -8,12 +9,9 @@ const CreateStatusButton = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
|
ml={6}
|
||||||
|
className={"flex-nowrap border-b-3 border-blue-500 mb-3"}
|
||||||
style={{
|
style={{
|
||||||
borderWidth: 1,
|
|
||||||
borderStyle: "dashed",
|
|
||||||
borderColor: "gray",
|
|
||||||
width: "15vw",
|
|
||||||
minWidth: 150,
|
|
||||||
cursor: "pointer",
|
cursor: "pointer",
|
||||||
}}>
|
}}>
|
||||||
<InPlaceInput
|
<InPlaceInput
|
||||||
@ -21,12 +19,17 @@ const CreateStatusButton = () => {
|
|||||||
onComplete={onCreateStatus}
|
onComplete={onCreateStatus}
|
||||||
getChildren={startEditing => (
|
getChildren={startEditing => (
|
||||||
<Box
|
<Box
|
||||||
p={9}
|
p={15}
|
||||||
onClick={() => startEditing()}>
|
onClick={() => startEditing()}>
|
||||||
<Text>Создать колонку</Text>
|
<IconPlus size={20} />
|
||||||
</Box>
|
</Box>
|
||||||
)}
|
)}
|
||||||
modalTitle={"Создание колонки"}
|
modalTitle={"Создание колонки"}
|
||||||
|
inputStyles={{
|
||||||
|
wrapper: {
|
||||||
|
padding: 4,
|
||||||
|
},
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</Box>
|
</Box>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -86,7 +86,7 @@ const Funnel: FC = () => {
|
|||||||
<Group
|
<Group
|
||||||
align={"start"}
|
align={"start"}
|
||||||
wrap={"nowrap"}
|
wrap={"nowrap"}
|
||||||
gap={"sm"}>
|
gap={0}>
|
||||||
{renderFunnelDnd()}
|
{renderFunnelDnd()}
|
||||||
</Group>
|
</Group>
|
||||||
</ScrollArea>
|
</ScrollArea>
|
||||||
|
|||||||
@ -36,7 +36,7 @@ const Header = () => {
|
|||||||
|
|
||||||
const getMobileHeader = () => {
|
const getMobileHeader = () => {
|
||||||
return (
|
return (
|
||||||
<Stack>
|
<Stack gap={0}>
|
||||||
<Group justify={"space-between"}>
|
<Group justify={"space-between"}>
|
||||||
<Box p={"md"}>
|
<Box p={"md"}>
|
||||||
<IconChevronLeft />
|
<IconChevronLeft />
|
||||||
|
|||||||
Reference in New Issue
Block a user