d6afbe8e8e
* Introduce accent for chips * Add top bar on Mobile on Settings pages * Various fixes * Fix according to peer review
48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
import styled from '@emotion/styled';
|
|
|
|
import { NameField } from '@/settings/workspace/components/NameField';
|
|
import { WorkspaceLogoUploader } from '@/settings/workspace/components/WorkspaceLogoUploader';
|
|
import { IconSettings } from '@/ui/icon';
|
|
import { SubMenuTopBarContainer } from '@/ui/layout/components/SubMenuTopBarContainer';
|
|
import { MainSectionTitle } from '@/ui/title/components/MainSectionTitle';
|
|
import { SubSectionTitle } from '@/ui/title/components/SubSectionTitle';
|
|
|
|
const StyledContainer = styled.div`
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: ${({ theme }) => theme.spacing(8)};
|
|
width: 350px;
|
|
> * + * {
|
|
margin-top: ${({ theme }) => theme.spacing(8)};
|
|
}
|
|
`;
|
|
|
|
const StyledSectionContainer = styled.div`
|
|
> * + * {
|
|
margin-top: ${({ theme }) => theme.spacing(4)};
|
|
}
|
|
`;
|
|
|
|
export function SettingsWorksapce() {
|
|
return (
|
|
<SubMenuTopBarContainer icon={<IconSettings size={16} />} title="Settings">
|
|
<div>
|
|
<StyledContainer>
|
|
<MainSectionTitle>General</MainSectionTitle>
|
|
<StyledSectionContainer>
|
|
<SubSectionTitle title="Picture" />
|
|
<WorkspaceLogoUploader />
|
|
</StyledSectionContainer>
|
|
<StyledSectionContainer>
|
|
<SubSectionTitle
|
|
title="Name"
|
|
description="Name of your workspace"
|
|
/>
|
|
<NameField />
|
|
</StyledSectionContainer>
|
|
</StyledContainer>
|
|
</div>
|
|
</SubMenuTopBarContainer>
|
|
);
|
|
}
|