Spaces:
Running
Running
fait la page a propos et service et contact - Initial Deployment
Browse files- README.md +7 -5
- apropos.html +243 -0
- contact.html +247 -0
- index.html +261 -18
- prompts.txt +6 -0
- realisations.html +299 -0
- services.html +347 -0
README.md
CHANGED
|
@@ -1,10 +1,12 @@
|
|
| 1 |
---
|
| 2 |
-
title:
|
| 3 |
-
emoji:
|
| 4 |
-
colorFrom:
|
| 5 |
-
colorTo:
|
| 6 |
sdk: static
|
| 7 |
pinned: false
|
|
|
|
|
|
|
| 8 |
---
|
| 9 |
|
| 10 |
-
Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
|
|
|
|
| 1 |
---
|
| 2 |
+
title: sitecatalogue
|
| 3 |
+
emoji: 🐳
|
| 4 |
+
colorFrom: pink
|
| 5 |
+
colorTo: red
|
| 6 |
sdk: static
|
| 7 |
pinned: false
|
| 8 |
+
tags:
|
| 9 |
+
- deepsite
|
| 10 |
---
|
| 11 |
|
| 12 |
+
Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
|
apropos.html
ADDED
|
@@ -0,0 +1,243 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="fr">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>À Propos - Boisdaction</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
+
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
|
| 9 |
+
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
|
| 10 |
+
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
|
| 11 |
+
<script src="https://unpkg.com/feather-icons"></script>
|
| 12 |
+
<style>
|
| 13 |
+
.hero-section {
|
| 14 |
+
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('http://static.photos/workplace/1200x630/1');
|
| 15 |
+
background-size: cover;
|
| 16 |
+
background-position: center;
|
| 17 |
+
}
|
| 18 |
+
.nav-link:hover {
|
| 19 |
+
color: #d1a054;
|
| 20 |
+
}
|
| 21 |
+
.dropdown:hover .dropdown-menu {
|
| 22 |
+
display: block;
|
| 23 |
+
}
|
| 24 |
+
</style>
|
| 25 |
+
</head>
|
| 26 |
+
<body class="font-sans antialiased text-gray-800">
|
| 27 |
+
<!-- Navigation -->
|
| 28 |
+
<nav class="bg-white shadow-lg sticky top-0 z-50">
|
| 29 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 30 |
+
<div class="flex justify-between h-24 items-center">
|
| 31 |
+
<div class="flex-shrink-0 flex items-center">
|
| 32 |
+
<a href="index.html">
|
| 33 |
+
<img class="h-16" src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction">
|
| 34 |
+
</a>
|
| 35 |
+
</div>
|
| 36 |
+
<div class="hidden md:block">
|
| 37 |
+
<div class="ml-10 flex items-center space-x-8">
|
| 38 |
+
<!-- Profile Dropdown -->
|
| 39 |
+
<div class="dropdown relative">
|
| 40 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 41 |
+
Profil <i data-feather="chevron-down" class="inline"></i>
|
| 42 |
+
</button>
|
| 43 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 44 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Équipe</a>
|
| 45 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Reconnaissance</a>
|
| 46 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">À propos</a>
|
| 47 |
+
</div>
|
| 48 |
+
</div>
|
| 49 |
+
|
| 50 |
+
<!-- Services Dropdown -->
|
| 51 |
+
<div class="dropdown relative">
|
| 52 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 53 |
+
Services <i data-feather="chevron-down" class="inline"></i>
|
| 54 |
+
</button>
|
| 55 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 56 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Clé en main</a>
|
| 57 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Conception ingénierie</a>
|
| 58 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Fabrication</a>
|
| 59 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Livraison et installation</a>
|
| 60 |
+
</div>
|
| 61 |
+
</div>
|
| 62 |
+
|
| 63 |
+
<a href="apropos.html" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Carrière</a>
|
| 64 |
+
<a href="realisations.html" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Réalisations</a>
|
| 65 |
+
<a href="contact.html" class="bg-amber-700 text-white px-6 py-2 rounded-md hover:bg-amber-800 transition duration-300">Nous joindre</a>
|
| 66 |
+
</div>
|
| 67 |
+
</div>
|
| 68 |
+
<div class="md:hidden">
|
| 69 |
+
<button class="text-gray-900">
|
| 70 |
+
<i data-feather="menu"></i>
|
| 71 |
+
</button>
|
| 72 |
+
</div>
|
| 73 |
+
</div>
|
| 74 |
+
</div>
|
| 75 |
+
</nav>
|
| 76 |
+
|
| 77 |
+
<!-- Hero Section -->
|
| 78 |
+
<section class="hero-section h-96 flex items-center justify-center text-white">
|
| 79 |
+
<div class="text-center px-4" data-aos="fade-up">
|
| 80 |
+
<h1 class="text-4xl md:text-5xl font-bold mb-4">À Propos de Boisdaction</h1>
|
| 81 |
+
<p class="text-xl max-w-2xl mx-auto">Notre passion pour le bois et l'innovation au service de l'architecture</p>
|
| 82 |
+
</div>
|
| 83 |
+
</section>
|
| 84 |
+
|
| 85 |
+
<!-- About Content -->
|
| 86 |
+
<section class="py-20 bg-white" data-aos="fade-up">
|
| 87 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 88 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-16 items-center mb-16">
|
| 89 |
+
<div class="mb-12 lg:mb-0">
|
| 90 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-6">Notre Histoire</h2>
|
| 91 |
+
<p class="text-lg text-gray-600 mb-8">
|
| 92 |
+
Fondée en 2010, Boisdaction est née de la passion de son fondateur pour le bois et l'architecture. Ce qui a commencé comme un atelier artisanal dans un garage s'est transformé en une entreprise leader dans l'ébénisterie architecturale au Québec.
|
| 93 |
+
</p>
|
| 94 |
+
<p class="text-lg text-gray-600 mb-8">
|
| 95 |
+
Au fil des années, nous avons développé une expertise unique en conception et réalisation de projets d'ébénisterie sur mesure pour des clients résidentiels et commerciaux. Notre équipe de professionnels partage une vision commune : créer des espaces qui servent non seulement l'espace, mais aussi l'humain.
|
| 96 |
+
</p>
|
| 97 |
+
</div>
|
| 98 |
+
<div>
|
| 99 |
+
<img src="http://static.photos/workshop/640x360/2" alt="Atelier Boisdaction" class="rounded-lg shadow-lg">
|
| 100 |
+
</div>
|
| 101 |
+
</div>
|
| 102 |
+
|
| 103 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-16 items-center">
|
| 104 |
+
<div class="order-2 lg:order-1">
|
| 105 |
+
<img src="http://static.photos/team/640x360/3" alt="Équipe Boisdaction" class="rounded-lg shadow-lg">
|
| 106 |
+
</div>
|
| 107 |
+
<div class="mb-12 lg:mb-0 order-1 lg:order-2">
|
| 108 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-6">Notre Équipe</h2>
|
| 109 |
+
<p class="text-lg text-gray-600 mb-8">
|
| 110 |
+
Notre équipe de 25 artisans et designers passionnés travaille chaque jour à repousser les limites de l'ébénisterie. Chacun apporte son expertise unique pour créer des pièces exceptionnelles qui allient fonctionnalité et beauté.
|
| 111 |
+
</p>
|
| 112 |
+
<p class="text-lg text-gray-600 mb-8">
|
| 113 |
+
De l'architecte à l'ébéniste en passant par le designer et l'ingénieur, chaque membre de notre équipe est engagé dans une démarche d'excellence pour surpasser les attentes de nos clients.
|
| 114 |
+
</p>
|
| 115 |
+
</div>
|
| 116 |
+
</div>
|
| 117 |
+
</div>
|
| 118 |
+
</section>
|
| 119 |
+
|
| 120 |
+
<!-- Values Section -->
|
| 121 |
+
<section class="py-20 bg-gray-50" data-aos="fade-up">
|
| 122 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 123 |
+
<h2 class="text-3xl font-bold text-center text-gray-900 mb-16">Nos Valeurs</h2>
|
| 124 |
+
<div class="grid md:grid-cols-3 gap-8">
|
| 125 |
+
<div class="bg-white p-6 rounded-lg shadow-md text-center">
|
| 126 |
+
<div class="text-amber-700 mb-4 mx-auto w-16 h-16 flex items-center justify-center rounded-full bg-amber-100">
|
| 127 |
+
<i data-feather="heart" class="w-8 h-8"></i>
|
| 128 |
+
</div>
|
| 129 |
+
<h3 class="text-xl font-semibold mb-3">Passion</h3>
|
| 130 |
+
<p class="text-gray-600">Chaque projet est une passion qui se transforme en œuvre d'art fonctionnelle.</p>
|
| 131 |
+
</div>
|
| 132 |
+
<div class="bg-white p-6 rounded-lg shadow-md text-center">
|
| 133 |
+
<div class="text-amber-700 mb-4 mx-auto w-16 h-16 flex items-center justify-center rounded-full bg-amber-100">
|
| 134 |
+
<i data-feather="tool" class="w-8 h-8"></i>
|
| 135 |
+
</div>
|
| 136 |
+
<h3 class="text-xl font-semibold mb-3">Excellence</h3>
|
| 137 |
+
<p class="text-gray-600">L'excellence dans l'exécution est notre norme pour chaque projet.</p>
|
| 138 |
+
</div>
|
| 139 |
+
<div class="bg-white p-6 rounded-lg shadow-md text-center">
|
| 140 |
+
<div class="text-amber-700 mb-4 mx-auto w-16 h-16 flex items-center justify-center rounded-full bg-amber-100">
|
| 141 |
+
<i data-feather="users" class="w-8 h-8"></i>
|
| 142 |
+
</div>
|
| 143 |
+
<h3 class="text-xl font-semibold mb-3">Service Client</h3>
|
| 144 |
+
<p class="text-gray-600">Votre satisfaction est au cœur de notre démarche de service.</p>
|
| 145 |
+
</div>
|
| 146 |
+
</div>
|
| 147 |
+
</div>
|
| 148 |
+
</section>
|
| 149 |
+
|
| 150 |
+
<!-- Stats Section -->
|
| 151 |
+
<section class="py-20 bg-amber-700 text-white" data-aos="fade-up">
|
| 152 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 153 |
+
<div class="grid md:grid-cols-4 gap-8 text-center">
|
| 154 |
+
<div>
|
| 155 |
+
<div class="text-5xl font-bold mb-2">120+</div>
|
| 156 |
+
<div class="text-xl">Projets réalisés</div>
|
| 157 |
+
</div>
|
| 158 |
+
<div>
|
| 159 |
+
<div class="text-5xl font-bold mb-2">25</div>
|
| 160 |
+
<div class="text-xl">Membres d'équipe</div>
|
| 161 |
+
</div>
|
| 162 |
+
<div>
|
| 163 |
+
<div class="text-5xl font-bold mb-2">12</div>
|
| 164 |
+
<div class="text-xl">Années d'expérience</div>
|
| 165 |
+
</div>
|
| 166 |
+
<div>
|
| 167 |
+
<div class="text-5xl font-bold mb-2">98%</div>
|
| 168 |
+
<div class="text-xl">Clients satisfaits</div>
|
| 169 |
+
</div>
|
| 170 |
+
</div>
|
| 171 |
+
</div>
|
| 172 |
+
</section>
|
| 173 |
+
|
| 174 |
+
<!-- Contact CTA -->
|
| 175 |
+
<section class="py-20 bg-white" data-aos="fade-up">
|
| 176 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
| 177 |
+
<h2 class="text-3xl font-bold mb-6">Prêt à démarrer votre projet?</h2>
|
| 178 |
+
<p class="text-xl mb-8 max-w-2xl mx-auto">Contactez-nous pour discuter de votre vision et découvrir comment nous pouvons la concrétiser.</p>
|
| 179 |
+
<a href="contact.html" class="inline-block bg-amber-700 text-white px-8 py-3 rounded-md hover:bg-amber-800 transition duration-300 font-semibold">
|
| 180 |
+
Nous contacter
|
| 181 |
+
</a>
|
| 182 |
+
</div>
|
| 183 |
+
</section>
|
| 184 |
+
|
| 185 |
+
<!-- Footer -->
|
| 186 |
+
<footer class="bg-gray-800 text-white py-16">
|
| 187 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 188 |
+
<div class="grid grid-cols-1 md:grid-cols-4 gap-12">
|
| 189 |
+
<div>
|
| 190 |
+
<a href="index.html">
|
| 191 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction" class="h-16 mb-4">
|
| 192 |
+
</a>
|
| 193 |
+
<p class="text-gray-400">
|
| 194 |
+
Boisdaction est une ébénisterie architecturale québécoise spécialisée dans la conception et la création de projets d'ébénisterie et de boiseries en tout genre.
|
| 195 |
+
</p>
|
| 196 |
+
</div>
|
| 197 |
+
<div>
|
| 198 |
+
<h3 class="text-lg font-semibold mb-4">Nous joindre</h3>
|
| 199 |
+
<ul class="space-y-2">
|
| 200 |
+
<li><a href="tel:1-819-621-2333" class="text-gray-400 hover:text-amber-500">819 621-2333</a></li>
|
| 201 |
+
<li><a href="mailto:[email protected]" class="text-gray-400 hover:text-amber-500">[email protected]</a></li>
|
| 202 |
+
<li><a href="contact.html" class="text-gray-400 hover:text-amber-500">2165, Jules-Paquette Plessisville (Québec) G6L 2Y7</a></li>
|
| 203 |
+
</ul>
|
| 204 |
+
</div>
|
| 205 |
+
<div>
|
| 206 |
+
<h3 class="text-lg font-semibold mb-4">Services</h3>
|
| 207 |
+
<ul class="space-y-2">
|
| 208 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Clé en main</a></li>
|
| 209 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Conception ingénierie</a></li>
|
| 210 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Fabrication</a></li>
|
| 211 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Livraison et installation</a></li>
|
| 212 |
+
</ul>
|
| 213 |
+
</div>
|
| 214 |
+
<div>
|
| 215 |
+
<h3 class="text-lg font-semibold mb-4">Liens rapides</h3>
|
| 216 |
+
<ul class="space-y-2">
|
| 217 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Équipe</a></li>
|
| 218 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Reconnaissance</a></li>
|
| 219 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">À propos</a></li>
|
| 220 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Carrière</a></li>
|
| 221 |
+
<li><a href="realisations.html" class="text-gray-400 hover:text-amber-500">Réalisations</a></li>
|
| 222 |
+
</ul>
|
| 223 |
+
</div>
|
| 224 |
+
</div>
|
| 225 |
+
<div class="border-t border-gray-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 226 |
+
<p class="text-gray-400 mb-4 md:mb-0">Copyright ©2021 Boisdaction. Tous droits réservés.</p>
|
| 227 |
+
<a href="#top" class="text-gray-400 hover:text-amber-500 flex items-center">
|
| 228 |
+
Retour en haut <i data-feather="arrow-up" class="ml-2"></i>
|
| 229 |
+
</a>
|
| 230 |
+
</div>
|
| 231 |
+
</div>
|
| 232 |
+
</footer>
|
| 233 |
+
|
| 234 |
+
<script>
|
| 235 |
+
AOS.init({
|
| 236 |
+
duration: 800,
|
| 237 |
+
easing: 'ease-in-out',
|
| 238 |
+
once: true
|
| 239 |
+
});
|
| 240 |
+
feather.replace();
|
| 241 |
+
</script>
|
| 242 |
+
</body>
|
| 243 |
+
</html>
|
contact.html
ADDED
|
@@ -0,0 +1,247 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="fr">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Contactez-nous - Boisdaction</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
+
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
|
| 9 |
+
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
|
| 10 |
+
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
|
| 11 |
+
<script src="https://unpkg.com/feather-icons"></script>
|
| 12 |
+
<style>
|
| 13 |
+
.hero-section {
|
| 14 |
+
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('http://static.photos/contact/1200x630/9');
|
| 15 |
+
background-size: cover;
|
| 16 |
+
background-position: center;
|
| 17 |
+
}
|
| 18 |
+
.nav-link:hover {
|
| 19 |
+
color: #d1a054;
|
| 20 |
+
}
|
| 21 |
+
.dropdown:hover .dropdown-menu {
|
| 22 |
+
display: block;
|
| 23 |
+
}
|
| 24 |
+
</style>
|
| 25 |
+
</head>
|
| 26 |
+
<body class="font-sans antialiased text-gray-800">
|
| 27 |
+
<!-- Navigation -->
|
| 28 |
+
<nav class="bg-white shadow-lg sticky top-0 z-50">
|
| 29 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 30 |
+
<div class="flex justify-between h-24 items-center">
|
| 31 |
+
<div class="flex-shrink-0 flex items-center">
|
| 32 |
+
<a href="index.html">
|
| 33 |
+
<img class="h-16" src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction">
|
| 34 |
+
</a>
|
| 35 |
+
</div>
|
| 36 |
+
<div class="hidden md:block">
|
| 37 |
+
<div class="ml-10 flex items-center space-x-8">
|
| 38 |
+
<!-- Profile Dropdown -->
|
| 39 |
+
<div class="dropdown relative">
|
| 40 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 41 |
+
Profil <i data-feather="chevron-down" class="inline"></i>
|
| 42 |
+
</button>
|
| 43 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 44 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Équipe</a>
|
| 45 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Reconnaissance</a>
|
| 46 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">À propos</a>
|
| 47 |
+
</div>
|
| 48 |
+
</div>
|
| 49 |
+
|
| 50 |
+
<!-- Services Dropdown -->
|
| 51 |
+
<div class="dropdown relative">
|
| 52 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 53 |
+
Services <i data-feather="chevron-down" class="inline"></i>
|
| 54 |
+
</button>
|
| 55 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 56 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Clé en main</a>
|
| 57 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Conception ingénierie</a>
|
| 58 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Fabrication</a>
|
| 59 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Livraison et installation</a>
|
| 60 |
+
</div>
|
| 61 |
+
</div>
|
| 62 |
+
|
| 63 |
+
<a href="apropos.html" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Carrière</a>
|
| 64 |
+
<a href="realisations.html" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Réalisations</a>
|
| 65 |
+
<a href="contact.html" class="bg-amber-700 text-white px-6 py-2 rounded-md hover:bg-amber-800 transition duration-300">Nous joindre</a>
|
| 66 |
+
</div>
|
| 67 |
+
</div>
|
| 68 |
+
<div class="md:hidden">
|
| 69 |
+
<button class="text-gray-900">
|
| 70 |
+
<i data-feather="menu"></i>
|
| 71 |
+
</button>
|
| 72 |
+
</div>
|
| 73 |
+
</div>
|
| 74 |
+
</div>
|
| 75 |
+
</nav>
|
| 76 |
+
|
| 77 |
+
<!-- Hero Section -->
|
| 78 |
+
<section class="hero-section h-96 flex items-center justify-center text-white">
|
| 79 |
+
<div class="text-center px-4" data-aos="fade-up">
|
| 80 |
+
<h1 class="text-4xl md:text-5xl font-bold mb-4">Contactez-nous</h1>
|
| 81 |
+
<p class="text-xl max-w-2xl mx-auto">Prêt à concrétiser votre projet? Nous sommes là pour vous aider.</p>
|
| 82 |
+
</div>
|
| 83 |
+
</section>
|
| 84 |
+
|
| 85 |
+
<!-- Contact Content -->
|
| 86 |
+
<section class="py-20 bg-white" data-aos="fade-up">
|
| 87 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 88 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-16">
|
| 89 |
+
<div class="mb-12 lg:mb-0">
|
| 90 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-6">Parlons de votre projet</h2>
|
| 91 |
+
<p class="text-lg text-gray-600 mb-8">
|
| 92 |
+
Que vous ayez un projet en tête ou des questions sur nos services, notre équipe est prête à vous aider. Remplissez le formulaire et nous vous répondrons dans les plus brefs délais.
|
| 93 |
+
</p>
|
| 94 |
+
|
| 95 |
+
<div class="space-y-6">
|
| 96 |
+
<div class="flex items-start">
|
| 97 |
+
<div class="text-amber-700 mr-4 mt-1">
|
| 98 |
+
<i data-feather="map-pin" class="w-6 h-6"></i>
|
| 99 |
+
</div>
|
| 100 |
+
<div>
|
| 101 |
+
<h3 class="text-xl font-semibold mb-2">Adresse</h3>
|
| 102 |
+
<p class="text-gray-600">2165, Jules-Paquette<br>Plessisville (Québec) G6L 2Y7</p>
|
| 103 |
+
</div>
|
| 104 |
+
</div>
|
| 105 |
+
|
| 106 |
+
<div class="flex items-start">
|
| 107 |
+
<div class="text-amber-700 mr-4 mt-1">
|
| 108 |
+
<i data-feather="phone" class="w-6 h-6"></i>
|
| 109 |
+
</div>
|
| 110 |
+
<div>
|
| 111 |
+
<h3 class="text-xl font-semibold mb-2">Téléphone</h3>
|
| 112 |
+
<p class="text-gray-600">819 621-2333</p>
|
| 113 |
+
</div>
|
| 114 |
+
</div>
|
| 115 |
+
|
| 116 |
+
<div class="flex items-start">
|
| 117 |
+
<div class="text-amber-700 mr-4 mt-1">
|
| 118 |
+
<i data-feather="mail" class="w-6 h-6"></i>
|
| 119 |
+
</div>
|
| 120 |
+
<div>
|
| 121 |
+
<h3 class="text-xl font-semibold mb-2">Courriel</h3>
|
| 122 |
+
<p class="text-gray-600">[email protected]</p>
|
| 123 |
+
</div>
|
| 124 |
+
</div>
|
| 125 |
+
|
| 126 |
+
<div class="flex items-start">
|
| 127 |
+
<div class="text-amber-700 mr-4 mt-1">
|
| 128 |
+
<i data-feather="clock" class="w-6 h-6"></i>
|
| 129 |
+
</div>
|
| 130 |
+
<div>
|
| 131 |
+
<h3 class="text-xl font-semibold mb-2">Heures d'ouverture</h3>
|
| 132 |
+
<p class="text-gray-600">Lundi au vendredi: 8h00 - 17h00</p>
|
| 133 |
+
</div>
|
| 134 |
+
</div>
|
| 135 |
+
</div>
|
| 136 |
+
</div>
|
| 137 |
+
|
| 138 |
+
<div>
|
| 139 |
+
<form class="bg-gray-50 p-8 rounded-lg shadow-md">
|
| 140 |
+
<div class="mb-6">
|
| 141 |
+
<label for="name" class="block text-gray-700 text-sm font-bold mb-2">Nom complet</label>
|
| 142 |
+
<input type="text" id="name" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-amber-700">
|
| 143 |
+
</div>
|
| 144 |
+
|
| 145 |
+
<div class="mb-6">
|
| 146 |
+
<label for="email" class="block text-gray-700 text-sm font-bold mb-2">Courriel</label>
|
| 147 |
+
<input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-amber-700">
|
| 148 |
+
</div>
|
| 149 |
+
|
| 150 |
+
<div class="mb-6">
|
| 151 |
+
<label for="phone" class="block text-gray-700 text-sm font-bold mb-2">Téléphone</label>
|
| 152 |
+
<input type="tel" id="phone" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-amber-700">
|
| 153 |
+
</div>
|
| 154 |
+
|
| 155 |
+
<div class="mb-6">
|
| 156 |
+
<label for="subject" class="block text-gray-700 text-sm font-bold mb-2">Sujet</label>
|
| 157 |
+
<select id="subject" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-amber-700">
|
| 158 |
+
<option>Information sur un service</option>
|
| 159 |
+
<option>Devis pour un projet</option>
|
| 160 |
+
<option>Questions générales</option>
|
| 161 |
+
<option>Autre</option>
|
| 162 |
+
</select>
|
| 163 |
+
</div>
|
| 164 |
+
|
| 165 |
+
<div class="mb-6">
|
| 166 |
+
<label for="message" class="block text-gray-700 text-sm font-bold mb-2">Message</label>
|
| 167 |
+
<textarea id="message" rows="5" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-amber-700"></textarea>
|
| 168 |
+
</div>
|
| 169 |
+
|
| 170 |
+
<button type="submit" class="w-full bg-amber-700 text-white px-6 py-3 rounded-md hover:bg-amber-800 transition duration-300 font-semibold">
|
| 171 |
+
Envoyer le message
|
| 172 |
+
</button>
|
| 173 |
+
</form>
|
| 174 |
+
</div>
|
| 175 |
+
</div>
|
| 176 |
+
</div>
|
| 177 |
+
</section>
|
| 178 |
+
|
| 179 |
+
<!-- Map Section -->
|
| 180 |
+
<section class="py-20 bg-gray-50" data-aos="fade-up">
|
| 181 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 182 |
+
<h2 class="text-3xl font-bold text-center text-gray-900 mb-16">Nous trouver</h2>
|
| 183 |
+
<div class="bg-white rounded-lg shadow-md overflow-hidden">
|
| 184 |
+
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2720.894335895504!2d-71.803555684604!3d45.8927159792002!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4cc09c6a5fc0b6d9%3A0x5b0a0e1f0a0e1f0!2s2165%20Jules-Paquette%2C%20Plessisville%2C%20QC%20G6L%202Y7!5e0!3m2!1sen!2sca!4v1610000000000!5m2!1sen!2sca" width="100%" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
|
| 185 |
+
</div>
|
| 186 |
+
</div>
|
| 187 |
+
</section>
|
| 188 |
+
|
| 189 |
+
<!-- Footer -->
|
| 190 |
+
<footer class="bg-gray-800 text-white py-16">
|
| 191 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 192 |
+
<div class="grid grid-cols-1 md:grid-cols-4 gap-12">
|
| 193 |
+
<div>
|
| 194 |
+
<a href="index.html">
|
| 195 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction" class="h-16 mb-4">
|
| 196 |
+
</a>
|
| 197 |
+
<p class="text-gray-400">
|
| 198 |
+
Boisdaction est une ébénisterie architecturale québécoise spécialisée dans la conception et la création de projets d'ébénisterie et de boiseries en tout genre.
|
| 199 |
+
</p>
|
| 200 |
+
</div>
|
| 201 |
+
<div>
|
| 202 |
+
<h3 class="text-lg font-semibold mb-4">Nous joindre</h3>
|
| 203 |
+
<ul class="space-y-2">
|
| 204 |
+
<li><a href="tel:1-819-621-2333" class="text-gray-400 hover:text-amber-500">819 621-2333</a></li>
|
| 205 |
+
<li><a href="mailto:[email protected]" class="text-gray-400 hover:text-amber-500">[email protected]</a></li>
|
| 206 |
+
<li><a href="contact.html" class="text-gray-400 hover:text-amber-500">2165, Jules-Paquette Plessisville (Québec) G6L 2Y7</a></li>
|
| 207 |
+
</ul>
|
| 208 |
+
</div>
|
| 209 |
+
<div>
|
| 210 |
+
<h3 class="text-lg font-semibold mb-4">Services</h3>
|
| 211 |
+
<ul class="space-y-2">
|
| 212 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Clé en main</a></li>
|
| 213 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Conception ingénierie</a></li>
|
| 214 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Fabrication</a></li>
|
| 215 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Livraison et installation</a></li>
|
| 216 |
+
</ul>
|
| 217 |
+
</div>
|
| 218 |
+
<div>
|
| 219 |
+
<h3 class="text-lg font-semibold mb-4">Liens rapides</h3>
|
| 220 |
+
<ul class="space-y-2">
|
| 221 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Équipe</a></li>
|
| 222 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Reconnaissance</a></li>
|
| 223 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">À propos</a></li>
|
| 224 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Carrière</a></li>
|
| 225 |
+
<li><a href="realisations.html" class="text-gray-400 hover:text-amber-500">Réalisations</a></li>
|
| 226 |
+
</ul>
|
| 227 |
+
</div>
|
| 228 |
+
</div>
|
| 229 |
+
<div class="border-t border-gray-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 230 |
+
<p class="text-gray-400 mb-4 md:mb-0">Copyright ©2021 Boisdaction. Tous droits réservés.</p>
|
| 231 |
+
<a href="#top" class="text-gray-400 hover:text-amber-500 flex items-center">
|
| 232 |
+
Retour en haut <i data-feather="arrow-up" class="ml-2"></i>
|
| 233 |
+
</a>
|
| 234 |
+
</div>
|
| 235 |
+
</div>
|
| 236 |
+
</footer>
|
| 237 |
+
|
| 238 |
+
<script>
|
| 239 |
+
AOS.init({
|
| 240 |
+
duration: 800,
|
| 241 |
+
easing: 'ease-in-out',
|
| 242 |
+
once: true
|
| 243 |
+
});
|
| 244 |
+
feather.replace();
|
| 245 |
+
</script>
|
| 246 |
+
</body>
|
| 247 |
+
</html>
|
index.html
CHANGED
|
@@ -1,19 +1,262 @@
|
|
| 1 |
-
<!
|
| 2 |
-
<html>
|
| 3 |
-
|
| 4 |
-
|
| 5 |
-
|
| 6 |
-
|
| 7 |
-
|
| 8 |
-
|
| 9 |
-
|
| 10 |
-
|
| 11 |
-
|
| 12 |
-
|
| 13 |
-
|
| 14 |
-
|
| 15 |
-
|
| 16 |
-
|
| 17 |
-
|
| 18 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 19 |
</html>
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="fr">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Boisdaction - Ébénisterie Architecturale</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
+
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
|
| 9 |
+
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
|
| 10 |
+
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
|
| 11 |
+
<script src="https://unpkg.com/feather-icons"></script>
|
| 12 |
+
<style>
|
| 13 |
+
.hero-section {
|
| 14 |
+
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('http://static.photos/nature/1200x630/42');
|
| 15 |
+
background-size: cover;
|
| 16 |
+
background-position: center;
|
| 17 |
+
}
|
| 18 |
+
.nav-link:hover {
|
| 19 |
+
color: #d1a054;
|
| 20 |
+
}
|
| 21 |
+
.dropdown:hover .dropdown-menu {
|
| 22 |
+
display: block;
|
| 23 |
+
}
|
| 24 |
+
</style>
|
| 25 |
+
</head>
|
| 26 |
+
<body class="font-sans antialiased text-gray-800">
|
| 27 |
+
<!-- Navigation -->
|
| 28 |
+
<nav class="bg-white shadow-lg sticky top-0 z-50">
|
| 29 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 30 |
+
<div class="flex justify-between h-24 items-center">
|
| 31 |
+
<div class="flex-shrink-0 flex items-center">
|
| 32 |
+
<a href="#">
|
| 33 |
+
<img class="h-16" src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction">
|
| 34 |
+
</a>
|
| 35 |
+
</div>
|
| 36 |
+
<div class="hidden md:block">
|
| 37 |
+
<div class="ml-10 flex items-center space-x-8">
|
| 38 |
+
<!-- Profile Dropdown -->
|
| 39 |
+
<div class="dropdown relative">
|
| 40 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 41 |
+
Profil <i data-feather="chevron-down" class="inline"></i>
|
| 42 |
+
</button>
|
| 43 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 44 |
+
<a href="https://boisdaction.com/equipe/" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Équipe</a>
|
| 45 |
+
<a href="https://boisdaction.com/reconnaissance/" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Reconnaissance</a>
|
| 46 |
+
<a href="https://boisdaction.com/a-propos/" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">À propos</a>
|
| 47 |
+
</div>
|
| 48 |
+
</div>
|
| 49 |
+
|
| 50 |
+
<!-- Services Dropdown -->
|
| 51 |
+
<div class="dropdown relative">
|
| 52 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 53 |
+
Services <i data-feather="chevron-down" class="inline"></i>
|
| 54 |
+
</button>
|
| 55 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 56 |
+
<a href="https://boisdaction.com/cle-en-main/" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Clé en main</a>
|
| 57 |
+
<a href="https://boisdaction.com/conception-ingenierie/" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Conception ingénierie</a>
|
| 58 |
+
<a href="https://boisdaction.com/fabrication/" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Fabrication</a>
|
| 59 |
+
<a href="https://boisdaction.com/livraison-et-installation/" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Livraison et installation</a>
|
| 60 |
+
</div>
|
| 61 |
+
</div>
|
| 62 |
+
|
| 63 |
+
<a href="https://boisdaction.com/carriere/" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Carrière</a>
|
| 64 |
+
<a href="http://boisdaction.com/realisations/" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Réalisations</a>
|
| 65 |
+
<a href="http://boisdaction.com/nous-joindre/" class="bg-amber-700 text-white px-6 py-2 rounded-md hover:bg-amber-800 transition duration-300">Nous joindre</a>
|
| 66 |
+
</div>
|
| 67 |
+
</div>
|
| 68 |
+
<div class="md:hidden">
|
| 69 |
+
<button class="text-gray-900">
|
| 70 |
+
<i data-feather="menu"></i>
|
| 71 |
+
</button>
|
| 72 |
+
</div>
|
| 73 |
+
</div>
|
| 74 |
+
</div>
|
| 75 |
+
</nav>
|
| 76 |
+
|
| 77 |
+
<!-- Hero Section -->
|
| 78 |
+
<section class="hero-section h-screen flex items-center justify-center text-white">
|
| 79 |
+
<div class="text-center px-4" data-aos="fade-up">
|
| 80 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/servir.svg" alt="Servir l'espace et l'humain" class="mx-auto mb-8 w-3/4 md:w-1/2">
|
| 81 |
+
<div class="mt-12">
|
| 82 |
+
<a href="#about" class="inline-block animate-bounce">
|
| 83 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/Arrow.svg" alt="Scroll down" class="h-12">
|
| 84 |
+
</a>
|
| 85 |
+
</div>
|
| 86 |
+
</div>
|
| 87 |
+
</section>
|
| 88 |
+
|
| 89 |
+
<!-- About Section -->
|
| 90 |
+
<section id="about" class="py-20 bg-white" data-aos="fade-up">
|
| 91 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 92 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-16 items-center">
|
| 93 |
+
<div class="mb-12 lg:mb-0">
|
| 94 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-6">À propos de Boisdaction</h2>
|
| 95 |
+
<p class="text-lg text-gray-600 mb-8">
|
| 96 |
+
Boisdaction est une ébénisterie architecturale québécoise spécialisée dans la conception et la création de projets d'ébénisterie et de boiseries en tout genre. Nous cherchons à réaliser des projets qui ne serviront pas seulement l'espace dans lequel ils seront installés, mais aussi l'humain qui le côtoie.
|
| 97 |
+
</p>
|
| 98 |
+
<p class="text-lg text-gray-600 mb-8">
|
| 99 |
+
C'est pourquoi nous travaillons chaque jour à réaliser des projets de haute qualité qui produisent un réel impact fonctionnel et esthétique sur la vie des gens. Notre approche clé en main nous permet d'accompagner chaque client dans la réalisation de sa vision, de l'estimation à l'installation finale.
|
| 100 |
+
</p>
|
| 101 |
+
<a href="https://boisdaction.com/a-propos/" class="inline-block bg-amber-700 text-white px-6 py-3 rounded-md hover:bg-amber-800 transition duration-300">
|
| 102 |
+
En savoir plus
|
| 103 |
+
</a>
|
| 104 |
+
</div>
|
| 105 |
+
<div class="grid grid-cols-2 gap-4">
|
| 106 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/10/Residences-Caleo-Boucherville-1-1024x683.jpg" alt="Résidences Caléo Boucherville" class="rounded-lg shadow-lg">
|
| 107 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/10/Bureaux-EY-Montreal-4-1024x683.jpg" alt="Bureaux EY Montréal" class="rounded-lg shadow-lg">
|
| 108 |
+
</div>
|
| 109 |
+
</div>
|
| 110 |
+
</div>
|
| 111 |
+
</section>
|
| 112 |
+
|
| 113 |
+
<!-- Services Section -->
|
| 114 |
+
<section class="py-20 bg-gray-50" data-aos="fade-up">
|
| 115 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 116 |
+
<h2 class="text-3xl font-bold text-center text-gray-900 mb-16">Nos services</h2>
|
| 117 |
+
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
|
| 118 |
+
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition duration-300">
|
| 119 |
+
<div class="text-amber-700 mb-4">
|
| 120 |
+
<i data-feather="package" class="w-10 h-10"></i>
|
| 121 |
+
</div>
|
| 122 |
+
<h3 class="text-xl font-semibold mb-3"><a href="https://boisdaction.com/cle-en-main/" class="hover:text-amber-700">Clé en main</a></h3>
|
| 123 |
+
<p class="text-gray-600">Chaque étape de votre projet d'ébénisterie mérite notre plus grande attention. Nous vous offrons un service complet, de l'estimation de vos besoins au dernier détail d'installation.</p>
|
| 124 |
+
</div>
|
| 125 |
+
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition duration-300">
|
| 126 |
+
<div class="text-amber-700 mb-4">
|
| 127 |
+
<i data-feather="edit-3" class="w-10 h-10"></i>
|
| 128 |
+
</div>
|
| 129 |
+
<h3 class="text-xl font-semibold mb-3"><a href="https://boisdaction.com/conception-ingenierie/" class="hover:text-amber-700">Conception ingénerie</a></h3>
|
| 130 |
+
<p class="text-gray-600">Votre imagination est la seule limite. Notre département d'ingénierie dessine, conçoit et adapte vos meubles afin de réaliser votre vision dans ses moindres détails.</p>
|
| 131 |
+
</div>
|
| 132 |
+
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition duration-300">
|
| 133 |
+
<div class="text-amber-700 mb-4">
|
| 134 |
+
<i data-feather="tool" class="w-10 h-10"></i>
|
| 135 |
+
</div>
|
| 136 |
+
<h3 class="text-xl font-semibold mb-3"><a href="https://boisdaction.com/fabrication/" class="hover:text-amber-700">Fabrication</a></h3>
|
| 137 |
+
<p class="text-gray-600">Le bois est de toute évidence notre spécialité. La technologie fait partie intégrante de notre savoir-faire pour une qualité d'exécution et de finition impeccable.</p>
|
| 138 |
+
</div>
|
| 139 |
+
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition duration-300">
|
| 140 |
+
<div class="text-amber-700 mb-4">
|
| 141 |
+
<i data-feather="truck" class="w-10 h-10"></i>
|
| 142 |
+
</div>
|
| 143 |
+
<h3 class="text-xl font-semibold mb-3"><a href="https://boisdaction.com/livraison-et-installation/" class="hover:text-amber-700">Livraison et installation</a></h3>
|
| 144 |
+
<p class="text-gray-600">Votre projet est toujours entre bonnes mains. Toutes vos pièces sont livrées et installées de façon à ce que chaque détail concorde parfaitement avec votre vision.</p>
|
| 145 |
+
</div>
|
| 146 |
+
</div>
|
| 147 |
+
</div>
|
| 148 |
+
</section>
|
| 149 |
+
|
| 150 |
+
<!-- Projects Section -->
|
| 151 |
+
<section class="py-20 bg-white" data-aos="fade-up">
|
| 152 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 153 |
+
<div class="flex justify-between items-center mb-12">
|
| 154 |
+
<h2 class="text-3xl font-bold text-gray-900">
|
| 155 |
+
Nos<br>dernières<br>réalisations
|
| 156 |
+
</h2>
|
| 157 |
+
<a href="http://boisdaction.com/realisations/" class="flex items-center text-amber-700 hover:text-amber-800">
|
| 158 |
+
Voir toutes les réalisations
|
| 159 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/Arrow.svg" alt="Arrow" class="ml-2 h-6">
|
| 160 |
+
</a>
|
| 161 |
+
</div>
|
| 162 |
+
|
| 163 |
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
| 164 |
+
<div class="group relative overflow-hidden rounded-lg shadow-lg">
|
| 165 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/10/Bureaux-EY-Montreal-4-1024x683.jpg" alt="EY Montréal" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 166 |
+
<div class="absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-80"></div>
|
| 167 |
+
<div class="absolute bottom-0 left-0 p-6">
|
| 168 |
+
<h3 class="text-xl font-bold text-white"><a href="https://boisdaction.com/realisations/ey-montreal/" class="hover:underline">EY Montréal</a></h3>
|
| 169 |
+
</div>
|
| 170 |
+
</div>
|
| 171 |
+
<div class="group relative overflow-hidden rounded-lg shadow-lg">
|
| 172 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/10/Residences-Caleo-Boucherville-1-1024x683.jpg" alt="Résidences Caléo" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 173 |
+
<div class="absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-80"></div>
|
| 174 |
+
<div class="absolute bottom-0 left-0 p-6">
|
| 175 |
+
<h3 class="text-xl font-bold text-white"><a href="https://boisdaction.com/realisations/residences-caleo-boucherville/" class="hover:underline">Résidences Caléo</a></h3>
|
| 176 |
+
</div>
|
| 177 |
+
</div>
|
| 178 |
+
<div class="group relative overflow-hidden rounded-lg shadow-lg">
|
| 179 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/10/Bureaux-Gestion-de-patrimoine-Assante-1-1024x682.jpg" alt="Assante" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 180 |
+
<div class="absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-80"></div>
|
| 181 |
+
<div class="absolute bottom-0 left-0 p-6">
|
| 182 |
+
<h3 class="text-xl font-bold text-white"><a href="https://boisdaction.com/realisations/gestion-de-patrimoine-assante/" class="hover:underline">Assante</a></h3>
|
| 183 |
+
</div>
|
| 184 |
+
</div>
|
| 185 |
+
</div>
|
| 186 |
+
</div>
|
| 187 |
+
</section>
|
| 188 |
+
|
| 189 |
+
<!-- Career Section -->
|
| 190 |
+
<section class="py-20 bg-gray-900 text-white" data-aos="fade-up">
|
| 191 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 192 |
+
<div class="text-center">
|
| 193 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/10/triforce_bois.svg" alt="Triforce" class="mx-auto mb-8 h-16">
|
| 194 |
+
<h2 class="text-3xl font-bold mb-4">Carrière</h2>
|
| 195 |
+
<p class="text-xl mb-8">Viens faire partie de l'équipe!</p>
|
| 196 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/diviseur.svg" alt="Divider" class="mx-auto mb-8">
|
| 197 |
+
<a href="https://boisdaction.com/carriere/" class="inline-block bg-amber-700 text-white px-6 py-3 rounded-md hover:bg-amber-800 transition duration-300">
|
| 198 |
+
En savoir plus
|
| 199 |
+
</a>
|
| 200 |
+
</div>
|
| 201 |
+
</div>
|
| 202 |
+
</section>
|
| 203 |
+
|
| 204 |
+
<!-- Footer -->
|
| 205 |
+
<footer class="bg-gray-800 text-white py-16">
|
| 206 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 207 |
+
<div class="grid grid-cols-1 md:grid-cols-4 gap-12">
|
| 208 |
+
<div>
|
| 209 |
+
<a href="#">
|
| 210 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction" class="h-16 mb-4">
|
| 211 |
+
</a>
|
| 212 |
+
<p class="text-gray-400">
|
| 213 |
+
Boisdaction est une ébénisterie architecturale québécoise spécialisée dans la conception et la création de projets d'ébénisterie et de boiseries en tout genre.
|
| 214 |
+
</p>
|
| 215 |
+
</div>
|
| 216 |
+
<div>
|
| 217 |
+
<h3 class="text-lg font-semibold mb-4">Nous joindre</h3>
|
| 218 |
+
<ul class="space-y-2">
|
| 219 |
+
<li><a href="tel:1-819-621-2333" class="text-gray-400 hover:text-amber-500">819 621-2333</a></li>
|
| 220 |
+
<li><a href="mailto:[email protected]" class="text-gray-400 hover:text-amber-500">[email protected]</a></li>
|
| 221 |
+
<li><a href="https://boisdaction.com/nous-joindre/" class="text-gray-400 hover:text-amber-500">2165, Jules-Paquette Plessisville (Québec) G6L 2Y7</a></li>
|
| 222 |
+
</ul>
|
| 223 |
+
</div>
|
| 224 |
+
<div>
|
| 225 |
+
<h3 class="text-lg font-semibold mb-4">Services</h3>
|
| 226 |
+
<ul class="space-y-2">
|
| 227 |
+
<li><a href="https://boisdaction.com/cle-en-main/" class="text-gray-400 hover:text-amber-500">Clé en main</a></li>
|
| 228 |
+
<li><a href="https://boisdaction.com/conception-ingenierie/" class="text-gray-400 hover:text-amber-500">Conception ingénierie</a></li>
|
| 229 |
+
<li><a href="https://boisdaction.com/fabrication/" class="text-gray-400 hover:text-amber-500">Fabrication</a></li>
|
| 230 |
+
<li><a href="https://boisdaction.com/livraison-et-installation/" class="text-gray-400 hover:text-amber-500">Livraison et installation</a></li>
|
| 231 |
+
</ul>
|
| 232 |
+
</div>
|
| 233 |
+
<div>
|
| 234 |
+
<h3 class="text-lg font-semibold mb-4">Liens rapides</h3>
|
| 235 |
+
<ul class="space-y-2">
|
| 236 |
+
<li><a href="https://boisdaction.com/equipe/" class="text-gray-400 hover:text-amber-500">Équipe</a></li>
|
| 237 |
+
<li><a href="https://boisdaction.com/reconnaissance/" class="text-gray-400 hover:text-amber-500">Reconnaissance</a></li>
|
| 238 |
+
<li><a href="https://boisdaction.com/a-propos/" class="text-gray-400 hover:text-amber-500">À propos</a></li>
|
| 239 |
+
<li><a href="https://boisdaction.com/carriere/" class="text-gray-400 hover:text-amber-500">Carrière</a></li>
|
| 240 |
+
<li><a href="http://boisdaction.com/realisations/" class="text-gray-400 hover:text-amber-500">Réalisations</a></li>
|
| 241 |
+
</ul>
|
| 242 |
+
</div>
|
| 243 |
+
</div>
|
| 244 |
+
<div class="border-t border-gray-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 245 |
+
<p class="text-gray-400 mb-4 md:mb-0">Copyright ©2021 Boisdaction. Tous droits réservés.</p>
|
| 246 |
+
<a href="#top" class="text-gray-400 hover:text-amber-500 flex items-center">
|
| 247 |
+
Retour en haut <i data-feather="arrow-up" class="ml-2"></i>
|
| 248 |
+
</a>
|
| 249 |
+
</div>
|
| 250 |
+
</div>
|
| 251 |
+
</footer>
|
| 252 |
+
|
| 253 |
+
<script>
|
| 254 |
+
AOS.init({
|
| 255 |
+
duration: 800,
|
| 256 |
+
easing: 'ease-in-out',
|
| 257 |
+
once: true
|
| 258 |
+
});
|
| 259 |
+
feather.replace();
|
| 260 |
+
</script>
|
| 261 |
+
</body>
|
| 262 |
</html>
|
prompts.txt
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
avec une couleur marron bois
|
| 2 |
+
make the other pages
|
| 3 |
+
|
| 4 |
+
fait la page Réalisation
|
| 5 |
+
fait la page Réalisation
|
| 6 |
+
fait la page a propos et service et contact
|
realisations.html
ADDED
|
@@ -0,0 +1,299 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="fr">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Réalisations - Boisdaction</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
+
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
|
| 9 |
+
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
|
| 10 |
+
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
|
| 11 |
+
<script src="https://unpkg.com/feather-icons"></script>
|
| 12 |
+
<style>
|
| 13 |
+
.hero-section {
|
| 14 |
+
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('http://static.photos/architecture/1200x630/42');
|
| 15 |
+
background-size: cover;
|
| 16 |
+
background-position: center;
|
| 17 |
+
}
|
| 18 |
+
.nav-link:hover {
|
| 19 |
+
color: #d1a054;
|
| 20 |
+
}
|
| 21 |
+
.dropdown:hover .dropdown-menu {
|
| 22 |
+
display: block;
|
| 23 |
+
}
|
| 24 |
+
.project-card:hover .project-overlay {
|
| 25 |
+
opacity: 1;
|
| 26 |
+
}
|
| 27 |
+
</style>
|
| 28 |
+
</head>
|
| 29 |
+
<body class="font-sans antialiased text-gray-800">
|
| 30 |
+
<!-- Navigation -->
|
| 31 |
+
<nav class="bg-white shadow-lg sticky top-0 z-50">
|
| 32 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 33 |
+
<div class="flex justify-between h-24 items-center">
|
| 34 |
+
<div class="flex-shrink-0 flex items-center">
|
| 35 |
+
<a href="index.html">
|
| 36 |
+
<img class="h-16" src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction">
|
| 37 |
+
</a>
|
| 38 |
+
</div>
|
| 39 |
+
<div class="hidden md:block">
|
| 40 |
+
<div class="ml-10 flex items-center space-x-8">
|
| 41 |
+
<!-- Profile Dropdown -->
|
| 42 |
+
<div class="dropdown relative">
|
| 43 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 44 |
+
Profil <i data-feather="chevron-down" class="inline"></i>
|
| 45 |
+
</button>
|
| 46 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 47 |
+
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Équipe</a>
|
| 48 |
+
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Reconnaissance</a>
|
| 49 |
+
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">À propos</a>
|
| 50 |
+
</div>
|
| 51 |
+
</div>
|
| 52 |
+
|
| 53 |
+
<!-- Services Dropdown -->
|
| 54 |
+
<div class="dropdown relative">
|
| 55 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 56 |
+
Services <i data-feather="chevron-down" class="inline"></i>
|
| 57 |
+
</button>
|
| 58 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 59 |
+
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Clé en main</a>
|
| 60 |
+
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Conception ingénierie</a>
|
| 61 |
+
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Fabrication</a>
|
| 62 |
+
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Livraison et installation</a>
|
| 63 |
+
</div>
|
| 64 |
+
</div>
|
| 65 |
+
|
| 66 |
+
<a href="#" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Carrière</a>
|
| 67 |
+
<a href="realisations.html" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Réalisations</a>
|
| 68 |
+
<a href="#" class="bg-amber-700 text-white px-6 py-2 rounded-md hover:bg-amber-800 transition duration-300">Nous joindre</a>
|
| 69 |
+
</div>
|
| 70 |
+
</div>
|
| 71 |
+
<div class="md:hidden">
|
| 72 |
+
<button class="text-gray-900">
|
| 73 |
+
<i data-feather="menu"></i>
|
| 74 |
+
</button>
|
| 75 |
+
</div>
|
| 76 |
+
</div>
|
| 77 |
+
</div>
|
| 78 |
+
</nav>
|
| 79 |
+
|
| 80 |
+
<!-- Hero Section -->
|
| 81 |
+
<section class="hero-section h-96 flex items-center justify-center text-white">
|
| 82 |
+
<div class="text-center px-4" data-aos="fade-up">
|
| 83 |
+
<h1 class="text-4xl md:text-5xl font-bold mb-4">Nos Réalisations</h1>
|
| 84 |
+
<p class="text-xl max-w-2xl mx-auto">Découvrez nos projets d'ébénisterie architecturale exceptionnels</p>
|
| 85 |
+
</div>
|
| 86 |
+
</section>
|
| 87 |
+
|
| 88 |
+
<!-- Projects Section -->
|
| 89 |
+
<section class="py-20 bg-white" data-aos="fade-up">
|
| 90 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 91 |
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
| 92 |
+
<!-- Project 1 -->
|
| 93 |
+
<div class="project-card group relative overflow-hidden rounded-lg shadow-lg">
|
| 94 |
+
<img src="http://static.photos/office/640x360/1" alt="Projet Bureau" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 95 |
+
<div class="project-overlay absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 transition duration-300 flex items-end p-6">
|
| 96 |
+
<div>
|
| 97 |
+
<h3 class="text-xl font-bold text-white">Bureaux EY Montréal</h3>
|
| 98 |
+
<p class="text-gray-200">Ébénisterie commerciale</p>
|
| 99 |
+
</div>
|
| 100 |
+
</div>
|
| 101 |
+
</div>
|
| 102 |
+
|
| 103 |
+
<!-- Project 2 -->
|
| 104 |
+
<div class="project-card group relative overflow-hidden rounded-lg shadow-lg">
|
| 105 |
+
<img src="http://static.photos/home/640x360/2" alt="Projet Résidence" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 106 |
+
<div class="project-overlay absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 transition duration-300 flex items-end p-6">
|
| 107 |
+
<div>
|
| 108 |
+
<h3 class="text-xl font-bold text-white">Résidences Caléo</h3>
|
| 109 |
+
<p class="text-gray-200">Ébénisterie résidentielle</p>
|
| 110 |
+
</div>
|
| 111 |
+
</div>
|
| 112 |
+
</div>
|
| 113 |
+
|
| 114 |
+
<!-- Project 3 -->
|
| 115 |
+
<div class="project-card group relative overflow-hidden rounded-lg shadow-lg">
|
| 116 |
+
<img src="http://static.photos/workspace/640x360/3" alt="Projet Assante" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 117 |
+
<div class="project-overlay absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 transition duration-300 flex items-end p-6">
|
| 118 |
+
<div>
|
| 119 |
+
<h3 class="text-xl font-bold text-white">Gestion de patrimoine Assante</h3>
|
| 120 |
+
<p class="text-gray-200">Ébénisterie commerciale</p>
|
| 121 |
+
</div>
|
| 122 |
+
</div>
|
| 123 |
+
</div>
|
| 124 |
+
|
| 125 |
+
<!-- Project 4 -->
|
| 126 |
+
<div class="project-card group relative overflow-hidden rounded-lg shadow-lg">
|
| 127 |
+
<img src="http://static.photos/interior/640x360/4" alt="Projet Hôtel" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 128 |
+
<div class="project-overlay absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 transition duration-300 flex items-end p-6">
|
| 129 |
+
<div>
|
| 130 |
+
<h3 class="text-xl font-bold text-white">Hôtel & Spa Mont-Tremblant</h3>
|
| 131 |
+
<p class="text-gray-200">Ébénisterie hôtelière</p>
|
| 132 |
+
</div>
|
| 133 |
+
</div>
|
| 134 |
+
</div>
|
| 135 |
+
|
| 136 |
+
<!-- Project 5 -->
|
| 137 |
+
<div class="project-card group relative overflow-hidden rounded-lg shadow-lg">
|
| 138 |
+
<img src="http://static.photos/modern/640x360/5" alt="Projet Restaurant" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 139 |
+
<div class="project-overlay absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 transition duration-300 flex items-end p-6">
|
| 140 |
+
<div>
|
| 141 |
+
<h3 class="text-xl font-bold text-white">Restaurant Le Bernardin</h3>
|
| 142 |
+
<p class="text-gray-200">Ébénisterie restaurateur</p>
|
| 143 |
+
</div>
|
| 144 |
+
</div>
|
| 145 |
+
</div>
|
| 146 |
+
|
| 147 |
+
<!-- Project 6 -->
|
| 148 |
+
<div class="project-card group relative overflow-hidden rounded-lg shadow-lg">
|
| 149 |
+
<img src="http://static.photos/building/640x360/6" alt="Projet Centre Commercial" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
|
| 150 |
+
<div class="project-overlay absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 transition duration-300 flex items-end p-6">
|
| 151 |
+
<div>
|
| 152 |
+
<h3 class="text-xl font-bold text-white">Centre Commercial Westfield</h3>
|
| 153 |
+
<p class="text-gray-200">Ébénisterie commerciale</p>
|
| 154 |
+
</div>
|
| 155 |
+
</div>
|
| 156 |
+
</div>
|
| 157 |
+
</div>
|
| 158 |
+
|
| 159 |
+
<!-- Load More Button -->
|
| 160 |
+
<div class="text-center mt-12">
|
| 161 |
+
<button class="bg-amber-700 text-white px-8 py-3 rounded-md hover:bg-amber-800 transition duration-300">
|
| 162 |
+
Charger plus de projets
|
| 163 |
+
</button>
|
| 164 |
+
</div>
|
| 165 |
+
</div>
|
| 166 |
+
</section>
|
| 167 |
+
|
| 168 |
+
<!-- Testimonials Section -->
|
| 169 |
+
<section class="py-20 bg-gray-50" data-aos="fade-up">
|
| 170 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 171 |
+
<h2 class="text-3xl font-bold text-center text-gray-900 mb-16">Témoignages Clients</h2>
|
| 172 |
+
<div class="grid md:grid-cols-3 gap-8">
|
| 173 |
+
<div class="bg-white p-6 rounded-lg shadow-md">
|
| 174 |
+
<div class="text-amber-700 mb-4">
|
| 175 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 176 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 177 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 178 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 179 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 180 |
+
</div>
|
| 181 |
+
<p class="text-gray-600 italic mb-6">"La qualité de travail de Boisdaction dépasse toujours nos attentes. Leur attention aux détails et leur professionnalisme sont exemplaires."</p>
|
| 182 |
+
<div class="flex items-center">
|
| 183 |
+
<div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" />
|
| 184 |
+
<div class="ml-4">
|
| 185 |
+
<h4 class="font-semibold">Jean Tremblay</h4>
|
| 186 |
+
<p class="text-gray-500">Directeur EY Montréal</p>
|
| 187 |
+
</div>
|
| 188 |
+
</div>
|
| 189 |
+
</div>
|
| 190 |
+
|
| 191 |
+
<div class="bg-white p-6 rounded-lg shadow-md">
|
| 192 |
+
<div class="text-amber-700 mb-4">
|
| 193 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 194 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 195 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 196 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 197 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 198 |
+
</div>
|
| 199 |
+
<p class="text-gray-600 italic mb-6">"Notre résidence n'aurait pas été la même sans l'intervention de Boisdaction. Chaque pièce est une œuvre d'art fonctionnelle."</p>
|
| 200 |
+
<div class="flex items-center">
|
| 201 |
+
<div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" />
|
| 202 |
+
<div class="ml-4">
|
| 203 |
+
<h4 class="font-semibold">Marie Dubois</h4>
|
| 204 |
+
<p class="text-gray-500">Propriétaire Résidences Caléo</p>
|
| 205 |
+
</div>
|
| 206 |
+
</div>
|
| 207 |
+
</div>
|
| 208 |
+
|
| 209 |
+
<div class="bg-white p-6 rounded-lg shadow-md">
|
| 210 |
+
<div class="text-amber-700 mb-4">
|
| 211 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 212 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 213 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 214 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 215 |
+
<i data-feather="star" class="w-6 h-6 fill-current"></i>
|
| 216 |
+
</div>
|
| 217 |
+
<p class="text-gray-600 italic mb-6">"Leur approche clé en main nous a permis de gagner un temps considérable tout en assurant une qualité exceptionnelle."</p>
|
| 218 |
+
<div class="flex items-center">
|
| 219 |
+
<div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" />
|
| 220 |
+
<div class="ml-4">
|
| 221 |
+
<h4 class="font-semibold">Pierre Gagnon</h4>
|
| 222 |
+
<p class="text-gray-500">PDG Assante</p>
|
| 223 |
+
</div>
|
| 224 |
+
</div>
|
| 225 |
+
</div>
|
| 226 |
+
</div>
|
| 227 |
+
</div>
|
| 228 |
+
</section>
|
| 229 |
+
|
| 230 |
+
<!-- Contact CTA -->
|
| 231 |
+
<section class="py-20 bg-amber-700 text-white" data-aos="fade-up">
|
| 232 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
| 233 |
+
<h2 class="text-3xl font-bold mb-6">Prêt à démarrer votre projet?</h2>
|
| 234 |
+
<p class="text-xl mb-8 max-w-2xl mx-auto">Contactez-nous pour discuter de votre vision et découvrir comment nous pouvons la concrétiser.</p>
|
| 235 |
+
<a href="#" class="inline-block bg-white text-amber-700 px-8 py-3 rounded-md hover:bg-gray-100 transition duration-300 font-semibold">
|
| 236 |
+
Nous contacter
|
| 237 |
+
</a>
|
| 238 |
+
</div>
|
| 239 |
+
</section>
|
| 240 |
+
|
| 241 |
+
<!-- Footer -->
|
| 242 |
+
<footer class="bg-gray-800 text-white py-16">
|
| 243 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 244 |
+
<div class="grid grid-cols-1 md:grid-cols-4 gap-12">
|
| 245 |
+
<div>
|
| 246 |
+
<a href="index.html">
|
| 247 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction" class="h-16 mb-4">
|
| 248 |
+
</a>
|
| 249 |
+
<p class="text-gray-400">
|
| 250 |
+
Boisdaction est une ébénisterie architecturale québécoise spécialisée dans la conception et la création de projets d'ébénisterie et de boiseries en tout genre.
|
| 251 |
+
</p>
|
| 252 |
+
</div>
|
| 253 |
+
<div>
|
| 254 |
+
<h3 class="text-lg font-semibold mb-4">Nous joindre</h3>
|
| 255 |
+
<ul class="space-y-2">
|
| 256 |
+
<li><a href="tel:1-819-621-2333" class="text-gray-400 hover:text-amber-500">819 621-2333</a></li>
|
| 257 |
+
<li><a href="mailto:[email protected]" class="text-gray-400 hover:text-amber-500">[email protected]</a></li>
|
| 258 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">2165, Jules-Paquette Plessisville (Québec) G6L 2Y7</a></li>
|
| 259 |
+
</ul>
|
| 260 |
+
</div>
|
| 261 |
+
<div>
|
| 262 |
+
<h3 class="text-lg font-semibold mb-4">Services</h3>
|
| 263 |
+
<ul class="space-y-2">
|
| 264 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">Clé en main</a></li>
|
| 265 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">Conception ingénierie</a></li>
|
| 266 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">Fabrication</a></li>
|
| 267 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">Livraison et installation</a></li>
|
| 268 |
+
</ul>
|
| 269 |
+
</div>
|
| 270 |
+
<div>
|
| 271 |
+
<h3 class="text-lg font-semibold mb-4">Liens rapides</h3>
|
| 272 |
+
<ul class="space-y-2">
|
| 273 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">Équipe</a></li>
|
| 274 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">Reconnaissance</a></li>
|
| 275 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">À propos</a></li>
|
| 276 |
+
<li><a href="#" class="text-gray-400 hover:text-amber-500">Carrière</a></li>
|
| 277 |
+
<li><a href="realisations.html" class="text-gray-400 hover:text-amber-500">Réalisations</a></li>
|
| 278 |
+
</ul>
|
| 279 |
+
</div>
|
| 280 |
+
</div>
|
| 281 |
+
<div class="border-t border-gray-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 282 |
+
<p class="text-gray-400 mb-4 md:mb-0">Copyright ©2021 Boisdaction. Tous droits réservés.</p>
|
| 283 |
+
<a href="#top" class="text-gray-400 hover:text-amber-500 flex items-center">
|
| 284 |
+
Retour en haut <i data-feather="arrow-up" class="ml-2"></i>
|
| 285 |
+
</a>
|
| 286 |
+
</div>
|
| 287 |
+
</div>
|
| 288 |
+
</footer>
|
| 289 |
+
|
| 290 |
+
<script>
|
| 291 |
+
AOS.init({
|
| 292 |
+
duration: 800,
|
| 293 |
+
easing: 'ease-in-out',
|
| 294 |
+
once: true
|
| 295 |
+
});
|
| 296 |
+
feather.replace();
|
| 297 |
+
</script>
|
| 298 |
+
</body>
|
| 299 |
+
</html>
|
services.html
ADDED
|
@@ -0,0 +1,347 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="fr">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Nos Services - Boisdaction</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
+
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
|
| 9 |
+
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
|
| 10 |
+
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
|
| 11 |
+
<script src="https://unpkg.com/feather-icons"></script>
|
| 12 |
+
<style>
|
| 13 |
+
.hero-section {
|
| 14 |
+
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('http://static.photos/craft/1200x630/4');
|
| 15 |
+
background-size: cover;
|
| 16 |
+
background-position: center;
|
| 17 |
+
}
|
| 18 |
+
.nav-link:hover {
|
| 19 |
+
color: #d1a054;
|
| 20 |
+
}
|
| 21 |
+
.dropdown:hover .dropdown-menu {
|
| 22 |
+
display: block;
|
| 23 |
+
}
|
| 24 |
+
</style>
|
| 25 |
+
</head>
|
| 26 |
+
<body class="font-sans antialiased text-gray-800">
|
| 27 |
+
<!-- Navigation -->
|
| 28 |
+
<nav class="bg-white shadow-lg sticky top-0 z-50">
|
| 29 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 30 |
+
<div class="flex justify-between h-24 items-center">
|
| 31 |
+
<div class="flex-shrink-0 flex items-center">
|
| 32 |
+
<a href="index.html">
|
| 33 |
+
<img class="h-16" src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction">
|
| 34 |
+
</a>
|
| 35 |
+
</div>
|
| 36 |
+
<div class="hidden md:block">
|
| 37 |
+
<div class="ml-10 flex items-center space-x-8">
|
| 38 |
+
<!-- Profile Dropdown -->
|
| 39 |
+
<div class="dropdown relative">
|
| 40 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 41 |
+
Profil <i data-feather="chevron-down" class="inline"></i>
|
| 42 |
+
</button>
|
| 43 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 44 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Équipe</a>
|
| 45 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Reconnaissance</a>
|
| 46 |
+
<a href="apropos.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">À propos</a>
|
| 47 |
+
</div>
|
| 48 |
+
</div>
|
| 49 |
+
|
| 50 |
+
<!-- Services Dropdown -->
|
| 51 |
+
<div class="dropdown relative">
|
| 52 |
+
<button class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">
|
| 53 |
+
Services <i data-feather="chevron-down" class="inline"></i>
|
| 54 |
+
</button>
|
| 55 |
+
<div class="dropdown-menu absolute hidden mt-2 w-48 bg-white rounded-md shadow-lg z-10">
|
| 56 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Clé en main</a>
|
| 57 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Conception ingénierie</a>
|
| 58 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Fabrication</a>
|
| 59 |
+
<a href="services.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Livraison et installation</a>
|
| 60 |
+
</div>
|
| 61 |
+
</div>
|
| 62 |
+
|
| 63 |
+
<a href="apropos.html" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Carrière</a>
|
| 64 |
+
<a href="realisations.html" class="nav-link text-gray-900 hover:text-amber-700 px-3 py-2 text-sm font-medium">Réalisations</a>
|
| 65 |
+
<a href="contact.html" class="bg-amber-700 text-white px-6 py-2 rounded-md hover:bg-amber-800 transition duration-300">Nous joindre</a>
|
| 66 |
+
</div>
|
| 67 |
+
</div>
|
| 68 |
+
<div class="md:hidden">
|
| 69 |
+
<button class="text-gray-900">
|
| 70 |
+
<i data-feather="menu"></i>
|
| 71 |
+
</button>
|
| 72 |
+
</div>
|
| 73 |
+
</div>
|
| 74 |
+
</div>
|
| 75 |
+
</nav>
|
| 76 |
+
|
| 77 |
+
<!-- Hero Section -->
|
| 78 |
+
<section class="hero-section h-96 flex items-center justify-center text-white">
|
| 79 |
+
<div class="text-center px-4" data-aos="fade-up">
|
| 80 |
+
<h1 class="text-4xl md:text-5xl font-bold mb-4">Nos Services</h1>
|
| 81 |
+
<p class="text-xl max-w-2xl mx-auto">Une approche complète pour transformer vos espaces</p>
|
| 82 |
+
</div>
|
| 83 |
+
</section>
|
| 84 |
+
|
| 85 |
+
<!-- Services Content -->
|
| 86 |
+
<section class="py-20 bg-white" data-aos="fade-up">
|
| 87 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 88 |
+
<div class="text-center mb-16">
|
| 89 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-6">Notre Expertise</h2>
|
| 90 |
+
<p class="text-lg text-gray-600 max-w-3xl mx-auto">
|
| 91 |
+
Nous offrons une gamme complète de services d'ébénisterie architecturale pour répondre à tous vos besoins, de la conception à l'installation.
|
| 92 |
+
</p>
|
| 93 |
+
</div>
|
| 94 |
+
|
| 95 |
+
<!-- Service 1 -->
|
| 96 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-16 items-center mb-16">
|
| 97 |
+
<div class="mb-12 lg:mb-0">
|
| 98 |
+
<div class="flex items-center mb-4">
|
| 99 |
+
<div class="text-amber-700 mr-4">
|
| 100 |
+
<i data-feather="package" class="w-10 h-10"></i>
|
| 101 |
+
</div>
|
| 102 |
+
<h3 class="text-3xl font-bold text-gray-900">Service Clé en Main</h3>
|
| 103 |
+
</div>
|
| 104 |
+
<p class="text-lg text-gray-600 mb-6">
|
| 105 |
+
Notre service clé en main vous accompagne de A à Z dans la réalisation de vos projets d'ébénisterie. De l'estimation initiale à l'installation finale, nous prenons en charge tous les aspects de votre projet pour vous garantir un résultat parfait.
|
| 106 |
+
</p>
|
| 107 |
+
<ul class="text-lg text-gray-600 mb-6 space-y-2">
|
| 108 |
+
<li class="flex items-start">
|
| 109 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 110 |
+
<span>Évaluation et planification complète</span>
|
| 111 |
+
</li>
|
| 112 |
+
<li class="flex items-start">
|
| 113 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 114 |
+
<span>Gestion de projet dédiée</span>
|
| 115 |
+
</li>
|
| 116 |
+
<li class="flex items-start">
|
| 117 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 118 |
+
<span>Coordination de tous les artisans</span>
|
| 119 |
+
</li>
|
| 120 |
+
<li class="flex items-start">
|
| 121 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 122 |
+
<span>Suivi qualité rigoureux</span>
|
| 123 |
+
</li>
|
| 124 |
+
</ul>
|
| 125 |
+
</div>
|
| 126 |
+
<div>
|
| 127 |
+
<img src="http://static.photos/construction/640x360/5" alt="Service Clé en Main" class="rounded-lg shadow-lg">
|
| 128 |
+
</div>
|
| 129 |
+
</div>
|
| 130 |
+
|
| 131 |
+
<!-- Service 2 -->
|
| 132 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-16 items-center mb-16">
|
| 133 |
+
<div class="order-2 lg:order-1">
|
| 134 |
+
<img src="http://static.photos/design/640x360/6" alt="Conception Ingénierie" class="rounded-lg shadow-lg">
|
| 135 |
+
</div>
|
| 136 |
+
<div class="mb-12 lg:mb-0 order-1 lg:order-2">
|
| 137 |
+
<div class="flex items-center mb-4">
|
| 138 |
+
<div class="text-amber-700 mr-4">
|
| 139 |
+
<i data-feather="edit-3" class="w-10 h-10"></i>
|
| 140 |
+
</div>
|
| 141 |
+
<h3 class="text-3xl font-bold text-gray-900">Conception Ingénierie</h3>
|
| 142 |
+
</div>
|
| 143 |
+
<p class="text-lg text-gray-600 mb-6">
|
| 144 |
+
Notre département d'ingénierie et de conception transforme vos idées en designs fonctionnels et esthétiques. Nous utilisons les dernières technologies pour créer des solutions sur mesure qui répondent parfaitement à vos besoins.
|
| 145 |
+
</p>
|
| 146 |
+
<ul class="text-lg text-gray-600 mb-6 space-y-2">
|
| 147 |
+
<li class="flex items-start">
|
| 148 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 149 |
+
<span>Conception 3D et visualisation</span>
|
| 150 |
+
</li>
|
| 151 |
+
<li class="flex items-start">
|
| 152 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 153 |
+
<span>Calculs structurels et ingénierie</span>
|
| 154 |
+
</li>
|
| 155 |
+
<li class="flex items-start">
|
| 156 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 157 |
+
<span>Optimisation de l'espace</span>
|
| 158 |
+
</li>
|
| 159 |
+
<li class="flex items-start">
|
| 160 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 161 |
+
<span>Intégration de technologies innovantes</span>
|
| 162 |
+
</li>
|
| 163 |
+
</ul>
|
| 164 |
+
</div>
|
| 165 |
+
</div>
|
| 166 |
+
|
| 167 |
+
<!-- Service 3 -->
|
| 168 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-16 items-center mb-16">
|
| 169 |
+
<div class="mb-12 lg:mb-0">
|
| 170 |
+
<div class="flex items-center mb-4">
|
| 171 |
+
<div class="text-amber-700 mr-4">
|
| 172 |
+
<i data-feather="tool" class="w-10 h-10"></i>
|
| 173 |
+
</div>
|
| 174 |
+
<h3 class="text-3xl font-bold text-gray-900">Fabrication</h3>
|
| 175 |
+
</div>
|
| 176 |
+
<p class="text-lg text-gray-600 mb-6">
|
| 177 |
+
Dans notre atelier de 5000 pieds carrés, nos artisans qualifiés utilisent des techniques traditionnelles et modernes pour créer des pièces d'ébénisterie exceptionnelles. Chaque projet est fabriqué avec précision et attention aux détails.
|
| 178 |
+
</p>
|
| 179 |
+
<ul class="text-lg text-gray-600 mb-6 space-y-2">
|
| 180 |
+
<li class="flex items-start">
|
| 181 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 182 |
+
<span>Sélection de bois premium</span>
|
| 183 |
+
</li>
|
| 184 |
+
<li class="flex items-start">
|
| 185 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 186 |
+
<span>Finition artisanale</span>
|
| 187 |
+
</li>
|
| 188 |
+
<li class="flex items-start">
|
| 189 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 190 |
+
<span>Techniques traditionnelles et modernes</span>
|
| 191 |
+
</li>
|
| 192 |
+
<li class="flex items-start">
|
| 193 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 194 |
+
<span>Contrôle qualité rigoureux</span>
|
| 195 |
+
</li>
|
| 196 |
+
</ul>
|
| 197 |
+
</div>
|
| 198 |
+
<div>
|
| 199 |
+
<img src="http://static.photos/workshop/640x360/7" alt="Fabrication" class="rounded-lg shadow-lg">
|
| 200 |
+
</div>
|
| 201 |
+
</div>
|
| 202 |
+
|
| 203 |
+
<!-- Service 4 -->
|
| 204 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-16 items-center">
|
| 205 |
+
<div class="order-2 lg:order-1">
|
| 206 |
+
<img src="http://static.photos/delivery/640x360/8" alt="Livraison et Installation" class="rounded-lg shadow-lg">
|
| 207 |
+
</div>
|
| 208 |
+
<div class="mb-12 lg:mb-0 order-1 lg:order-2">
|
| 209 |
+
<div class="flex items-center mb-4">
|
| 210 |
+
<div class="text-amber-700 mr-4">
|
| 211 |
+
<i data-feather="truck" class="w-10 h-10"></i>
|
| 212 |
+
</div>
|
| 213 |
+
<h3 class="text-3xl font-bold text-gray-900">Livraison et Installation</h3>
|
| 214 |
+
</div>
|
| 215 |
+
<p class="text-lg text-gray-600 mb-6">
|
| 216 |
+
Notre service de livraison et d'installation assure que chaque pièce arrive en parfait état et est installée avec précision. Nos équipes expérimentées prennent soin de vos projets pendant tout le processus.
|
| 217 |
+
</p>
|
| 218 |
+
<ul class="text-lg text-gray-600 mb-6 space-y-2">
|
| 219 |
+
<li class="flex items-start">
|
| 220 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 221 |
+
<span>Transport sécurisé</span>
|
| 222 |
+
</li>
|
| 223 |
+
<li class="flex items-start">
|
| 224 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 225 |
+
<span>Installation par experts</span>
|
| 226 |
+
</li>
|
| 227 |
+
<li class="flex items-start">
|
| 228 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 229 |
+
<span>Respect des délais</span>
|
| 230 |
+
</li>
|
| 231 |
+
<li class="flex items-start">
|
| 232 |
+
<i data-feather="check-circle" class="text-amber-700 mr-2 mt-1 flex-shrink-0"></i>
|
| 233 |
+
<span>Nettoyage post-installation</span>
|
| 234 |
+
</li>
|
| 235 |
+
</ul>
|
| 236 |
+
</div>
|
| 237 |
+
</div>
|
| 238 |
+
</div>
|
| 239 |
+
</section>
|
| 240 |
+
|
| 241 |
+
<!-- Process Section -->
|
| 242 |
+
<section class="py-20 bg-gray-50" data-aos="fade-up">
|
| 243 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 244 |
+
<h2 class="text-3xl font-bold text-center text-gray-900 mb-16">Notre Processus</h2>
|
| 245 |
+
<div class="grid md:grid-cols-4 gap-8">
|
| 246 |
+
<div class="text-center">
|
| 247 |
+
<div class="bg-amber-700 text-white w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
|
| 248 |
+
<span class="text-2xl font-bold">1</span>
|
| 249 |
+
</div>
|
| 250 |
+
<h3 class="text-xl font-semibold mb-3">Consultation</h3>
|
| 251 |
+
<p class="text-gray-600">Évaluation de vos besoins et de vos objectifs</p>
|
| 252 |
+
</div>
|
| 253 |
+
<div class="text-center">
|
| 254 |
+
<div class="bg-amber-700 text-white w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
|
| 255 |
+
<span class="text-2xl font-bold">2</span>
|
| 256 |
+
</div>
|
| 257 |
+
<h3 class="text-xl font-semibold mb-3">Conception</h3>
|
| 258 |
+
<p class="text-gray-600">Création de designs sur mesure pour votre projet</p>
|
| 259 |
+
</div>
|
| 260 |
+
<div class="text-center">
|
| 261 |
+
<div class="bg-amber-700 text-white w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
|
| 262 |
+
<span class="text-2xl font-bold">3</span>
|
| 263 |
+
</div>
|
| 264 |
+
<h3 class="text-xl font-semibold mb-3">Fabrication</h3>
|
| 265 |
+
<p class="text-gray-600">Production artisanale de vos pièces</p>
|
| 266 |
+
</div>
|
| 267 |
+
<div class="text-center">
|
| 268 |
+
<div class="bg-amber-700 text-white w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
|
| 269 |
+
<span class="text-2xl font-bold">4</span>
|
| 270 |
+
</div>
|
| 271 |
+
<h3 class="text-xl font-semibold mb-3">Installation</h3>
|
| 272 |
+
<p class="text-gray-600">Livraison et installation professionnel</p>
|
| 273 |
+
</div>
|
| 274 |
+
</div>
|
| 275 |
+
</div>
|
| 276 |
+
</section>
|
| 277 |
+
|
| 278 |
+
<!-- Contact CTA -->
|
| 279 |
+
<section class="py-20 bg-white" data-aos="fade-up">
|
| 280 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
| 281 |
+
<h2 class="text-3xl font-bold mb-6">Prêt à démarrer votre projet?</h2>
|
| 282 |
+
<p class="text-xl mb-8 max-w-2xl mx-auto">Contactez-nous pour discuter de votre vision et découvrir comment nous pouvons la concrétiser.</p>
|
| 283 |
+
<a href="contact.html" class="inline-block bg-amber-700 text-white px-8 py-3 rounded-md hover:bg-amber-800 transition duration-300 font-semibold">
|
| 284 |
+
Nous contacter
|
| 285 |
+
</a>
|
| 286 |
+
</div>
|
| 287 |
+
</section>
|
| 288 |
+
|
| 289 |
+
<!-- Footer -->
|
| 290 |
+
<footer class="bg-gray-800 text-white py-16">
|
| 291 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 292 |
+
<div class="grid grid-cols-1 md:grid-cols-4 gap-12">
|
| 293 |
+
<div>
|
| 294 |
+
<a href="index.html">
|
| 295 |
+
<img src="https://boisdaction.com/wp-content/uploads/2020/09/logo_boisdaction.svg" alt="Boisdaction" class="h-16 mb-4">
|
| 296 |
+
</a>
|
| 297 |
+
<p class="text-gray-400">
|
| 298 |
+
Boisdaction est une ébénisterie architecturale québécoise spécialisée dans la conception et la création de projets d'ébénisterie et de boiseries en tout genre.
|
| 299 |
+
</p>
|
| 300 |
+
</div>
|
| 301 |
+
<div>
|
| 302 |
+
<h3 class="text-lg font-semibold mb-4">Nous joindre</h3>
|
| 303 |
+
<ul class="space-y-2">
|
| 304 |
+
<li><a href="tel:1-819-621-2333" class="text-gray-400 hover:text-amber-500">819 621-2333</a></li>
|
| 305 |
+
<li><a href="mailto:[email protected]" class="text-gray-400 hover:text-amber-500">[email protected]</a></li>
|
| 306 |
+
<li><a href="contact.html" class="text-gray-400 hover:text-amber-500">2165, Jules-Paquette Plessisville (Québec) G6L 2Y7</a></li>
|
| 307 |
+
</ul>
|
| 308 |
+
</div>
|
| 309 |
+
<div>
|
| 310 |
+
<h3 class="text-lg font-semibold mb-4">Services</h3>
|
| 311 |
+
<ul class="space-y-2">
|
| 312 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Clé en main</a></li>
|
| 313 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Conception ingénierie</a></li>
|
| 314 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Fabrication</a></li>
|
| 315 |
+
<li><a href="services.html" class="text-gray-400 hover:text-amber-500">Livraison et installation</a></li>
|
| 316 |
+
</ul>
|
| 317 |
+
</div>
|
| 318 |
+
<div>
|
| 319 |
+
<h3 class="text-lg font-semibold mb-4">Liens rapides</h3>
|
| 320 |
+
<ul class="space-y-2">
|
| 321 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Équipe</a></li>
|
| 322 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Reconnaissance</a></li>
|
| 323 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">À propos</a></li>
|
| 324 |
+
<li><a href="apropos.html" class="text-gray-400 hover:text-amber-500">Carrière</a></li>
|
| 325 |
+
<li><a href="realisations.html" class="text-gray-400 hover:text-amber-500">Réalisations</a></li>
|
| 326 |
+
</ul>
|
| 327 |
+
</div>
|
| 328 |
+
</div>
|
| 329 |
+
<div class="border-t border-gray-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 330 |
+
<p class="text-gray-400 mb-4 md:mb-0">Copyright ©2021 Boisdaction. Tous droits réservés.</p>
|
| 331 |
+
<a href="#top" class="text-gray-400 hover:text-amber-500 flex items-center">
|
| 332 |
+
Retour en haut <i data-feather="arrow-up" class="ml-2"></i>
|
| 333 |
+
</a>
|
| 334 |
+
</div>
|
| 335 |
+
</div>
|
| 336 |
+
</footer>
|
| 337 |
+
|
| 338 |
+
<script>
|
| 339 |
+
AOS.init({
|
| 340 |
+
duration: 800,
|
| 341 |
+
easing: 'ease-in-out',
|
| 342 |
+
once: true
|
| 343 |
+
});
|
| 344 |
+
feather.replace();
|
| 345 |
+
</script>
|
| 346 |
+
</body>
|
| 347 |
+
</html>
|