Skip to content

Commit a0bafd4

Browse files
tetuaorotetuaoro
committed
feat: add schema, add detail section, add footer, update prices section
* schema, a local buisiness *
1 parent af109c4 commit a0bafd4

File tree

12 files changed

+249
-15
lines changed

12 files changed

+249
-15
lines changed

‎package.json

+1
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
"eslint": "8.20.0",
2323
"eslint-config-next": "12.2.3",
2424
"postcss": "^8.4.16",
25+
"schema-dts": "^1.1.0",
2526
"tailwindcss": "^3.1.6",
2627
"typescript": "4.7.4"
2728
}

‎pages/_app.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1-
import Header from "@components/header"
21
import "@styles/globals.css"
2+
import Header from "@components/header"
3+
import Footer from "@components/footer"
4+
35
import type { AppProps } from "next/app"
46

57
export default function MyApp({ Component, pageProps }: AppProps) {
@@ -9,6 +11,7 @@ export default function MyApp({ Component, pageProps }: AppProps) {
911
<main>
1012
<Component {...pageProps} />
1113
</main>
14+
<Footer />
1215
</>
1316
)
1417
}

‎pages/index.tsx

+7-4
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
import Head from "next/head"
22
import { useEffect } from "react"
3-
import { siteurl, sitename, fbAppId } from "@libs/app"
3+
import { siteurl, sitename, fbAppId, description } from "@libs/app"
4+
import Organization from "@libs/schema"
45
import Whoweare from "@components/whoweare"
56
import Whatwedo from "@components/whatwedo"
67
import Prices from "@components/prices"
8+
import Details from "@components/details"
9+
import ContactForm from "@components/contactForm"
710

811
import type { NextPage } from "next"
912

1013
const title = `${sitename} - Créateur de site web, de bot de trading et de serveur de messagerie`
11-
const description =
12-
"Rao nagos est une agence numérique qui créée à ta place des sites web personnalisés, des robots de trading uniques et des serveurs de messagerie performants. On est spécialisé dans la création d'un produit final avec une grande expérience utilisateur, un design propre et des fonctionnalités riches."
1314

