diff --git a/src/components/ContainerComponents/Header/Header.tsx b/src/components/ContainerComponents/Header/Header.tsx index 4a480d809febb585e8ea728ba2f8a68477200f7c..90d833176bd669e2674a6878c8fca86bd4de5e9e 100644 --- a/src/components/ContainerComponents/Header/Header.tsx +++ b/src/components/ContainerComponents/Header/Header.tsx @@ -38,6 +38,7 @@ const Header: React.FC<HeaderProps> = ({ } useEffect(() => { + console.log(instanceSettings, 'IS') if (screenType === ScreenType.MOBILE) { setHeaderHeight( header.current diff --git a/src/components/ContainerComponents/ViewContainer/HomeViewContainer.tsx b/src/components/ContainerComponents/ViewContainer/HomeViewContainer.tsx index daef70947a8b16fe7287479df7b3cd94ecff7e54..7b5a06ecdf868d9bd972b057a6d6966fdca136bb 100644 --- a/src/components/ContainerComponents/ViewContainer/HomeViewContainer.tsx +++ b/src/components/ContainerComponents/ViewContainer/HomeViewContainer.tsx @@ -15,6 +15,7 @@ import StyledButton from 'components/CommonKit/Button/StyledButton' import { translate } from 'cozy-ui/react/I18n' import { withClient, Client } from 'cozy-client' import { USERPROFILE_DOCTYPE } from 'doctypes' +import useInstanceSettings from 'components/Hooks/userInstanceSettings' interface HomeViewContainerProps { t: Function @@ -29,6 +30,7 @@ const HomeViewContainer: React.FC = ({ t, client }: HomeViewContainerProps) => { const [modalOpen, setModalOpen] = useState<boolean>(true) const [isChartLoading, setChartLoading] = useState<boolean>(true) const [isIndicatorsLoading, setIndicatorsLoading] = useState<boolean>(true) + const { data: instanceSettings } = useInstanceSettings(client) async function updateWelcomeModalState() { await client @@ -91,10 +93,13 @@ const HomeViewContainer: React.FC = ({ t, client }: HomeViewContainerProps) => { <div className="wm-header text-24-bold"> {t('COMMON.WELCOME_MODAL_TITLE')} </div> - <div className="wm-txt text-18-bold"> + <div className="wm-name text-24-bold"> + {instanceSettings.public_name} ! + </div> + <div className="wm-perso text-18-bold"> {t('COMMON.WELCOME_MODAL_PERSO')} </div> - <div className="wm-txt text-18-bold"> + <div className="wm-connect text-18-bold"> {t('COMMON.WELCOME_MODAL_CONNECT')} </div> <StyledButton className="button-ok" onClick={handleCloseClick}> diff --git a/src/styles/components/_modal.scss b/src/styles/components/_modal.scss index 323ef0d13c6e62f56a579e34b7e91021ce977b40..72ec865ef3aefd4bbac2aeb1a4c037f50511375a 100644 --- a/src/styles/components/_modal.scss +++ b/src/styles/components/_modal.scss @@ -58,13 +58,25 @@ background-clip: 'text'; -webkit-background-clip: text; color: transparent; - margin: 2rem 0 1rem; + margin-top: 2rem; + } + .wm-name { + background: $multi-color-radial-gradient; + background-clip: 'text'; + -webkit-background-clip: text; + color: transparent; + margin-bottom: 1.25rem; } .button-ok { width: 90%; margin-bottom: 2rem; } - .wm-txt { + .wm-perso { + text-align: center; + width: 60%; + margin: 1rem; + } + .wm-connect { text-align: center; width: 88%; margin: 1rem;