update demo message

'use client';

import { useState, useEffect } from 'react';

import { useRouter } from 'next/navigation';

import Link from "next/link";

export default function LoginClient({ demo = false }: { demo?: boolean }) {

    const [username, setUsername] = useState('');

    return (

        <div className="min-vh-100 d-flex align-items-center justify-content-center" style={{ flexDirection: 'column' }}>

            {demoMode && (

                <div className="my-5">

                    <div className="p-5 text-center bg-body-tertiary">

                        <div className="container py-5">

                            <h1 className="text-body-emphasis">Full-width jumbotron</h1>

                            <p className="col-lg-8 mx-auto lead">

                                This takes the basic jumbotron above and makes its background edge-to-edge with a <code>.container</code> inside to align content. Similar to above, it&apos;s been recreated with built-in grid and utility classes.

                <div className="my-2">

                    <div className="p-2 text-center bg-body-tertiary">

                        <div className="container py-2">

                            <h1 className="text-body-emphasis">Demo Backoffice</h1>

                            <p className="mx-auto lead">

                                Use <strong>demo</strong> as username and password to access the backoffice.

                            </p>

                            <p className="mx-auto lead">

                                You are free to edit the content, it will be reflected in <Link href="https://wwwdemo.anthony-jacob.com" target='_blank'>wwwdemo.anthony-jacob.com</Link>

                            </p>

                            <p className="mx-auto lead">Please note that each hour, the demo content is reset to the original state.

                                <br /> the code is available and you can take a look at my gitlab :

                            </p>

                            <p className="mx-auto lead">

                            </p>

                            <ul>

                                <li> <Link href="https://gitlab.anthony-jacob.com/anthony.jacob/api" target='_blank'>API (Python Flask)</Link></li>

                                <li> <Link href="https://gitlab.anthony-jacob.com/anthony.jacob/resume-website-backoffice" target='_blank'>Administration Backoffice (NextJs)</Link></li>

                                <li> <Link href="https://gitlab.anthony-jacob.com/anthony.jacob/resume-website-python" target='_blank'>Front (Python Flask)</Link></li>

                            </ul>

                            <p className="mx-auto lead">

                                If you want to know more about the development of this project, you can check <Link href="https://blog.anthony-jacob.com/refonte-de-mon-site-vitrine-du-php-statique-a-un-ecosysteme-modulaire-en-flask-next-js-postgresql/" target='_blank'>my article </Link> on that subject

                            </p>

                        </div>

                    </div>

    border-top-left-radius: 0;

    border-top-right-radius: 0;

}

ul {

    list-style: none;

    padding-left: 0;

}

 No newline at end of file