From 940952f98251ca0ae3b8f835f01a4a70b873d9f9 Mon Sep 17 00:00:00 2001 From: Florian Amsallem Date: Fri, 5 Jul 2024 15:10:10 +0200 Subject: [PATCH] front: add xmas logo and harmonize logo in app Co-authored-by: Paul Filimon --- front/src/applications/editor/Home.tsx | 2 + .../applications/operationalStudies/Home.tsx | 8 +- front/src/applications/referenceMap/Home.tsx | 2 + .../applications/rollingStockEditor/Home.tsx | 3 +- front/src/applications/stdcm/Home.tsx | 3 +- front/src/assets/fav-osrd-color.svg | 1 - front/src/assets/logo-color.svg | 22 + front/src/assets/proud-logo-color.svg | 496 +++++++++++++++ .../assets/proud-logo-osrd-color-white.svg | 564 +++++++++++++++++- front/src/assets/xmas-logo-color.svg | 81 +++ .../src/assets/xmas-logo-osrd-color-white.svg | 54 ++ front/src/common/BootstrapSNCF/NavBarSNCF.tsx | 4 +- .../ReleaseInformations.tsx | 4 +- front/src/main/home.jsx | 7 +- front/src/utils/logo.ts | 31 + 15 files changed, 1267 insertions(+), 15 deletions(-) delete mode 100644 front/src/assets/fav-osrd-color.svg create mode 100644 front/src/assets/logo-color.svg create mode 100644 front/src/assets/proud-logo-color.svg create mode 100644 front/src/assets/xmas-logo-color.svg create mode 100644 front/src/assets/xmas-logo-osrd-color-white.svg create mode 100644 front/src/utils/logo.ts diff --git a/front/src/applications/editor/Home.tsx b/front/src/applications/editor/Home.tsx index 5f8f397951d..bde3451c004 100644 --- a/front/src/applications/editor/Home.tsx +++ b/front/src/applications/editor/Home.tsx @@ -7,6 +7,7 @@ import { Route, Routes } from 'react-router-dom'; import { ModalProvider } from 'common/BootstrapSNCF/ModalSNCF/ModalProvider'; import NavBarSNCF from 'common/BootstrapSNCF/NavBarSNCF'; import { useCurrentInfra } from 'modules/infra/useInfra'; +import { getLogo } from 'utils/logo'; import Editor from './Editor'; @@ -17,6 +18,7 @@ export default function HomeEditorUnplugged() { return ( {t('editor')} diff --git a/front/src/applications/operationalStudies/Home.tsx b/front/src/applications/operationalStudies/Home.tsx index 39094cea302..b77625882f3 100644 --- a/front/src/applications/operationalStudies/Home.tsx +++ b/front/src/applications/operationalStudies/Home.tsx @@ -5,10 +5,10 @@ import { useSelector } from 'react-redux'; import FilterTextField from 'applications/operationalStudies/components/FilterTextField'; import { + osrdEditoastApi, type PostSearchApiArg, type ProjectWithStudies, type SearchResultItemProject, - osrdEditoastApi, } from 'common/api/osrdEditoastApi'; import NavBarSNCF from 'common/BootstrapSNCF/NavBarSNCF'; import OptionsSNCF from 'common/BootstrapSNCF/OptionsSNCF'; @@ -17,6 +17,7 @@ import ProjectCard from 'modules/project/components/ProjectCard'; import ProjectCardEmpty from 'modules/project/components/ProjectCardEmpty'; import ProjectSelectionToolbar from 'modules/project/components/ProjectSelectionToolbar'; import { getUserSafeWord } from 'reducers/user/userSelectors'; +import { getLogo } from 'utils/logo'; type SortOptions = | 'NameAsc' @@ -140,7 +141,10 @@ export default function HomeOperationalStudies() { return ( <> - {t('projects')}} /> + {t('projects')}} + />
diff --git a/front/src/applications/referenceMap/Home.tsx b/front/src/applications/referenceMap/Home.tsx index 38f7e3bc462..12230204b93 100644 --- a/front/src/applications/referenceMap/Home.tsx +++ b/front/src/applications/referenceMap/Home.tsx @@ -9,6 +9,7 @@ import { ModalProvider } from 'common/BootstrapSNCF/ModalSNCF/ModalProvider'; import NavBarSNCF from 'common/BootstrapSNCF/NavBarSNCF'; import { useInfraActions, useInfraID } from 'common/osrdContext'; import { useAppDispatch } from 'store'; +import { getLogo } from 'utils/logo'; import Map from './Map'; @@ -39,6 +40,7 @@ const HomeReferenceMap = () => { return ( {t('map')} diff --git a/front/src/applications/rollingStockEditor/Home.tsx b/front/src/applications/rollingStockEditor/Home.tsx index f3d71c3b07b..ba1ae0cf7e5 100644 --- a/front/src/applications/rollingStockEditor/Home.tsx +++ b/front/src/applications/rollingStockEditor/Home.tsx @@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next'; import { ModalProvider } from 'common/BootstrapSNCF/ModalSNCF/ModalProvider'; import NavBarSNCF from 'common/BootstrapSNCF/NavBarSNCF'; +import { getLogo } from 'utils/logo'; import RollingStockEditor from './views/RollingStockEditor'; @@ -12,7 +13,7 @@ const HomeRollingStockEditor: FC = () => { return ( - {t('rollingStockEditor')}} /> + {t('rollingStockEditor')}} /> ); diff --git a/front/src/applications/stdcm/Home.tsx b/front/src/applications/stdcm/Home.tsx index 0281fbed8fe..b4185fe5776 100644 --- a/front/src/applications/stdcm/Home.tsx +++ b/front/src/applications/stdcm/Home.tsx @@ -8,6 +8,7 @@ import StdcmViewV1 from 'applications/stdcm/views/StdcmViewV1'; import StdcmViewV2 from 'applications/stdcmV2/views/StdcmViewV2'; import NavBarSNCF from 'common/BootstrapSNCF/NavBarSNCF'; import { getStdcmV2Activated } from 'reducers/user/userSelectors'; +import { getLogo } from 'utils/logo'; export default function HomeStdcm() { const stdcmV2Activated = useSelector(getStdcmV2Activated); @@ -22,7 +23,7 @@ export default function HomeStdcm() { return ( <> - + } /> diff --git a/front/src/assets/fav-osrd-color.svg b/front/src/assets/fav-osrd-color.svg deleted file mode 100644 index a40cc37eaf4..00000000000 --- a/front/src/assets/fav-osrd-color.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/front/src/assets/logo-color.svg b/front/src/assets/logo-color.svg new file mode 100644 index 00000000000..76bd15f94ee --- /dev/null +++ b/front/src/assets/logo-color.svg @@ -0,0 +1,22 @@ + + diff --git a/front/src/assets/proud-logo-color.svg b/front/src/assets/proud-logo-color.svg new file mode 100644 index 00000000000..3b1811ca611 --- /dev/null +++ b/front/src/assets/proud-logo-color.svg @@ -0,0 +1,496 @@ + + diff --git a/front/src/assets/proud-logo-osrd-color-white.svg b/front/src/assets/proud-logo-osrd-color-white.svg index 7b21971e5d3..884bb1b34ca 100644 --- a/front/src/assets/proud-logo-osrd-color-white.svg +++ b/front/src/assets/proud-logo-osrd-color-white.svg @@ -1 +1,563 @@ - \ No newline at end of file + + diff --git a/front/src/assets/xmas-logo-color.svg b/front/src/assets/xmas-logo-color.svg new file mode 100644 index 00000000000..cb468b34423 --- /dev/null +++ b/front/src/assets/xmas-logo-color.svg @@ -0,0 +1,81 @@ + + diff --git a/front/src/assets/xmas-logo-osrd-color-white.svg b/front/src/assets/xmas-logo-osrd-color-white.svg new file mode 100644 index 00000000000..a65d0d088ad --- /dev/null +++ b/front/src/assets/xmas-logo-osrd-color-white.svg @@ -0,0 +1,54 @@ + + diff --git a/front/src/common/BootstrapSNCF/NavBarSNCF.tsx b/front/src/common/BootstrapSNCF/NavBarSNCF.tsx index 483f3170f53..789c85c2034 100644 --- a/front/src/common/BootstrapSNCF/NavBarSNCF.tsx +++ b/front/src/common/BootstrapSNCF/NavBarSNCF.tsx @@ -7,12 +7,12 @@ import { useTranslation } from 'react-i18next'; import { useSelector } from 'react-redux'; import { Link } from 'react-router-dom'; -import logoOSRD from 'assets/fav-osrd-color.svg'; import ChangeLanguageModal from 'common/ChangeLanguageModal'; import ReleaseInformations from 'common/ReleaseInformations/ReleaseInformations'; import UserSettings from 'common/UserSettings'; import { getUserSafeWord } from 'reducers/user/userSelectors'; import useAuth from 'utils/hooks/OsrdAuth'; +import { getLogo } from 'utils/logo'; import { language2flag } from 'utils/strings'; import DropdownSNCF, { DROPDOWN_STYLE_TYPES } from './DropdownSNCF'; @@ -23,7 +23,7 @@ type Props = { logo?: string; }; -const LegacyNavBarSNCF = ({ appName, logo = logoOSRD }: Props) => { +const LegacyNavBarSNCF = ({ appName, logo = getLogo() }: Props) => { const { openModal } = useModal(); const safeWord = useSelector(getUserSafeWord); const { t } = useTranslation('home/navbar'); diff --git a/front/src/common/ReleaseInformations/ReleaseInformations.tsx b/front/src/common/ReleaseInformations/ReleaseInformations.tsx index 99f5af12ad2..c48d52eb92f 100644 --- a/front/src/common/ReleaseInformations/ReleaseInformations.tsx +++ b/front/src/common/ReleaseInformations/ReleaseInformations.tsx @@ -5,11 +5,11 @@ import React from 'react'; import { useTranslation } from 'react-i18next'; -import osrdLogo from 'assets/fav-osrd-color.svg'; import { osrdEditoastApi } from 'common/api/osrdEditoastApi'; import ModalBodySNCF from 'common/BootstrapSNCF/ModalSNCF/ModalBodySNCF'; import ModalHeaderSNCF from 'common/BootstrapSNCF/ModalSNCF/ModalHeaderSNCF'; import motriceParty from 'common/MotriceRelated/motriceParty'; +import { getLogo } from 'utils/logo'; import LicenseAttributions from './LicenseAttributions'; @@ -47,7 +47,7 @@ function ReleaseInformations() { rel="noopener noreferrer" onMouseEnter={motriceParty} > - OSRD logo + OSRD logo

OSRD

Open Source Railway Designer

diff --git a/front/src/main/home.jsx b/front/src/main/home.jsx index 62dcdaaf829..510de6bc04a 100644 --- a/front/src/main/home.jsx +++ b/front/src/main/home.jsx @@ -2,25 +2,22 @@ import React from 'react'; import { useTranslation } from 'react-i18next'; -import defaultLogo from 'assets/logo-osrd-color-white.svg'; import editorImg from 'assets/pictures/home/editor.svg'; import mapImg from 'assets/pictures/home/map.svg'; import operationalStudiesImg from 'assets/pictures/home/operationalStudies.svg'; import rollingStockEditorImg from 'assets/pictures/home/rollingstockeditor.svg'; import stdcmImg from 'assets/pictures/home/stdcm.svg'; -import proudLogo from 'assets/proud-logo-osrd-color-white.svg'; import Card from 'common/BootstrapSNCF/CardSNCF/CardSNCF'; import { ModalProvider } from 'common/BootstrapSNCF/ModalSNCF/ModalProvider'; import NavBarSNCF from 'common/BootstrapSNCF/NavBarSNCF'; +import { getOsrdLogo } from 'utils/logo'; export default function Home() { const { t } = useTranslation('home/home'); - const logo = new Date().getMonth() === 5 ? proudLogo : defaultLogo; - return ( - +
diff --git a/front/src/utils/logo.ts b/front/src/utils/logo.ts new file mode 100644 index 00000000000..1bf18a51fec --- /dev/null +++ b/front/src/utils/logo.ts @@ -0,0 +1,31 @@ +import defaultLogo from 'assets/logo-color.svg'; +import defaultOsrdLogo from 'assets/logo-osrd-color-white.svg'; +import proudLogo from 'assets/proud-logo-color.svg'; +import proudOsrdLogo from 'assets/proud-logo-osrd-color-white.svg'; +import xmasLogo from 'assets/xmas-logo-color.svg'; +import xmasOsrdLogo from 'assets/xmas-logo-osrd-color-white.svg'; + +const MONTH_VALUES = { + JUNE: 5, + DECEMBER: 11, +}; + +export const getOsrdLogo = () => { + if (new Date().getMonth() === MONTH_VALUES.JUNE) { + return proudOsrdLogo; + } + if (new Date().getMonth() === MONTH_VALUES.DECEMBER) { + return xmasOsrdLogo; + } + return defaultOsrdLogo; +}; + +export const getLogo = () => { + if (new Date().getMonth() === MONTH_VALUES.JUNE) { + return proudLogo; + } + if (new Date().getMonth() === MONTH_VALUES.DECEMBER) { + return xmasLogo; + } + return defaultLogo; +};