From 78c2395e36de72c2f081409c853f9c1654cb74b7 Mon Sep 17 00:00:00 2001 From: kim Date: Thu, 12 Sep 2024 14:47:45 +0200 Subject: [PATCH 1/4] feat: add graasp branding and show all platforms --- src/components/BrandingLogo.tsx | 18 +++ src/components/LeftContentContainer.tsx | 110 +++++++++++------- src/components/SignIn.tsx | 7 +- src/components/SignUp.tsx | 2 +- .../leftContent/AnalyticsContent.tsx | 33 +++--- src/components/leftContent/BuilderContent.tsx | 6 +- src/components/leftContent/LibraryContent.tsx | 6 +- src/components/leftContent/PlayerContent.tsx | 6 +- src/langs/ar.json | 2 - src/langs/de.json | 3 +- src/langs/en.json | 19 ++- src/langs/es.json | 3 +- src/langs/fr.json | 19 ++- src/langs/it.json | 3 +- 14 files changed, 136 insertions(+), 101 deletions(-) create mode 100644 src/components/BrandingLogo.tsx diff --git a/src/components/BrandingLogo.tsx b/src/components/BrandingLogo.tsx new file mode 100644 index 00000000..5524ca08 --- /dev/null +++ b/src/components/BrandingLogo.tsx @@ -0,0 +1,18 @@ +import { GraaspLogo } from '@graasp/ui'; + +import { Stack, Typography, useTheme } from '@mui/material'; + +export const BrandingLogo = () => { + const theme = useTheme(); + + return ( +
+ + + + Graasp + + +
+ ); +}; diff --git a/src/components/LeftContentContainer.tsx b/src/components/LeftContentContainer.tsx index 21388a63..9428c701 100644 --- a/src/components/LeftContentContainer.tsx +++ b/src/components/LeftContentContainer.tsx @@ -1,67 +1,93 @@ +import { AnalyticsIcon, BuildIcon, LibraryIcon, PlayIcon } from '@graasp/ui'; + import { Stack } from '@mui/material'; +import { useAuthTranslation } from '../config/i18n'; +import { AUTH } from '../langs/constants'; import APIChecker from './APIChecker'; +import { BrandingLogo } from './BrandingLogo'; import Footer from './Footer'; -import { AnalyticsContent } from './leftContent/AnalyticsContent'; -import { BuilderContent } from './leftContent/BuilderContent'; -import { LibraryContent } from './leftContent/LibraryContent'; -import { PlayerContent } from './leftContent/PlayerContent'; +import { PlatformContent } from './leftContent/AnalyticsContent'; type Props = { children: JSX.Element | JSX.Element[]; }; -const PLATFORMS = [ - { content: }, - { content: }, - { content: }, - { content: }, -]; - const LeftContentContainer = ({ children }: Props): JSX.Element => { - const platform = PLATFORMS[Math.floor(Math.random() * PLATFORMS.length)]; + const { t } = useAuthTranslation(); return ( - + <> + - - {platform.content} - - + + + + + + + + + - {children} + + {children} + +