1415
const Page: NextPage = () => {
1516
useEffect(() => {
@@ -41,11 +42,13 @@ const Page: NextPage = () => {
4142
<meta property="og:image:width" content="1280" />
4243
<meta property="og:image:height" content="727" />
4344
<meta property="og:image:type" content="image/webp" />
44-
<script type="application/ld+json">{JSON.stringify({})}</script>
45+
<script type="application/ld+json">{JSON.stringify({Organization})}</script>
4546
</Head>
4647
<Whoweare />
4748
<Whatwedo />
4849
<Prices />
50+
<Details />
51+
<ContactForm />
4952
</>
5053
)
5154
}

‎public/icons/logo_x144.webp

2.86 KB
Binary file not shown.

‎src/components/contactForm.tsx

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
export default function Component() {
2+
return (
3+
<section id="details">
4+
<div className="text-center">
5+
<h2>Nous contacter</h2>
6+
</div>
7+
<div className="flex flex-col items-center">
8+
<form className="form">
9+
<input type="text" placeholder="Nom complet" name="fullname" required />
10+
<input type="tel" pattern="^(40|87|89)([0-9]{6})$" placeholder="Téléphone" name="telephone" />
11+
<input type="email" placeholder="Email" name="email" required />
12+
<textarea rows={4} name="message" placeholder="Message"></textarea>
13+
<button type="submit">Envoyer</button>
14+
</form>
15+
</div>
16+
</section>
17+
)
18+
}

‎src/components/details.tsx

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
export default function Component() {
2+
return (
3+
<section id="details">
4+
<div className="py-8 lg:py-16 grid grid-cols-1 lg:grid-cols-3 gap-y-12 full-bleed bg-black text-white text-center">
5+
<div>
6+
<h3 className="text-4xl font-bold">12+</h3>
7+
<span className="text-xl">Bot vendu</span>
8+
</div>
9+
<div>
10+
<h3 className="text-4xl font-bold">2+</h3>
11+
<span className="text-xl">Server de messagerie installé</span>
12+
</div>
13+
<div>
14+
<h3 className="text-4xl font-bold">4+</h3>
15+
<span className="text-xl">Site web créé</span>
16+
</div>
17+
</div>
18+
</section>
19+
)
20+
}

‎src/components/footer.tsx

+38-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,43 @@
1+
import { sitename } from "@libs/app"
2+
13
export default function Header() {
24
return (
3-
<footer>
4-
<div></div>
5+
<footer className="full-bleed bg-primary-100 text-white py-4 lg:py-12 px-4 lg:px-20">
6+
<div className="flex flex-col justify-evenly items-center lg:flex-row gap-y-8">
7+
<div>
8+
<div className="flex flex-col gap-y-2">
9+
<div className="flex items-center">
10+
<h3 className="text-xl font-bold">Information</h3>
11+
</div>
12+
<div className="flex items-center">
13+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-geo-alt-fill" viewBox="0 0 16 16">
14+
<path d="M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10zm0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6z" />
15+
</svg>
16+
<span className="ml-2">Tahiti, Papeete</span>
17+
</div>
18+
<div className="flex items-center">
19+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-telephone-fill" viewBox="0 0 16 16">
20+
<path
21+
fillRule="evenodd"
22+
d="M1.885.511a1.745 1.745 0 0 1 2.61.163L6.29 2.98c.329.423.445.974.315 1.494l-.547 2.19a.678.678 0 0 0 .178.643l2.457 2.457a.678.678 0 0 0 .644.178l2.189-.547a1.745 1.745 0 0 1 1.494.315l2.306 1.794c.829.645.905 1.87.163 2.611l-1.034 1.034c-.74.74-1.846 1.065-2.877.702a18.634 18.634 0 0 1-7.01-4.42 18.634 18.634 0 0 1-4.42-7.009c-.362-1.03-.037-2.137.703-2.877L1.885.511z"
23+
/>
24+
</svg>
25+
<span className="ml-2">
26+
<a href="tel:+68987323795">+689 87323795</a>
27+
</span>
28+
</div>
29+
<div className="flex items-center">
30+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-envelope-fill" viewBox="0 0 16 16">
31+
<path d="M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555ZM0 4.697v7.104l5.803-3.558L0 4.697ZM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757Zm3.436-.586L16 11.801V4.697l-5.803 3.546Z" />
32+
</svg>
33+
<span className="ml-2">
34+
<a href="mailto:[email protected]">[email protected]</a>
35+
</span>
36+
</div>
37+
</div>
38+
</div>
39+
</div>
40+
<div className="text-center text-sm mt-12">© 2020 - 2022 {sitename} - Agence digitale</div>
541
</footer>
642
)
743
}

‎src/components/prices.tsx

+71-6
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,16 @@ const Caption = () => {
44
const styles: CSSProperties = { captionSide: "bottom", textAlign: "left" }
55
return (
66
<caption style={styles}>
7-
<small>Toute intervention après livraison est facturée, à la journée, de 7000 XPF</small>
7+
<small>
8+
Toute intervention après livraison est facturée, à la journée, de 7000 XPF
9+
<br />
10+
<span className="flex items-center">
11+
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" className="bi bi-check-circle-fill" viewBox="0 0 16 16">
12+
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
13+
</svg>
14+
<span className="ml-2">en option</span>
15+
</span>
16+
</small>
817
</caption>
918
)
1019
}
@@ -53,8 +62,8 @@ const Tbody = () => {
5362
<tr>
5463
<td className="th">Prix</td>
5564
<td>40 000</td>
56-
<td>*</td>
57-
<td>*</td>
65+
<td>-</td>
66+
<td>-</td>
5867
</tr>
5968
<tr>
6069
<td className="th">
@@ -116,11 +125,27 @@ const Tbody = () => {
116125
</svg>
117126
</td>
118127
</tr>
128+
<tr>
129+
<td className="th">
130+
<small>Progressive Web App</small>
131+
</td>
132+
<td></td>
133+
<td></td>
134+
<td>
135+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-check-circle-fill" viewBox="0 0 16 16">
136+
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
137+
</svg>
138+
</td>
139+
</tr>
119140
<tr>
120141
<td className="th">Mensualité</td>
121142
<td></td>
122-
<td>{"7000 + "}</td>
123-
<td>{"7000 + "}</td>
143+
<td>
144+
<small>{"à partir de 7000"}</small>
145+
</td>
146+
<td>
147+
<small>*</small>
148+
</td>
124149
</tr>
125150
<tr>
126151
<td className="th">
@@ -163,6 +188,18 @@ const Tbody = () => {
163188
</td>
164189
<td></td>
165190
</tr>
191+
<tr>
192+
<td className="th">
193+
<small>Rapport/Alerte</small>
194+
</td>
195+
<td></td>
196+
<td>
197+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-check-circle-fill" viewBox="0 0 16 16">
198+
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
199+
</svg>
200+
</td>
201+
<td></td>
202+
</tr>
166203
<tr>
167204
<td className="th">Maintenance</td>
168205
<td></td>
@@ -177,7 +214,7 @@ const Tbody = () => {
177214
<td className="th">
178215
<small>Durée min. de conception</small>
179216
</td>
180-
<td>{"1 mois"}</td>
217+
<td>{"1-3 mois"}</td>
181218
</tr>
182219
<Tr />
183220
<tr className="transition-0">
@@ -196,6 +233,34 @@ const Tbody = () => {
196233
<td>600 000</td>
197234
<td>*</td>
198235
</tr>
236+
<tr>
237+
<td className="th">Cloud</td>
238+
<td></td>
239+
<td>
240+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-check-circle-fill" viewBox="0 0 16 16">
241+
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
242+
</svg>
243+
</td>
244+
<td>
245+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-check-circle-fill" viewBox="0 0 16 16">
246+
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
247+
</svg>
248+
</td>
249+
</tr>
250+
<tr>
251+
<td className="th">Self hosting</td>
252+
<td></td>
253+
<td>
254+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-check-circle-fill" viewBox="0 0 16 16">
255+
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
256+
</svg>
257+
</td>
258+
<td>
259+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-check-circle-fill" viewBox="0 0 16 16">
260+
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
261+
</svg>
262+
</td>
263+
</tr>
199264
<tr>
200265
<td className="th">Maintenance</td>
201266
<td></td>

‎src/libs/app.ts

+4
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,7 @@ export const siteurl = "https://www.rao-nagos.pf"
22
export const sitename = "Rao nagos"
33
export const fbAppId = "1089325565354845"
44
export const pwaId = "pf.rao-nagos.www"
5+
export const telephone = "+68987323795"
6+
export const description =
7+
"Rao nagos est une agence numérique qui créée à ta place des sites web personnalisés, des robots de trading uniques et des serveurs de messagerie performants. On est spécialisé dans la création d'un produit final avec une grande expérience utilisateur, un design propre et des fonctionnalités riches."
8+
export const sameAs = "https://www.facebook.com/raonagos"

‎src/libs/schema.ts

+52
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import { WithContext, PostalAddress, OpeningHoursSpecification, AggregateRating, LocalBusiness } from "schema-dts"
2+
import { sitename, siteurl, telephone, description, sameAs } from "@libs/app"
3+
4+
const address: PostalAddress = {
5+
"@type": "PostalAddress",
6+
addressLocality: "Paea",
7+
postalCode: "98711",
8+
streetAddress: "Paea, Polynésie française",
9+
addressCountry: "PF",
10+
addressRegion: "Paea",
11+
}
12+
13+
const openingHoursSpecification: OpeningHoursSpecification = {
14+
"@type": "OpeningHoursSpecification",
15+
dayOfWeek: ["Monday", "Tuesday", "Wednesday", "Thursday"],
16+
opens: "09:00:00",
17+
closes: "14:00:00",
18+
}
19+
20+
const aggregateRating: AggregateRating = {
21+
"@type": "AggregateRating",
22+
ratingValue: 4,
23+
bestRating: 5,
24+
ratingCount: 18,
25+
}
26+
27+
const organization: WithContext<LocalBusiness> = {
28+
"@context": "https://schema.org",
29+
"@type": "LocalBusiness",
30+
address,
31+
aggregateRating,
32+
telephone,
33+
sameAs,
34+
description,
35+
url: siteurl,
36+
logo: `${siteurl}/icons/logo_x144.webp`,
37+
name: sitename,
38+
image: [`${siteurl}/images/media_cover.webp`, `${siteurl}/images/w-1.webp`, `${siteurl}/images/w-2.webp`, `${siteurl}/images/w-4.webp`],
39+
priceRange: "€€€€",
40+
openingHoursSpecification: [
41+
{
42+
...openingHoursSpecification,
43+
},
44+
{
45+
...openingHoursSpecification,
46+
dayOfWeek: "Friday",
47+
closes: "12:00:00",
48+
},
49+
],
50+
}
51+
52+
export default organization

‎styles/globals.css

+29-2
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111

1212
body,
1313
.__next {
14-
@apply m-0 p-0 text-lg;
14+
@apply m-0 p-0 text-lg overflow-x-hidden;
1515
font-family: "Open Sans", sans-serif;
1616
}
1717

@@ -86,6 +86,11 @@
8686
@apply scale-100;
8787
}
8888

89+
.full-bleed {
90+
@apply w-screen;
91+
margin-left: calc(50% - 50vw);
92+
}
93+
8994
h2 {
9095
@apply poppins poppins-700 font-bold uppercase text-2xl md:text-4xl mb-4 sm:mb-8 md:mb-12;
9196
@apply before:content-['\_\_\_\_\_'] before:text-sm sm:before:text-lg before:text-primary-100 before:-tracking-[.2em];
@@ -209,7 +214,11 @@
209214
}
210215

211216
tr.transition-0 td {
212-
@apply hover:translate-x-4 transition-all duration-300 ease-in-out;
217+
@apply hover:translate-x-4 transition-transform duration-300 ease-in-out;
218+
}
219+
220+
tr.transition-0 td:hover svg {
221+
@apply scale-125 transition-transform duration-300 ease-in-out;
213222
}
214223

215224
td:not(.th),
@@ -230,4 +239,22 @@
230239
tr td:last-child {
231240
@apply border-l-0 border-r-0;
232241
}
242+
243+
/* CONTACT */
244+
.form {
245+
@apply w-full;
246+
@apply flex flex-col items-center gap-y-8;
247+
}
248+
249+
.form input,
250+
.form textarea {
251+
@apply py-2 px-4 w-full md:w-1/2;
252+
@apply transition-all duration-200 ease-in-out;
253+
@apply border-2 hover:scale-105 focus:scale-105 focus-visible:border-yellow-400 outline-none focus:border-yellow-400 focus-within:border-yellow-400 border-primary-100 rounded-r-3xl rounded-l-3xl;
254+
}
255+
256+
.form button {
257+
@apply py-2 px-4;
258+
@apply border-2 border-primary-100 rounded-3xl hover:bg-primary-100 transition-colors duration-200 ease-in-out hover:text-white;
259+
}
233260
}

‎yarn.lock

+5
Original file line numberDiff line numberDiff line change
@@ -1921,6 +1921,11 @@ scheduler@^0.23.0:
19211921
dependencies:
19221922
loose-envify "^1.1.0"
19231923

1924+
schema-dts@^1.1.0:
1925+
version "1.1.0"
1926+
resolved "https://registry.yarnpkg.com/schema-dts/-/schema-dts-1.1.0.tgz#33227971076ef1daa33e56a3127a8aae030e81c9"
1927+
integrity sha512-vdmbs/5ycj4zyKpZIDqTcy+IZi4s7c38RVAYuDmRi7zgxUT8wRWPMLzg0jr7FjdVunYu9yZ00F3+XcZTTFcTOQ==
1928+
19241929
semver@^6.3.0:
19251930
version "6.3.0"
19261931
resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"

0 commit comments

Comments
 (0)