mirror of https://github.com/ctk-hq/ctk
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
61 lines
1.3 KiB
TypeScript
61 lines
1.3 KiB
TypeScript
import { styled } from "@mui/joy";
|
|
import TextField from "../../../global/FormElements/TextField";
|
|
import Records from "../../../Records";
|
|
|
|
const Root = styled("div")`
|
|
display: flex;
|
|
flex-direction: column;
|
|
row-gap: ${({ theme }) => theme.spacing(1)};
|
|
@media (max-width: 640px) {
|
|
row-gap: 0;
|
|
}
|
|
`;
|
|
|
|
const Group = styled("div")`
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-column-gap: 0px;
|
|
grid-row-gap: 0px;
|
|
@media (max-width: 640px) {
|
|
grid-template-columns: repeat(1, 1fr);
|
|
}
|
|
column-gap: ${({ theme }) => theme.spacing(1)};
|
|
width: 100%;
|
|
`;
|
|
|
|
const General = () => {
|
|
return (
|
|
<Root>
|
|
<Group>
|
|
<TextField label="Entry name" name="entryName" required={true} />
|
|
</Group>
|
|
|
|
<Group>
|
|
<TextField label="Volume name" name="volumeName" required={true} />
|
|
</Group>
|
|
|
|
<Records
|
|
name="labels"
|
|
title="Labels"
|
|
fields={(index: number) => [
|
|
{
|
|
name: `labels[${index}].key`,
|
|
placeholder: "Key",
|
|
required: true,
|
|
type: "text"
|
|
},
|
|
{
|
|
name: `labels[${index}].value`,
|
|
placeholder: "Value",
|
|
required: true,
|
|
type: "text"
|
|
}
|
|
]}
|
|
newValue={{ key: "", value: "" }}
|
|
/>
|
|
</Root>
|
|
);
|
|
};
|
|
|
|
export default General;
|