Ajout de la page de contact

This commit is contained in:
Lyanis SOUIDI 2023-01-17 22:21:28 +01:00
parent 3c9943bd47
commit c15793f395
3 changed files with 178 additions and 1 deletions

55
assets/css/contact.css Normal file
View File

@ -0,0 +1,55 @@
input[type=text], input[type=email], select, textarea {
width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
margin-top: 6px;
resize: none
}
.field {
margin-bottom: 16px;
}
.button {
background-color: var(--c-b-primary);
padding: 15px 50px;
margin-right: 15px;
border: none;
border-radius: 4px;
font-size: 16px;
margin-left: 0px;
color: var(--c-a-primary);
text-align: center;
text-decoration: none;
display: inline-block;
}
.button:hover {
background-color: var(--c-a-secondary);
color: var(--c-b-primary);
}
.button.active {
background-color: var(--c-a-secondary);
color: var(--c-b-primary);
}
#contact-info a[href^="tel:"]::before {
content: "☎️ ";
}
#contact a[href^="mailto:"]::before {
content: "✉️ ";
}
.contact {
display: grid;
gap: 25px;
}
@media screen and (min-width: 700px) {
.contact {
grid-template-columns: 2fr 1fr;
}
}

7
assets/js/contact.js Normal file
View File

@ -0,0 +1,7 @@
textarea = document.getElementById('message');
textarea.setAttribute('style', 'height:' + (textarea.scrollHeight) + 'px;overflow-y:hidden;');
textarea.addEventListener("input", function () {
this.style.height = 'auto';
this.style.height = (this.scrollHeight) + 'px';
});

View File

