admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: ui settings (#465)

Browse Source
This commit is contained in:
Jérémy M
2023-06-30 11:35:01 +02:00
committed by GitHub
parent 91608a37f2
commit 19a1f2b9f8
6 changed files with 91 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
front/src/modules/ui/components/section-titles/MainSectionTitle.tsx
View File

@ -10,6 +10,7 @@ const StyledMainSectionTitle = styled.h2`
font-size: ${({ theme }) => theme.font.size.xl};
font-weight: ${({ theme }) => theme.font.weight.semiBold};
line-height: 1.5;
margin: 0;
`;
export function MainSectionTitle({ children }: OwnProps) {

32
front/src/modules/ui/components/section-titles/SubSectionTitle.tsx
View File

@ -1,17 +1,35 @@
import { ReactNode } from 'react';
import styled from '@emotion/styled';
type OwnProps = {
children: ReactNode;
type Props = {
title: string;
description?: string;
};
const StyledSubSectionTitle = styled.h2`
const StyledContainer = styled.div`
display: flex;
flex-direction: column;
`;
const StyledTitle = styled.h2`
color: ${({ theme }) => theme.font.color.primary};
font-size: ${({ theme }) => theme.font.size.md};
font-weight: ${({ theme }) => theme.font.weight.semiBold};
line-height: 1.5;
margin: 0;
`;
export function SubSectionTitle({ children }: OwnProps) {
return <StyledSubSectionTitle>{children}</StyledSubSectionTitle>;
const StyledDescription = styled.h3`
color: ${({ theme }) => theme.font.color.tertiary};
font-size: ${({ theme }) => theme.font.size.md};
font-weight: ${({ theme }) => theme.font.weight.regular};
margin: 0;
margin-top: ${({ theme }) => theme.spacing(1)};
`;
export function SubSectionTitle({ title, description }: Props) {
return (
<StyledContainer>
<StyledTitle>{title}</StyledTitle>
{description && <StyledDescription>{description}</StyledDescription>}
</StyledContainer>
);
}