Finalized footer
This commit was merged in pull request #12.
This commit is contained in:
@@ -3,6 +3,8 @@ import { Container } from "../../util/container";
|
||||
import { ObjectField } from "@tinacms/schema-tools/dist/types";
|
||||
import facebookImage from "../../../assets/img/facebook.svg";
|
||||
import instagramImage from "../../../assets/img/instagram.svg";
|
||||
import { tinaField } from "tinacms/dist/react";
|
||||
import { TinaMarkdown } from "tinacms/dist/rich-text";
|
||||
|
||||
export const Footer = ({ data, rawData }) => {
|
||||
return (
|
||||
@@ -10,25 +12,58 @@ export const Footer = ({ data, rawData }) => {
|
||||
<Container className="relative" size="small">
|
||||
<div className={ "flex flex-row justify-between" }>
|
||||
<div>
|
||||
<p>Contact :<br/>
|
||||
<a href="mailto:psychartherapie@gmail.com" onClick={ () => { /* window.dataLayer.push({ event: "mail-click" });*/ } }>
|
||||
psychartherapie@gmail.com
|
||||
<p>
|
||||
<span data-tina-field={ tinaField(data?.contact, "label") }>
|
||||
{ data?.contact?.label }
|
||||
</span>
|
||||
<br/>
|
||||
<a href={ `mailto:${ data?.contact?.mail }` }
|
||||
onClick={ () => { /* window.dataLayer.push({ event: "mail-click" });*/ } }
|
||||
data-tina-field={ tinaField(data?.contact, "mail") }>
|
||||
{ data?.contact?.mail }
|
||||
</a>
|
||||
<br/>
|
||||
<b>06 49 23 02 90</b>
|
||||
<b data-tina-field={ tinaField(data?.contact, "phone") }>
|
||||
{ data?.contact?.phone }
|
||||
</b>
|
||||
</p>
|
||||
<p>SIRET 911 883 338 00012<br/><a href="legals.html">Mentions légales</a></p>
|
||||
<div id="socials" className="flex flex-row">
|
||||
<a href="https://www.facebook.com/psychartherapie.gard" onClick={ () => { /* window.dataLayer.push({ socials: "fb-click" });*/ } } className="py-2 me-2">
|
||||
<img src={ facebookImage.src } alt="Facebook"/>
|
||||
</a>
|
||||
<a href="https://www.instagram.com/psychartherapie" onClick={ () => { /* window.dataLayer.push({ socials: "insta-click" });*/ } } className="py-2">
|
||||
<img src={ instagramImage.src } alt="Instagram"/>
|
||||
<p>
|
||||
SIRET <span data-tina-field={ tinaField(data?.legals, "siret") }>
|
||||
{ data?.legals?.siret }
|
||||
</span>
|
||||
<br/>
|
||||
<a href={ data?.legals?.link?.url }
|
||||
data-tina-field={ tinaField(data?.legals, "link") }>
|
||||
{ data?.legals?.link?.label }
|
||||
</a>
|
||||
</p>
|
||||
<div id="socials"
|
||||
className="flex flex-row"
|
||||
data-tina-field={ tinaField(data, "social") }>
|
||||
{ data?.social?.facebook &&
|
||||
<a href={ data?.social?.facebook }
|
||||
onClick={ () => { /* window.dataLayer.push({ socials: "fb-click" });*/ } }
|
||||
className="py-2 me-2">
|
||||
<img src={ facebookImage } alt="Facebook"/>
|
||||
</a> }
|
||||
|
||||
{ data?.social?.instagram &&
|
||||
<a href={ data?.social?.instagram }
|
||||
onClick={ () => { /* window.dataLayer.push({ socials: "insta-click" });*/ } }
|
||||
className="py-2">
|
||||
<img src={ instagramImage } alt="Instagram"/>
|
||||
</a> }
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<p>© 2023 – Fait avec amour par <a className="mx-1" href="https://www.linkedin.com/in/nolwenn-meyer/">Nolwenn Meyer</a></p>
|
||||
<p data-tina-field={ tinaField(data, "copyright") }>
|
||||
© { data?.copyright?.year }
|
||||
{ data?.copyright?.subtext?.children?.length > 0 &&
|
||||
<> –<div className={ "ml-1 float-right" }>
|
||||
<TinaMarkdown content={ data.copyright?.subtext } />
|
||||
</div>
|
||||
</> }
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Container>
|
||||
@@ -41,6 +76,90 @@ export const footerSchema: ObjectField = {
|
||||
label: "Footer",
|
||||
name: "footer",
|
||||
fields: [
|
||||
{
|
||||
type: "object",
|
||||
label: "Contact",
|
||||
name: "contact",
|
||||
defaultItem: {
|
||||
label: "Contact :",
|
||||
mail: "mail@example.com",
|
||||
phone: "00 00 00 00 00"
|
||||
},
|
||||
fields: [
|
||||
{
|
||||
type: "string",
|
||||
label: "Label Contact",
|
||||
name: "label"
|
||||
},
|
||||
{
|
||||
type: "string",
|
||||
label: "Mail",
|
||||
name: "mail"
|
||||
},
|
||||
{
|
||||
type: "string",
|
||||
label: "Téléphone",
|
||||
name: "phone"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
type: "object",
|
||||
label: "Legal",
|
||||
name: "legals",
|
||||
defaultItem: {
|
||||
siret: "000 000 000 00000",
|
||||
link: {
|
||||
label: "Mentions légales",
|
||||
url: "/"
|
||||
}
|
||||
},
|
||||
fields: [
|
||||
{
|
||||
type: "string",
|
||||
label: "SIRET",
|
||||
name: "siret"
|
||||
},
|
||||
{
|
||||
type: "object",
|
||||
label: "Lien Mentions Légales",
|
||||
name: "link",
|
||||
fields: [
|
||||
{
|
||||
type: "string",
|
||||
label: "Texte",
|
||||
name: "label"
|
||||
},
|
||||
{
|
||||
type: "string",
|
||||
label: "Url",
|
||||
name: "url"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
type: "object",
|
||||
label: "Copyright",
|
||||
name: "copyright",
|
||||
defaultItem: {
|
||||
year: "0000",
|
||||
subtext: "El text"
|
||||
},
|
||||
fields: [
|
||||
{
|
||||
type: "string",
|
||||
label: "Année",
|
||||
name: "year"
|
||||
},
|
||||
{
|
||||
type: "rich-text",
|
||||
label: "Sous-texte",
|
||||
name: "subtext"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
type: "object",
|
||||
label: "Social Links",
|
||||
@@ -51,20 +170,10 @@ export const footerSchema: ObjectField = {
|
||||
label: "Facebook",
|
||||
name: "facebook"
|
||||
},
|
||||
{
|
||||
type: "string",
|
||||
label: "Twitter",
|
||||
name: "twitter"
|
||||
},
|
||||
{
|
||||
type: "string",
|
||||
label: "Instagram",
|
||||
name: "instagram"
|
||||
},
|
||||
{
|
||||
type: "string",
|
||||
label: "Github",
|
||||
name: "github"
|
||||
}
|
||||
]
|
||||
}]
|
||||
|
||||
@@ -6,6 +6,13 @@ import { GlobalHeader } from "../../tina/__generated__/types";
|
||||
import { ObjectField } from "@tinacms/schema-tools/dist/types";
|
||||
|
||||
export const Header = ({ data }: { data: GlobalHeader }) => {
|
||||
const navbarToggler: JSX.Element = (
|
||||
<button className="navbar-toggler" type="button" data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span className="navbar-toggler-icon" />
|
||||
</button>
|
||||
);
|
||||
return (
|
||||
<nav className="navbar flex flex-wrap content-between sticky top-0 py-2">
|
||||
<div className="flex grow justify-between px-6 h-full">
|
||||
@@ -21,19 +28,11 @@ export const Header = ({ data }: { data: GlobalHeader }) => {
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<button className="navbar-toggler" type="button" data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span className="navbar-toggler-icon" />
|
||||
</button>
|
||||
<div className={ "flex items-center" } id="navbarSupportedContent">
|
||||
{ navbarToggler }
|
||||
<div className={ "navbar-items flex items-center" } id="navbarSupportedContent">
|
||||
<ul className="flex md:flex-row">
|
||||
{ data.nav &&
|
||||
data.nav.map((item, i) => {
|
||||
/* const activeItem =
|
||||
(item.href === ""
|
||||
? router.asPath === "/"
|
||||
: router.asPath.includes(item.href)) && isClient;*/
|
||||
return (
|
||||
<li
|
||||
key={ `${ item.label }-${ i }` }
|
||||
|
||||
Reference in New Issue
Block a user