@ -1,3 +1,112 @@
<?php
function contact_query($query_params) : string {
$url = parse_url($_SERVER["REQUEST_SCHEME"] . "://" . $_SERVER["HTTP_HOST"] . ($_SERVER["SERVER_PORT"] != "80" || "443" ? ":" . $_SERVER["SERVER_PORT"] : "") . $_SERVER["REQUEST_URI"]);
isset($url['query']) ? parse_str($url['query'], $params) : $params = array();
$params = array_merge($params, $query_params);
if (isset($params['profile']) && $params['profile'] == 'business') {
if (isset($params['subject']) && $params['subject'] == 'warranty') {
unset($params['subject']);
}
}
if (isset($params['profile']) && $params['profile'] == 'consumer') {
if (isset($params['subject']) && $params['subject'] == 'integration') {
unset($params['subject']);
}
}
$url['query'] = http_build_query($params);
return $url['scheme'] . '://' . $url['host'] . $url['path'] . '?' . $url['query'];
}
function contact_form($profile, $subject) : string {
$text = '</div>
<div class="contact">
<div class="right" id="contact-info">
<h3>Elite Solar</h3>
<p><a href="https://www.google.com/maps/place/8FW49MXP%2B3P" target="_blank">Route forestière Hurtault, 77300 Fontainebleau</a></p>
<p><a href="tel:+33160746800">+33 1 60 74 68 00</a></p>
<p><a href="mailto:elitesolar.contact77@gmail.com">elitesolar.contact77@gmail.com</a></p>
</div>
<form class="left" method="post">
<h3>Formulaire de contact</h3>
<div class="field">
<label for="name">Nom</label><br>
<input type="text" id="name" name="name" placeholder="Votre nom.." required><br>
</div>
<div class="field">
<label for="email">Adresse électronique</label><br>
<input type="email" id="email" name="email" placeholder="Votre adresse électronique.." required><br>
</div>';
if ($profile == 'business') {
$text .= '<input type="radio" name="type" value="business" hidden checked>
<div class="field"">
<label for="entreprise">Entreprise</label><br>
<input type="text" id="entreprise" name="entreprise" placeholder="Nom de votre entreprise.." required><br>
</div>';
} else echo '<input type="radio" name="type" value="consumer" hidden checked>';
if ($subject == 'integration') {
$text .= '<input type="text" name="subject" value="integration" hidden>';
} else $text .= '<label for="subject">Sujet</label><br>
<input type="text" id="subject" name="subject" placeholder="Le sujet de votre demande.." required><br>';
$text .= '<div class="field">
<label for="message">Message</label><br>
<textarea id="message" name="message" placeholder="Votre message.."></textarea><br>
</div>
<input class="button" type="submit" value="Envoyer">
</form>
</div>';
return $text;
}
function select_subject($profile) : string {
$text = ' et votre demande concerne';
if (isset($_GET["subject"]) && $_GET["subject"] == 'warranty') {
$text .= " <a href='" . contact_query(array("subject" => "")) . "'>la garantie Solar Glass</a>.</h2>";
$text .= "<p>La <a href='https://www.service-public.fr/particuliers/vosdroits/F11094' target='_blank'>garantie légale de conformité</a>
est assuré par le fabricant intégrant la technologie Solar Glass dans ses appareils, en cas de problème concernant Solar Glass sur votre appareil,
merci donc de <b>contacter directement le fabricant de votre appareil</b>.</p>";
} elseif (isset($_GET["subject"]) && $_GET["subject"] == 'integration') {
$text .= " <a href='" . contact_query(array("subject" => "")) . "'>l'intégration de Solar Glass dans vos produits</a>.</h2>";
$text .= contact_form($profile, $_GET["subject"]);
} elseif (isset($_GET["subject"]) && $_GET["subject"] == 'other') {
$text .= " <a href='" . contact_query(array("subject" => "")) . "'>autre chose</a>.</h2>";
$text .= contact_form($profile, $_GET["subject"]);
} else {
$text .= "...</h2>";
if ($profile == 'business') $text .= "<a class='button' href='" . contact_query(array("subject" => "integration")) ."'>L'intégration de Solar Glass dans vos produits</a>";
if ($profile == 'consumer') $text .= "<a class='button' href='" . contact_query(array("subject" => "warranty")) . "'>La garantie Solar Glass</a>";
$text .= "<a class='button' href='" . contact_query(array("subject" => "other")) . "'>Autre chose</a></div>";
}
return $text;
}
function select_profile() : string {
$text = '';
$text .= "<h2>Vous êtes";
if (isset($_GET["profile"]) && $_GET["profile"] == 'business') {
$text .= " <a href='" . contact_query(array("profile" => "")) . "'>une entreprise</a>";
$text .= select_subject('business');
} else if (isset($_GET["profile"]) && $_GET["profile"] == 'consumer') {
$text .= " <a href='" . contact_query(array("profile" => "")) . "'>un particulier</a>";
$text .= select_subject('consumer');
} else $text .= "...</h2>
<a class='button' href=" . contact_query(array("profile" => "business")) . ">Une entreprise</a>
<a class='button' href=" . contact_query(array("profile" => "consumer")) . ">Un particulier</a></div>";
return $text;
}
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="fr"> <html lang="fr">
<head> <head>
@ -6,6 +115,7 @@
<title>Elite Solar</title> <title>Elite Solar</title>
<link rel="stylesheet" href="../assets/css/style.css"> <link rel="stylesheet" href="../assets/css/style.css">
<link rel="stylesheet" href="../assets/css/header.css"> <link rel="stylesheet" href="../assets/css/header.css">
<link rel="stylesheet" href="../assets/css/contact.css">
<link rel="stylesheet" href="../assets/css/footer.css"> <link rel="stylesheet" href="../assets/css/footer.css">
<script src="../assets/js/header.js"></script> <script src="../assets/js/header.js"></script>
</head> </head>
@ -21,7 +131,11 @@
<li><a href="../faq">FAQ</a></li> <li><a href="../faq">FAQ</a></li>
</ul> </ul>
</header> </header>
<main></main> <main>
<div>
<h1>Nous contacter</h1>
<?= select_profile() ?>
</main>
<footer> <footer>
<div id="social"> <div id="social">
<p>Suivez-Nous</p> <p>Suivez-Nous</p>
@ -53,5 +167,6 @@
</div> </div>
<p id="copyright">© <?= date("Y") ?> Elite Solar. Créé par Lyanis Souidi, Tom Moguljak et Romain Journeau.</p> <p id="copyright">© <?= date("Y") ?> Elite Solar. Créé par Lyanis Souidi, Tom Moguljak et Romain Journeau.</p>
</footer> </footer>
<script src="../assets/js/contact.js"></script>
</body> </body>
</html> </html>