import React from "react";
import { useWordpressCustomData } from "../services/WordpressFetchData";

import Nav from "../components/ui/Nav";
import AnimatedPage from "../components/AnimatedPage";
import Loading from "../components/animations/Loading";
import Marquee from "../components/ui/Marquee";
import Footer from "../components/ui/Footer";

import personnages from "../assets/img/illustrations/lhoist-personnages-a-propos.svg";

export default function About() {
	const pageDatas = useWordpressCustomData(`/page/145`);
	if (!pageDatas) return <Loading />;
	return (
		<AnimatedPage className='page-container page-container--about  '>
			<div className='content-page '>
				<Nav />

				<div className='editor_inner_content'>
					<div dangerouslySetInnerHTML={{ __html: pageDatas.post_content }} />
					<img className='personnages' src={personnages} alt='' />
					<Marquee />
					<Footer />
				</div>
			</div>
		</AnimatedPage>
	);
}
