+
{
+
);
};
diff --git a/tdm-fe/src/app/components/layout/Footer.tsx b/tdm-fe/src/app/components/layout/Footer.tsx
new file mode 100644
index 0000000..dcf58e5
--- /dev/null
+++ b/tdm-fe/src/app/components/layout/Footer.tsx
@@ -0,0 +1,83 @@
+import '~/app/components/layout/scss/Footer.scss';
+
+import Container from '@mui/material/Container';
+import Grid from '@mui/material/Grid';
+
+import abesLogo from '/abes.svg';
+import cnrsLogo from '/cnrs.svg';
+import couperinLogo from '/couperin.svg';
+import franceUniversitesLogo from '/france_universites.svg';
+import investissementLogo from '/investissement.png';
+import mesrLogo from '/mesr.svg';
+import ulLogo from '/ul.svg';
+
+const partners = [
+ {
+ logo: mesrLogo,
+ alt: "Ministère de l'Enseignement Supérieur et de la Recherche",
+ url: 'https://www.enseignementsup-recherche.gouv.fr/',
+ },
+ {
+ logo: cnrsLogo,
+ alt: 'Centre National de la Recherche Scientifique',
+ url: 'https://www.cnrs.fr/',
+ width: 64, // The CNRS logo grows more than the others, so it needs to be in a smaller container
+ },
+ {
+ logo: abesLogo,
+ alt: "Agence Bibliographique de l'Enseignement Supérieur",
+ url: 'https://www.abes.fr/',
+ },
+ {
+ logo: couperinLogo,
+ alt: 'Couperin',
+ url: 'https://www.couperin.org/',
+ },
+ {
+ logo: franceUniversitesLogo,
+ alt: 'France Universités',
+ url: 'https://franceuniversites.fr/',
+ },
+ {
+ logo: ulLogo,
+ alt: 'Université de Lorraine',
+ url: 'https://www.univ-lorraine.fr/',
+ },
+];
+
+const MAX_ITEMS_PER_LINE = 12;
+
+const Footer = () => {
+ return (
+
+ );
+};
+
+export default Footer;
diff --git a/tdm-fe/src/app/components/layout/Header.tsx b/tdm-fe/src/app/components/layout/Header.tsx
index 33af8f3..24b7af2 100644
--- a/tdm-fe/src/app/components/layout/Header.tsx
+++ b/tdm-fe/src/app/components/layout/Header.tsx
@@ -1,4 +1,5 @@
-import '~/app/components/layout/Header.scss';
+import '~/app/components/layout/scss/Header.scss';
+
import KeyboardBackspaceIcon from '@mui/icons-material/KeyboardBackspace';
import { alpha } from '@mui/material';
import AppBar from '@mui/material/AppBar';
@@ -16,14 +17,14 @@ const navigations = [
const Header = () => {
return (
-
+
+
);
};
diff --git a/tdm-fe/src/app/components/layout/scss/Footer.scss b/tdm-fe/src/app/components/layout/scss/Footer.scss
new file mode 100644
index 0000000..b2f710e
--- /dev/null
+++ b/tdm-fe/src/app/components/layout/scss/Footer.scss
@@ -0,0 +1,60 @@
+@import "../../../scss/colors";
+
+#footer {
+ background-color: #fff;
+
+ &::before {
+ display: block;
+ width: 100%;
+ height: .5rem;
+ content: "";
+ background: linear-gradient(to right, #458ca5 50%, #c4d733);
+ }
+
+ #footer-container {
+ padding: 24px;
+
+ ul {
+ padding: 0;
+ margin: -16px 0 0 -16px;
+ list-style: none;
+ }
+
+ .footer-collaborator {
+ position: relative;
+ width: 128px;
+ min-height: 100px;
+ margin: auto;
+
+ a {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ }
+
+ img {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ }
+ }
+
+ #footer-financing {
+ padding: 24px;
+ text-align: center;
+
+ p {
+ margin: 0;
+ font-size: .875rem;
+ font-weight: 400;
+ line-height: 1.43;
+ color: $grey;
+ }
+ }
+ }
+}
diff --git a/tdm-fe/src/app/components/layout/Header.scss b/tdm-fe/src/app/components/layout/scss/Header.scss
similarity index 50%
rename from tdm-fe/src/app/components/layout/Header.scss
rename to tdm-fe/src/app/components/layout/scss/Header.scss
index 65c308a..835669a 100644
--- a/tdm-fe/src/app/components/layout/Header.scss
+++ b/tdm-fe/src/app/components/layout/scss/Header.scss
@@ -1,44 +1,44 @@
-@import "../../scss/colors";
+@import "../../../scss/colors";
-#header {
- background-image: url("/header-background.jpg");
- background-repeat: no-repeat;
- background-position: center;
- background-size: cover;
+#nav-bar {
+ background-color: $white;
- #header-nav-bar {
- background-color: $white;
+ #nav-bar-container {
+ display: flex;
+ }
- #header-nav-bar-container {
- display: flex;
- }
+ #nav-bar-istex-link {
+ gap: 8px;
+ font-size: .625rem;
+ color: $text-primary;
+ text-decoration: none;
+ text-transform: uppercase;
+ border-radius: 0;
+ }
+
+ #nav-bar-navigation {
+ display: flex;
+ flex-grow: 1;
+ gap: 1px;
+ justify-content: flex-end;
+ padding: 0;
+ margin: 0;
+ list-style: none;
- #header-nav-bar-istex-link {
- gap: 8px;
+ .nav-bar-navigation-button {
+ height: 100%;
font-size: .625rem;
color: $text-primary;
- text-decoration: none;
- text-transform: uppercase;
border-radius: 0;
}
-
- #header-nav-bar-navigation {
- display: flex;
- flex-grow: 1;
- gap: 1px;
- justify-content: flex-end;
- padding: 0;
- margin: 0;
- list-style: none;
-
- .header-nav-bar-navigation-button {
- height: 100%;
- font-size: .625rem;
- color: $text-primary;
- border-radius: 0;
- }
- }
}
+}
+
+#header {
+ background-image: url("/header-background.jpg");
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: cover;
#header-container {
padding: 32px 24px 16px;
From 2fc7aa5b1869792782dbf484236e4e7a0873531f Mon Sep 17 00:00:00 2001
From: AlasDiablo <25723276+AlasDiablo@users.noreply.github.com>
Date: Fri, 22 Mar 2024 14:18:21 +0100
Subject: [PATCH 3/9] feat: add link in nav bar
---
tdm-fe/src/app/components/layout/Header.tsx | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/tdm-fe/src/app/components/layout/Header.tsx b/tdm-fe/src/app/components/layout/Header.tsx
index 24b7af2..9a4a7d6 100644
--- a/tdm-fe/src/app/components/layout/Header.tsx
+++ b/tdm-fe/src/app/components/layout/Header.tsx
@@ -10,9 +10,9 @@ import Link from '@mui/material/Link';
import istexLogo from '/istex.png';
const navigations = [
- { name: 'Objectif TDM', url: '#' },
- { name: 'TDM Tools', url: '#' },
- { name: 'Hébergement corpus', url: '#' },
+ { name: 'Objectif TDM', url: 'https://services.istex.fr/' },
+ { name: 'TDM Tools', url: 'https://tmtoolsfr-explorerfr.tdm.inist.fr/' },
+ { name: 'Hébergement corpus', url: 'https://www.lodex.fr/' },
];
const Header = () => {
From ad85e426346a440ddf223babb1bb1a12cd4cab90 Mon Sep 17 00:00:00 2001
From: AlasDiablo <25723276+AlasDiablo@users.noreply.github.com>
Date: Fri, 22 Mar 2024 15:05:53 +0100
Subject: [PATCH 4/9] refactor: update stepper to extend the line
---
.../components/form/ProcessingFormStepper.tsx | 80 +++++++++++++------
1 file changed, 54 insertions(+), 26 deletions(-)
diff --git a/tdm-fe/src/app/components/form/ProcessingFormStepper.tsx b/tdm-fe/src/app/components/form/ProcessingFormStepper.tsx
index 63e598b..7420018 100644
--- a/tdm-fe/src/app/components/form/ProcessingFormStepper.tsx
+++ b/tdm-fe/src/app/components/form/ProcessingFormStepper.tsx
@@ -16,6 +16,7 @@ import Stepper from '@mui/material/Stepper';
import { styled } from '@mui/material/styles';
import { useMemo } from 'react';
+import type { StepConnectorProps } from '@mui/material/StepConnector';
import type { StepIconProps } from '@mui/material/StepIcon';
export type ProcessingFormStepperProps = {
@@ -35,27 +36,48 @@ const steps = [
/**
* Istex themed step connector
*/
-const IstexStepConnector = styled(StepConnector)(({ theme }) => ({
- [`&.${stepConnectorClasses.alternativeLabel}`]: {
- top: 16,
- left: 'calc(-50% + 18px)',
- right: 'calc(50% + 18px)',
+const IstexStepConnector = (
+ props: StepConnectorProps & {
+ isExtended?: boolean;
+ isFirst?: boolean;
+ isLast?: boolean;
},
- [`&.${stepConnectorClasses.active}`]: {
- [`& .${stepConnectorClasses.line}`]: {
- borderColor: theme.palette.colors.blue,
- },
- },
- [`&.${stepConnectorClasses.completed}`]: {
- [`& .${stepConnectorClasses.line}`]: {
- borderColor: theme.palette.colors.blue,
- },
- },
- [`& .${stepConnectorClasses.line}`]: {
- borderColor: theme.palette.colors.grey,
- borderTopWidth: 2,
- },
-}));
+) => {
+ const { isExtended, isFirst, isLast, ...rest } = props;
+
+ const CustomStepConnector = useMemo(() => {
+ let left = 'calc(-50% + 18px)';
+
+ if (isExtended && (isFirst || isLast)) {
+ left = '8px';
+ }
+
+ return styled(StepConnector)(({ theme }) => ({
+ [`&.${stepConnectorClasses.alternativeLabel}`]: {
+ top: 16,
+ left: left,
+ right: 'calc(50% + 18px)',
+ transform: isExtended && isLast ? 'translateX(calc(100% + 36px))' : undefined,
+ },
+ [`&.${stepConnectorClasses.active}`]: {
+ [`& .${stepConnectorClasses.line}`]: {
+ borderColor: theme.palette.colors.blue,
+ },
+ },
+ [`&.${stepConnectorClasses.completed}`]: {
+ [`& .${stepConnectorClasses.line}`]: {
+ borderColor: theme.palette.colors.blue,
+ },
+ },
+ [`& .${stepConnectorClasses.line}`]: {
+ borderColor: theme.palette.colors.grey,
+ borderTopWidth: 2,
+ },
+ }));
+ }, [isExtended, isFirst, isLast]);
+
+ return
-
+ <>
+
+
+
{
+ Le traitement a commencé. Vous allez recevoir un mail contenant un résumé.
- Vous pouvez voir l'avancement du traitement via la page de statut des traitements :{' '}
+ Vous pouvez voir l‘avancement du traitement via la page de statut des traitements :{' '}
diff --git a/tdm-fe/src/app/components/form/ProcessingFormEmail.tsx b/tdm-fe/src/app/components/form/ProcessingFormEmail.tsx
index 31cb6c8..ec6f31f 100644
--- a/tdm-fe/src/app/components/form/ProcessingFormEmail.tsx
+++ b/tdm-fe/src/app/components/form/ProcessingFormEmail.tsx
@@ -25,7 +25,7 @@ const ProcessingFormEmail = () => {
/>
{isInvalid ? (
- L'adresse électronique n'est pas valide
+ L‘adresse électronique n'est pas valide
) : null}
diff --git a/tdm-fe/src/app/components/form/ProcessingFormUpload.tsx b/tdm-fe/src/app/components/form/ProcessingFormUpload.tsx
index c093a23..04772e3 100644
--- a/tdm-fe/src/app/components/form/ProcessingFormUpload.tsx
+++ b/tdm-fe/src/app/components/form/ProcessingFormUpload.tsx
@@ -52,7 +52,7 @@ const ProcessingFormUpload = () => {
<>Fichier manquant
) : (
<>
- Le fichier ne correspond pas a un format compatible, utilisé l'un de ces format :{' '}
+ Le fichier ne correspond pas a un format compatible, utilisé l‘un de ces format :{' '}
{stringifiesMineTypes}.
)}
diff --git a/tdm-fe/src/app/components/layout/Header.tsx b/tdm-fe/src/app/components/layout/Header.tsx
index 9a4a7d6..5f6c1d9 100644
--- a/tdm-fe/src/app/components/layout/Header.tsx
+++ b/tdm-fe/src/app/components/layout/Header.tsx
@@ -58,7 +58,7 @@ const Header = () => {
diff --git a/tdm-fe/src/app/components/layout/WebServicesFooter.tsx b/tdm-fe/src/app/components/layout/WebServicesFooter.tsx
new file mode 100644
index 0000000..1039f4d
--- /dev/null
+++ b/tdm-fe/src/app/components/layout/WebServicesFooter.tsx
@@ -0,0 +1,22 @@
+import '~/app/components/layout/scss/WebServicesFooter.scss';
+import Button from '@mui/material/Button';
+import Container from '@mui/material/Container';
+
+const WebServicesFooter = () => {
+ return (
+
+ );
+};
+
+export default WebServicesFooter;
diff --git a/tdm-fe/src/app/components/layout/WebServicesHeader.tsx b/tdm-fe/src/app/components/layout/WebServicesHeader.tsx
new file mode 100644
index 0000000..f6f77fc
--- /dev/null
+++ b/tdm-fe/src/app/components/layout/WebServicesHeader.tsx
@@ -0,0 +1,21 @@
+import '~/app/components/layout/scss/WebServicesHeader.scss';
+import Container from '@mui/material/Container';
+
+const WebServicesHeader = () => {
+ // Todo add the correcte text when available
+ return (
+
+ );
+};
+
+export default WebServicesHeader;
diff --git a/tdm-fe/src/app/components/layout/scss/WebServicesFooter.scss b/tdm-fe/src/app/components/layout/scss/WebServicesFooter.scss
new file mode 100644
index 0000000..657c8cf
--- /dev/null
+++ b/tdm-fe/src/app/components/layout/scss/WebServicesFooter.scss
@@ -0,0 +1,27 @@
+@import "../../../scss/colors";
+
+#ws-footer {
+ padding-top: 72px;
+ padding-bottom: 80px;
+ text-align: center;
+ // TODO add background image when available
+ background-color: #000;
+
+ #ws-footer-galaxy {
+ margin-bottom: 0;
+ }
+
+ #ws-footer-text {
+ margin-top: 32px;
+ margin-bottom: 48px;
+ }
+
+ h1 {
+ margin: 0;
+ color: $light-green;
+ }
+
+ p {
+ color: $white;
+ }
+}
diff --git a/tdm-fe/src/app/components/layout/scss/WebServicesHeader.scss b/tdm-fe/src/app/components/layout/scss/WebServicesHeader.scss
new file mode 100644
index 0000000..6b31f9f
--- /dev/null
+++ b/tdm-fe/src/app/components/layout/scss/WebServicesHeader.scss
@@ -0,0 +1,5 @@
+#ws-header {
+ padding-top: 72px;
+ padding-bottom: 24px;
+ text-align: center;
+}
diff --git a/tdm-fe/src/app/components/progress/FileUpload.tsx b/tdm-fe/src/app/components/progress/FileUpload.tsx
index d090d27..155ec9f 100644
--- a/tdm-fe/src/app/components/progress/FileUpload.tsx
+++ b/tdm-fe/src/app/components/progress/FileUpload.tsx
@@ -11,7 +11,7 @@ const FileUpload = ({ showError }: FileUploadProps) => {
return 