Skip to content

Commit c033a06

Browse files
committed
feat: updated terms of use & privacy policy, added a package for cookies
* instead of next/legacy/image, used next/image * react-cookies to manage cookies
1 parent f7400cf commit c033a06

19 files changed

+343
-31
lines changed

package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "raonagos",
3-
"version": "0.1.8",
3+
"version": "0.1.9",
44
"private": true,
55
"scripts": {
66
"dev": "next dev",
@@ -13,6 +13,7 @@
1313
"next": "13.0.6",
1414
"nodemailer": "^6.7.8",
1515
"react": "18.2.0",
16+
"react-cookie-consent": "^8.0.1",
1617
"react-dom": "18.2.0",
1718
"react-scroll-parallax": "^3.3.1",
1819
"sharp": "^0.30.7"

pages/_app.tsx

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,20 @@
11
import "@styles/globals.css"
22
import Header from "@components/header"
3+
import LegalsHeader from "@legals/header"
34
import Footer from "@components/footer"
45
import { ParallaxProvider } from "react-scroll-parallax"
6+
import { useRouter } from "next/router"
57

68
import type { AppProps } from "next/app"
79

810
export default function MyApp({ Component, pageProps }: AppProps) {
11+
const { pathname } = useRouter()
12+
const match = pathname.match(/^(\/terms|\/privacy)$/)
13+
914
return (
1015
<ParallaxProvider>
11-
<Header />
16+
{match && <LegalsHeader />}
17+
{!match && <Header />}
1218
<main>
1319
<Component {...pageProps} />
1420
</main>

pages/index.tsx

+18-2
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,29 @@
11
import Head from "next/head"
2-
import { useEffect } from "react"
2+
import { useEffect, useState } from "react"
33
import { siteurl, sitename, fbAppId, description } from "@libs/app"
44
import Organization from "@libs/schema"
55
import Whoweare from "@components/whoweare"
66
import Whatwedo from "@components/whatwedo"
77
import Prices from "@components/prices"
88
import Details from "@components/details"
99
import ContactForm from "@components/contactForm"
10+
import CookieConsent from "react-cookie-consent"
1011

1112
import type { NextPage } from "next"
1213

13-
const title = `${sitename} - Créateur de site web, de bot de trading et de serveur de messagerie`
14+
const title = `${sitename} - Créateur de site web, d'automatisation de tâche et de serveur de messagerie`
1415

1516
const Page: NextPage = () => {
17+
const [showCookies, setShowCookies] = useState(false)
18+
19+
useEffect(() => {
20+
const id = setTimeout(() => {
21+
setShowCookies(true)
22+
}, 11000)
23+
24+
return () => clearTimeout(id)
25+
}, [])
26+
1627
useEffect(() => {
1728
const show: IntersectionObserverCallback = (e) => {
1829
e.forEach((element) => {
@@ -51,6 +62,11 @@ const Page: NextPage = () => {
5162
<Prices />
5263
<Details />
5364
<ContactForm />
65+
{showCookies && (
66+
<CookieConsent expires={90} cookieName="rao_nagos_acceptcgu" buttonText="Bien sûr" buttonStyle={{ color: "white", backgroundColor: "#00abf3", borderRadius: "15px" }}>
67+
{"En poursuivant votre navigation, vous acceptez les conditions d'utilisation."}
68+
</CookieConsent>
69+
)}
5470
</>
5571
)
5672
}

pages/privacy.tsx

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import Head from "next/head"
2+
import { sitename } from "@libs/app"
3+
import Privacy from "@legals/privacy"
4+
5+
import type { NextPage } from "next"
6+
7+
const title = `${sitename} - Politiques de confidentialité`
8+
9+
const Page: NextPage = () => {
10+
return (
11+
<>
12+
<Head>
13+
<title>{title}</title>
14+
</Head>
15+
<Privacy />
16+
</>
17+
)
18+
}
19+
20+
export default Page

pages/terms.tsx

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import Head from "next/head"
2+
import { sitename } from "@libs/app"
3+
import Terms from "@legals/terms"
4+
5+
import type { NextPage } from "next"
6+
7+
const title = `${sitename} - Mentions légales`
8+
9+
const Page: NextPage = () => {
10+
return (
11+
<>
12+
<Head>
13+
<title>{title}</title>
14+
</Head>
15+
<Terms />
16+
</>
17+
)
18+
}
19+
20+
export default Page

src/components/contactForm.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export default function Component() {
3131
return (
3232
<section id="contact">
3333
<div className="text-center">
34-
<h2>Nous contacter</h2>
34+
<h2 className="h2">Nous contacter</h2>
3535
</div>
3636
<div className="flex flex-col items-center">
3737
<form onSubmit={onSubmit} className="form">

src/components/footer.tsx

+9-4
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,20 @@
11
import { sitename, fbAppId } from "@libs/app"
22
import { useEffect, useState } from "react"
3+
import Link from "next/link"
4+
import { useRouter } from "next/router"
35

4-
export default function Header() {
6+
export default function Footer() {
57
const [facebookUrl, setFbURL] = useState(`https://www.facebook.com/raonagos`)
68

79
useEffect(() => {
810
if (navigator.userAgent.match("Android|iPhone|iPad")) setFbURL(`fb://profile/${fbAppId}`)
911
}, [])
1012

13+
const { pathname } = useRouter()
14+
const match = pathname.match(/^(\/terms|\/privacy)$/)
15+
1116
return (
12-
<footer className="full-bleed bg-primary-100 text-white py-4 lg:py-12 px-4 lg:px-20">
17+
<footer className={`full-bleed ${match ? "bg-gray-200" : "bg-primary-100 text-white"} py-4 lg:py-12 px-4 lg:px-20`}>
1318
<div className="flex flex-col justify-evenly lg:flex-row gap-y-8">
1419
<div>
1520
<div className="flex flex-col gap-y-2">
@@ -69,10 +74,10 @@ export default function Header() {
6974
<div className="flex flex-col justify-center lg:flex-row gap-x-6 gap-y-2 text-sm mt-12">
7075
<p>© 2020 - 2022 {sitename} - Agence digitale</p>
7176
<p>
72-
<a href="#">Mentions légales</a>
77+
<Link href="/terms">Mentions légales</Link>
7378
</p>
7479
<p>
75-
<a href="#">Politiques de confidentialité</a>
80+
<Link href="/privacy">Politiques de confidentialité</Link>
7681
</p>
7782
</div>
7883
</footer>

src/components/header.tsx

+7-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useState } from "react"
22
import { useParallax } from "react-scroll-parallax"
3-
import Image from "next/legacy/image"
3+
import Image from "next/image"
44
import { sitename } from "@libs/app"
55

66
import hero from "@images/hero_bg.webp"
@@ -16,11 +16,15 @@ export default function Header() {
1616
const shadowMyText: CSSProperties = {
1717
textShadow: "0.1rem 0.1rem 0.8rem #00abf3",
1818
}
19+
const imageStyling: CSSProperties = {
20+
objectFit: "cover",
21+
objectPosition: "26%",
22+
}
1923

2024
return (
2125
<header className="poppins">
2226
<div ref={ref} className="hero">
23-
<Image src={hero} layout="fill" objectFit="cover" objectPosition="26%" priority alt="Rao nagos with services" />
27+
<Image src={hero} fill style={imageStyling} priority alt="Rao nagos with services" />
2428
</div>
2529
<div className="navbar">
2630
<div className="brand">{sitename}</div>
@@ -54,7 +58,7 @@ export default function Header() {
5458
AGENCE DIGITALE
5559
</h1>
5660
<p className="mt-8 md:mt-12" style={shadowMyText}>
57-
Ton créateur de site web, de bot automatisé et de serveur de messagerie.
61+
{"Ton créateur de site web, d'automatisation de tâche et de serveur de messagerie."}
5862
</p>
5963
</section>
6064
</header>

src/components/prices.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export default function Component() {
3535
return (
3636
<section id="prices">
3737
<div className="flex justify-center lg:justify-end">
38-
<h2 className="observer">Détails des tarifs</h2>
38+
<h2 className="h2 observer">Détails des tarifs</h2>
3939
</div>
4040
<div className="overflow-x-auto">
4141
<table>

src/components/whatwedo.tsx

+15-11
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import Image from "next/legacy/image"
1+
import Image from "next/image"
22

33
import w1 from "@images/w-1.webp"
44
import w2 from "@images/w-2.webp"
@@ -9,14 +9,16 @@ export default function Component() {
99
return (
1010
<section id="whatwedo" className="relative z-10 bg-black text-white full-bleed p-3 md:p-6 py-12">
1111
<div className="flex flex-col items-center lg:block mb-4">
12-
<h2 className="observer">Nos oeuvres</h2>
12+
<h2 className="h2 observer">Nos oeuvres</h2>
1313
<p>{`Si tu cherches à renforcer ta présence sur la toile ou à maximiser ton temps sur les marchés mondiaux ou bien à envoyer des mails avec ton domaine en .pf de manière sécurisée, nous te proposons 3 services :`}</p>
1414
</div>
1515
<div className="work-items">
1616
<div className="flex flex-col">
1717
<div className="overlay-image">
18-
<Image src={w1} placeholder="blur" alt="Man who lauched our trading bot" />
19-
<div>
18+
<div className="embed-overlay">
19+
<Image src={w1} placeholder="blur" alt="Man who lauched our trading bot" />
20+
</div>
21+
<div className="overlay-text">
2022
<span className="poppins poppins-700 text-2xl">Rao bot</span>
2123
<p className="text-center p-4">
2224
<span className="italic">Automate place order</span>
@@ -28,8 +30,10 @@ export default function Component() {
2830
</div>
2931
</div>
3032
<div className="overlay-image">
31-
<Image src={w4} placeholder="blur" alt="An email which crossed our server" />
32-
<div>
33+
<div className="embed-overlay">
34+
<Image src={w4} placeholder="blur" alt="An email which crossed our server" />
35+
</div>
36+
<div className="overlay-text">
3337
<span className="poppins poppins-700 text-2xl">Rao mail server</span>
3438
<p className="text-center p-4">
3539
{"Comptes utilisateurs "}
@@ -41,8 +45,10 @@ export default function Component() {
4145
</div>
4246
</div>
4347
<div className="overlay-image">
44-
<Image src={w2} height={594} placeholder="blur" alt="Our 4th website : chanson du fenua" />
45-
<div>
48+
<div className="embed-overlay">
49+
<Image src={w2} height={594} placeholder="blur" alt="Our 4th website : chanson du fenua" />
50+
</div>
51+
<div className="overlay-text">
4652
<span className="poppins poppins-700 text-2xl">Rao web</span>
4753
<p className="text-center p-4">
4854
{"Quatrième site web de l'agence : "}
@@ -68,9 +74,7 @@ export default function Component() {
6874
<i className="gray">150 000 XPF</i>
6975
</span>
7076
<p className="card-text">
71-
{
72-
"Rao bot est un service avec lequel tu peux automatiser tes actions et rentabiliser ton temps. Par exemple depuis 2016, nous sommes au service des professionnels et des particuliers qui veulent tirer parti du marché des cryptomonnaies. Nous disposons de compétences en matière de trading automatique pour tous les types de stratégies, que ce soit à court ou à long terme, sur une journée ou même sur plusieurs mois."
73-
}
77+
{`Rao bot est un service avec lequel tu peux automatiser tes actions et rentabiliser ton temps. Par exemple depuis 2016, nous sommes au service des professionnels et des particuliers qui veulent tirer parti du marché des cryptomonnaies. Nous disposons de compétences en matière de trading automatique, d'envoie de message électronique programmé ou d'optimisation d'espace disque des serveurs.`}
7478
</p>
7579
</div>
7680
<div className="card">

src/components/whoweare.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ export default function Component() {
44
return (
55
<section id="whoweare" className="relative z-10 bg-white p-3 py-12">
66
<div className="presentation">
7-
<h2 className="observer">IA ORA NA</h2>
7+
<h2 className="h2 observer">IA ORA NA</h2>
88
<p className="md:text-center">
99
{`${sitename} est une agence numérique spécialisée dans la création de sites web `}
1010
<strong>

src/legals/header.tsx

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { sitename } from "@libs/app"
2+
import Link from "next/link"
3+
4+
export default function Header() {
5+
return (
6+
<header className="poppins">
7+
<div className="p-12">
8+
<div className="brand">
9+
<Link href="/">{sitename}</Link>
10+
</div>
11+
</div>
12+
</header>
13+
)
14+
}

0 commit comments

Comments
 (0)