remove linkedin and add good instagram

This commit is contained in:
ordinarthur 2026-04-05 17:55:37 +02:00
parent d884e07c9b
commit 0523299ed3
4 changed files with 83 additions and 33 deletions

View File

@ -11,7 +11,6 @@ export default defineType({
defineField({ name: 'email', title: 'Email de contact', type: 'string' }),
defineField({ name: 'phone', title: 'Téléphone', type: 'string' }),
defineField({ name: 'instagram', title: 'Instagram', type: 'url' }),
defineField({ name: 'linkedin', title: 'LinkedIn', type: 'url' }),
defineField({
name: 'heroImages',
title: "Images hero page d'accueil",

View File

@ -8,8 +8,11 @@ const year = new Date().getFullYear();
<div class="ft__row">
<span class="ft__copy">&copy; {year}</span>
<div class="ft__links">
<a href="https://instagram.com/aureliebarre" target="_blank" rel="noopener">instagram</a>
<a href="https://linkedin.com/in/aureliebarre" target="_blank" rel="noopener">linkedin</a>
<a
href="https://www.instagram.com/douzoute.maison.dangele/"
target="_blank"
rel="noopener">instagram</a
>
</div>
</div>
</div>

View File

@ -6,8 +6,11 @@ const year = new Date().getFullYear();
<div class="ft__row">
<span class="ft__copy">&copy; {year}</span>
<div class="ft__links">
<a href="https://instagram.com/aureliebarre" target="_blank" rel="noopener">instagram</a>
<a href="https://linkedin.com/in/aureliebarre" target="_blank" rel="noopener">linkedin</a>
<a
href="https://www.instagram.com/douzoute.maison.dangele/"
target="_blank"
rel="noopener">instagram</a
>
</div>
</div>
</footer>
@ -29,7 +32,15 @@ const year = new Date().getFullYear();
color: var(--text-3);
}
.ft__links { display: flex; gap: 2rem; }
.ft__links a { color: var(--text-3); transition: color 0.2s; }
.ft__links a:hover { color: var(--text); }
.ft__links {
display: flex;
gap: 2rem;
}
.ft__links a {
color: var(--text-3);
transition: color 0.2s;
}
.ft__links a:hover {
color: var(--text);
}
</style>

View File

@ -1,11 +1,11 @@
---
import BaseLayout from '../layouts/BaseLayout.astro';
import BaseLayout from "../layouts/BaseLayout.astro";
const stripImages = [
{ src: '/images/events/engie/04.jpg', alt: 'Engie' },
{ src: '/images/events/la-premiere/02.jpeg', alt: 'La Première' },
{ src: '/images/perennes/devoteam/03.jpg', alt: 'Devoteam' },
{ src: '/images/events/dior/09.jpeg', alt: 'Dior' },
{ src: "/images/events/engie/04.jpg", alt: "Engie" },
{ src: "/images/events/la-premiere/02.jpeg", alt: "La Première" },
{ src: "/images/perennes/devoteam/03.jpg", alt: "Devoteam" },
{ src: "/images/events/dior/09.jpeg", alt: "Dior" },
];
---
@ -17,42 +17,73 @@ const stripImages = [
<span class="hero__line hero__line--1">parlons</span>
<span class="hero__line hero__line--2">projet</span>
</h1>
<div class="contact__grid rv" style="--d:1">
<!-- Infos de contact -->
<div class="contact__info">
<div class="contact__group">
<span class="label">email</span>
<a href="mailto:contact@aureliebarre.fr" class="contact__link">contact@aureliebarre.fr</a>
<a href="mailto:contact@aureliebarre.fr" class="contact__link"
>contact@aureliebarre.fr</a
>
</div>
<div class="contact__group">
<span class="label">réseaux</span>
<div class="contact__socials">
<a href="https://instagram.com/aureliebarre" target="_blank" rel="noopener" class="contact__link">instagram</a>
<a href="https://linkedin.com/in/aureliebarre" target="_blank" rel="noopener" class="contact__link">linkedin</a>
<a
href="https://www.instagram.com/douzoute.maison.dangele/"
target="_blank"
rel="noopener"
class="contact__link">instagram</a
>
</div>
</div>
</div>
<!-- Formulaire de contact -->
<div class="contact__form-wrap">
<form class="contact__form" action="mailto:contact@aureliebarre.fr" method="POST" enctype="text/plain">
<form
class="contact__form"
action="mailto:contact@aureliebarre.fr"
method="POST"
enctype="text/plain"
>
<div class="form__group">
<input type="text" id="name" name="name" placeholder=" " required />
<input
type="text"
id="name"
name="name"
placeholder=" "
required
/>
<label for="name">nom & prénom</label>
</div>
<div class="form__group">
<input type="email" id="email" name="email" placeholder=" " required />
<input
type="email"
id="email"
name="email"
placeholder=" "
required
/>
<label for="email">adresse email</label>
</div>
<div class="form__group">
<textarea id="message" name="message" placeholder=" " required rows="1"></textarea>
<textarea
id="message"
name="message"
placeholder=" "
required
rows="1"></textarea>
<label for="message">votre projet</label>
</div>
<button type="submit" class="form__submit">
envoyer la demande
<svg width="14" height="14" viewBox="0 0 16 16" fill="none">
<path d="M3 8H13M13 8L9 4M13 8L9 12" stroke="currentColor" stroke-width="1"/>
<path
d="M3 8H13M13 8L9 4M13 8L9 12"
stroke="currentColor"
stroke-width="1"></path>
</svg>
</button>
</form>
@ -63,17 +94,19 @@ const stripImages = [
<!-- Photo strip: 4 images edge-to-edge -->
<div class="hero__strip rv" style="--d:2">
{stripImages.map((img, i) => (
<div class="hero__strip-img" style={`--i:${i}`}>
<img src={img.src} alt={img.alt} />
</div>
))}
{
stripImages.map((img, i) => (
<div class="hero__strip-img" style={`--i:${i}`}>
<img src={img.src} alt={img.alt} />
</div>
))
}
</div>
</section>
</BaseLayout>
<style>
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400..800&display=swap');
@import url("https://fonts.googleapis.com/css2?family=Syne:wght@400..800&display=swap");
.hero {
padding-top: calc(var(--header-h) + 4vh);
@ -89,7 +122,7 @@ const stripImages = [
}
.hero__name {
font-family: 'Syne', sans-serif;
font-family: "Syne", sans-serif;
font-size: clamp(4rem, 12vw, 11rem);
font-weight: 700;
line-height: 0.88;
@ -98,7 +131,9 @@ const stripImages = [
margin-bottom: 5rem;
}
.hero__line { display: block; }
.hero__line {
display: block;
}
.hero__line--2 {
font-weight: 800;
color: transparent;
@ -256,7 +291,9 @@ const stripImages = [
.hero__strip:hover .hero__strip-img:not(:hover) img {
filter: brightness(0.85);
transition: filter 0.4s, transform 0.8s var(--ease);
transition:
filter 0.4s,
transform 0.8s var(--ease);
}
/* Responsive */
@ -270,7 +307,7 @@ const stripImages = [
grid-template-columns: 1fr 1fr;
gap: 2px;
}
.contact__grid {
grid-template-columns: 1fr;
gap: 4rem;