eliott/docs
1
0
Fork 0
mirror of https://github.com/suitenumerique/docs.git synced 2026-05-09 08:32:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

wip

Browse Source
This commit is contained in:
Nathan Vasse
2024-09-12 14:14:00 +02:00
parent 4045969703
commit a009f8e35e
11 changed files with 117 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/frontend/apps/impress/.env
View File

@@ -1,4 +1,4 @@
NEXT_PUBLIC_API_ORIGIN=
NEXT_PUBLIC_Y_PROVIDER_URL=
NEXT_PUBLIC_MEDIA_URL=
NEXT_PUBLIC_THEME=openDesk
NEXT_PUBLIC_THEME=dsfr

10
src/frontend/apps/impress/cunningham.ts
View File

@@ -21,6 +21,10 @@ const config = {
black: 900,
},
},
spacings: {
'0': '0',
none: '0',
},
},
},
dsfr: {
@@ -102,6 +106,12 @@ const config = {
base: 'Marianne',
},
},
logo: {
src: '/assets/logo-gouv.svg',
widthHeader: '110px',
widthFooter: '220px',
alt: 'Gouvernement Logo',
},
},
components: {
alert: {

70
src/frontend/apps/impress/src/cunningham/cunningham-tokens.css
View File

@@ -99,12 +99,14 @@
--c--theme--font--letterspacings--l: normal;
--c--theme--font--letterspacings--m: normal;
--c--theme--font--letterspacings--s: normal;
--c--theme--spacings--0: 0;
--c--theme--spacings--xl: 4rem;
--c--theme--spacings--l: 3rem;
--c--theme--spacings--b: 1.625rem;
--c--theme--spacings--s: 1rem;
--c--theme--spacings--t: 0.5rem;
--c--theme--spacings--st: 0.25rem;
--c--theme--spacings--none: 0;
--c--theme--transitions--ease-in: cubic-bezier(0.32, 0, 0.67, 0);
--c--theme--transitions--ease-out: cubic-bezier(0.33, 1, 0.68, 1);
--c--theme--transitions--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
@@ -236,6 +238,10 @@
--c--theme--colors--danger-900: #3a1c1c;
--c--theme--font--families--accent: Marianne;
--c--theme--font--families--base: Marianne;
--c--theme--logo--src: /assets/logo-gouv.svg;
--c--theme--logo--widthHeader: 110px;
--c--theme--logo--widthFooter: 220px;
--c--theme--logo--alt: Gouvernement Logo;
--c--components--alert--border-radius: 0;
--c--components--alert--background-color: var(
--c--theme--colors--greyscale-000
@@ -363,7 +369,9 @@
--c--components--button--primary--background--color-hover: var(
--c--theme--colors--primary-900
);
--c--components--button--primary--background--color-active: #2323ff;
--c--components--button--primary--background--color-active: var(
--c--theme--colors--primary-900
);
--c--components--button--primary--color: #ffffff;
--c--components--button--primary--color-hover: #ffffff;
--c--components--button--primary--color-active: #ffffff;
@@ -889,6 +897,21 @@
.f-accent {
font-family: var(--c--theme--font--families--accent);
}
.m-0 {
margin: var(--c--theme--spacings--0);
}
.mb-0 {
margin-bottom: var(--c--theme--spacings--0);
}
.mt-0 {
margin-top: var(--c--theme--spacings--0);
}
.ml-0 {
margin-left: var(--c--theme--spacings--0);
}
.mr-0 {
margin-right: var(--c--theme--spacings--0);
}
.m-xl {
margin: var(--c--theme--spacings--xl);
}
@@ -979,6 +1002,36 @@
.mr-st {
margin-right: var(--c--theme--spacings--st);
}
.m-none {
margin: var(--c--theme--spacings--none);
}
.mb-none {
margin-bottom: var(--c--theme--spacings--none);
}
.mt-none {
margin-top: var(--c--theme--spacings--none);
}
.ml-none {
margin-left: var(--c--theme--spacings--none);
}
.mr-none {
margin-right: var(--c--theme--spacings--none);
}
.p-0 {
padding: var(--c--theme--spacings--0);
}
.pb-0 {
padding-bottom: var(--c--theme--spacings--0);
}
.pt-0 {
padding-top: var(--c--theme--spacings--0);
}
.pl-0 {
padding-left: var(--c--theme--spacings--0);
}
.pr-0 {
padding-right: var(--c--theme--spacings--0);
}
.p-xl {
padding: var(--c--theme--spacings--xl);
}
@@ -1069,3 +1122,18 @@
.pr-st {
padding-right: var(--c--theme--spacings--st);
}
.p-none {
padding: var(--c--theme--spacings--none);
}
.pb-none {
padding-bottom: var(--c--theme--spacings--none);
}
.pt-none {
padding-top: var(--c--theme--spacings--none);
}
.pl-none {
padding-left: var(--c--theme--spacings--none);
}
.pr-none {
padding-right: var(--c--theme--spacings--none);
}

10
src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts
View File

@@ -115,12 +115,14 @@ export const tokens = {
},
},
spacings: {
'0': '0',
xl: '4rem',
l: '3rem',
b: '1.625rem',
s: '1rem',
t: '0.5rem',
st: '0.25rem',
none: '0',
},
transitions: {
'ease-in': 'cubic-bezier(0.32, 0, 0.67, 0)',
@@ -264,6 +266,12 @@ export const tokens = {
'danger-900': '#3a1c1c',
},
font: { families: { accent: 'Marianne', base: 'Marianne' } },
logo: {
src: '/assets/logo-gouv.svg',
widthHeader: '110px',
widthFooter: '220px',
alt: 'Gouvernement Logo',
},
},
components: {
alert: {
@@ -386,7 +394,7 @@ export const tokens = {
background: {
color: 'var(--c--theme--colors--primary-700)',
'color-hover': 'var(--c--theme--colors--primary-900)',
'color-active': '#2323ff',
'color-active': 'var(--c--theme--colors--primary-900)',
},
color: '#ffffff',
'color-hover': '#ffffff',

1
src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx
View File

@@ -39,6 +39,7 @@ export const DocHeader = ({ doc, versionId }: DocHeaderProps) => {
<Text
$isMaterialIcon
$theme="primary"
$variation="600"
$size="2rem"
$css={`&:hover {background-color: ${colorsTokens()['primary-100']}; };`}
$hasTransition

2
src/frontend/apps/impress/src/features/docs/doc-management/components/ModalCreateUpdateDoc.tsx
View File

@@ -145,7 +145,7 @@ const ModalDoc = <T,>({
size={ModalSize.MEDIUM}
title={
<Box $align="center" $gap="1rem" $margin={{ bottom: '2.5rem' }}>
<IconEdit width={48} color={colorsTokens()['primary-text']} />
<IconEdit width={48} color={colorsTokens()['primary-8 00']} />
<Text as="h2" $size="h3" $margin="none">
{titleModal}
</Text>

2
src/frontend/apps/impress/src/features/docs/doc-management/components/ModalShare.tsx
View File

@@ -54,7 +54,7 @@ export const ModalShare = ({ onClose, doc }: ModalShareProps) => {
$padding="tiny"
$gap="1rem"
>
<Text $isMaterialIcon $size="48px" $theme="primary">
<Text $isMaterialIcon $size="48px" $theme="primary" $variation="600">
share
</Text>
<Box $align="flex-start">

17
src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGrid.tsx
View File

@@ -94,6 +94,7 @@ export const DocsGrid = () => {
as="h2"
$theme="primary"
$margin={{ bottom: 'none' }}
$variation="600"
>
{t('Documents')}
</Text>
@@ -130,7 +131,7 @@ export const DocsGrid = () => {
renderCell: ({ row }) => {
return (
<StyledLink href={`/docs/${row.id}`}>
<Text $weight="bold" $theme="primary">
<Text $weight="bold" $theme="primary" $variation="900">
{row.title}
</Text>
</StyledLink>
@@ -143,7 +144,9 @@ export const DocsGrid = () => {
renderCell: ({ row }) => {
return (
<StyledLink href={`/docs/${row.id}`}>
<Text $weight="bold">{formatDate(row.created_at)}</Text>
<Text $weight="bold" $theme="primary" $variation="900">
{formatDate(row.created_at)}
</Text>
</StyledLink>
);
},
@@ -154,7 +157,9 @@ export const DocsGrid = () => {
renderCell: ({ row }) => {
return (
<StyledLink href={`/docs/${row.id}`}>
<Text $weight="bold">{formatDate(row.updated_at)}</Text>
<Text $weight="bold" $theme="primary" $variation="900">
{formatDate(row.updated_at)}
</Text>
</StyledLink>
);
},
@@ -165,7 +170,7 @@ export const DocsGrid = () => {
renderCell: ({ row }) => {
return (
<StyledLink href={`/docs/${row.id}`}>
<Text $weight="bold">
<Text $weight="bold" $theme="primary" $variation="900">
{transRole(currentDocRole(row.abilities))}
</Text>
</StyledLink>
@@ -178,7 +183,9 @@ export const DocsGrid = () => {
renderCell: ({ row }) => {
return (
<StyledLink href={`/docs/${row.id}`}>
<Text $weight="bold">{row.accesses.length}</Text>
<Text $weight="bold" $theme="primary" $variation="900">
{row.accesses.length}
</Text>
</StyledLink>
);
},

4
src/frontend/apps/impress/src/features/footer/Footer.tsx
View File

@@ -84,7 +84,9 @@ export const Footer = () => {
}
`}
>
<Text $weight="bold">{label}</Text>
<Text $weight="bold" $theme="greyscale" $variation="800">
{label}
</Text>
<IconLink width={18} />
</StyledLink>
))}

8
src/frontend/apps/impress/src/features/header/Header.tsx
View File

@@ -78,7 +78,13 @@ export const Header = () => {
>
BETA
</Text>
<Text $margin="none" as="h2" $theme="primary" $zIndex={1}>
<Text
$margin="none"
as="h2"
$theme="primary"
$variation="800"
$zIndex={1}
>
{t('Docs')}
</Text>
</Box>

4
src/frontend/apps/impress/src/features/language/LanguagePicker.tsx
View File

@@ -49,7 +49,9 @@ export const LanguagePicker = () => {
$align="center"
>
<Image priority src={IconLanguage} alt={t('Language Icon')} />
<Text $theme="primary">{lang.toUpperCase()}</Text>
<Text $theme="greyscale" $variation="900">
{lang.toUpperCase()}
</Text>
</Box>
),
}));