199 lines
7.9 KiB
HTML
199 lines
7.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<!-- Google tag (gtag.js)
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=G-2N37S6B74Z"></script>
|
|
<script>
|
|
window.dataLayer = window.dataLayer || [];
|
|
function gtag(){dataLayer.push(arguments);}
|
|
gtag('js', new Date());
|
|
|
|
gtag('config', 'G-2N37S6B74Z');
|
|
</script>
|
|
-->
|
|
|
|
<meta charset="utf-8" />
|
|
<title>smatchit—la nouvelle manière de rencontrer l'emploi qu'il vous faut</title>
|
|
<meta name="description" content="Pourquoi chercher un emploi quand l'emploi peut venir à vous ? >Plus de CVs, plus de candidatures sans réponse, plus de recherche sur des job boards. Notre solution basée sur l'IA analyse à la fois les candidats et les offres d'emploi et vous apporte des candidats sélectionnés en temps réel, pour rendre votre recherche <strong> rapide, simple et sans stress." />
|
|
|
|
<!-- init tachyons -->
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" href="./css/tachyons.css"/>
|
|
|
|
<!-- styles -->
|
|
<link rel="stylesheet" href="./css/global.css?v=3" />
|
|
<link rel="stylesheet" href="./css/index.css?v=3" />
|
|
|
|
<link href="https://fonts.cdnfonts.com/css/futura-std-4" rel="stylesheet" />
|
|
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet" />
|
|
|
|
<script src="./js/jquery-3.6.1.min.js"></script>
|
|
<script src="./js/velocity.min.js"></script>
|
|
|
|
|
|
<script type="text/javascript">
|
|
function toggleContent(type)
|
|
{
|
|
switch(type)
|
|
{
|
|
case 'candidate':
|
|
$("#candidate-content").fadeIn(200);
|
|
$("#recruiter-content").fadeOut(100);
|
|
|
|
$("#candidate-tab").css("background-size", "100%");
|
|
$("#recruiter-tab").css("background-size", "0%");
|
|
break;
|
|
|
|
case 'recruiter':
|
|
$("#candidate-content").fadeOut(100);
|
|
$("#recruiter-content").fadeIn(200);
|
|
|
|
$("#candidate-tab").css("background-size", "0%");
|
|
$("#recruiter-tab").css("background-size", "100%");
|
|
break;
|
|
}
|
|
}
|
|
|
|
function sendNotify()
|
|
{
|
|
$("#sendBt").prop("disabled", true);
|
|
|
|
var _email = document.querySelector("input[name='user_email']").value;
|
|
var _typeSelected = document.querySelector("input[name='user_type']:checked");
|
|
var _user_type = (_typeSelected) ? _typeSelected.value : "none";
|
|
|
|
console.log(_email + " is " + _user_type);
|
|
|
|
|
|
if (validateEmail(_email))
|
|
{
|
|
$.post(
|
|
'save.php',
|
|
{ email: _email, user_type: _user_type },
|
|
function (response)
|
|
{
|
|
if (response)
|
|
{
|
|
$("#mini-form").html("<p class='text'>Merci ! Nous vous tiendrons informé dès que <span class='smatchit'>smatchit</span> est live. Nous avons hâte de vous voir <span class='smatchit'>smatcher</span> 😉.</p>");
|
|
}
|
|
else
|
|
{
|
|
$("#error").html("<p class='error-message'>Désolé, nous rencontrons une difficulté, merci d'essayer dans quelques instants.</p>");
|
|
|
|
setTimeout(function()
|
|
{
|
|
$("#error").html("<p class='error-message'> </p>");
|
|
}, 2000);
|
|
}
|
|
|
|
$("#sendBt").prop("disabled", false);
|
|
}
|
|
);
|
|
}
|
|
else
|
|
{
|
|
$("#error").html("<p class='error-message'>Il semble que l'adresse email soit invalide...</p>");
|
|
|
|
setTimeout(function()
|
|
{
|
|
$("#error").html("<p class='error-message'> </p>");
|
|
}, 1800);
|
|
|
|
$("#sendBt").prop("disabled", false);
|
|
}
|
|
|
|
}
|
|
|
|
function validateEmail(email)
|
|
{
|
|
if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email))
|
|
{
|
|
console.log("Email is valid")
|
|
return true;
|
|
}
|
|
console.log("You have entered an invalid email address!")
|
|
return false;
|
|
}
|
|
|
|
function init()
|
|
{
|
|
var _hash = window.location.hash;
|
|
var _content = (_hash) ? _hash.split("#")[1] : "candidate";
|
|
|
|
toggleContent(_content);
|
|
};
|
|
</script>
|
|
</head>
|
|
<body onload="init()">
|
|
<div class="flex flex-wrap container">
|
|
<div class="flex flex-column header">
|
|
<div class="fl logo">
|
|
<h1><img alt="smatchit" src="./img/smatchit-logo.svg" /></h1>
|
|
</div>
|
|
|
|
<div class="fl tabs">
|
|
<span id="candidate-tab" class="ib candidate-tab">
|
|
<a href="#candidate" onclick="toggleContent('candidate')">Talent</a>
|
|
</span>
|
|
|
|
<div class="vertical-line">
|
|
<img src="./img/tab-divider.svg" />
|
|
</div>
|
|
|
|
<span id="recruiter-tab" class="ib recruiter-tab">
|
|
<a href="#recruiter" onclick="toggleContent('recruiter')">Entreprise</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-column w-100 content">
|
|
<div id="candidate-content" class="fl w-100 mw7 ph4 center cf">
|
|
<p class="title">Pourquoi chercher un emploi quand l'emploi peut venir à vous ?</p>
|
|
<p class="text">Plus de CVs, plus de candidatures sans réponse, plus de recherche sur des job boards.</p>
|
|
<p class="text-cta underline-candidates"><span class="smatchit">smatchit</span> choisi les meilleures opportunités d'emploi en temps réel et là où vous êtes !</p>
|
|
<p><img class="screenshot candidates-img" alt="screenshot of the candidates app" src="./img/candidates@2x.png"></p>
|
|
</div>
|
|
|
|
<div id="recruiter-content" class="fl w-100 ph4 center cf">
|
|
<p class="mw7 center title">Ne perdez plus de temps à rédiger un descriptif de poste ou à lire des CVs qui ne smatch pas. <span class="smatchit">smatchit</span> le fait pour vous.</p>
|
|
<p class="mw7 center text">Notre solution basée sur l'IA analyse à la fois les candidats et les offres d'emploi et vous apporte des candidats sélectionnés en temps réel, pour rendre votre recherche <strong> rapide, simple et sans stress.</strong></p>
|
|
<p class="mw7 center text-cta underline-recruiters">Utilisez votre temps à rencontrer le candidat idéal.</p>
|
|
<p><img class="screenshot recruiters-img" alt="screenshot of the recruiters app" src="./img/recruiters@2x.png"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-wrap w-100 footer">
|
|
<div class="hr"></div>
|
|
|
|
<div class="w-100-m w-50-l ph4 pv2 mw7 center">
|
|
<p class="title">Voulez vous être informé des étapes de développement de <span class="smatchit">smatchit</span> ?</p>
|
|
<p class="text">Confiez-nous votre email et suivez l'aventure <span class="smatchit">smatchit</span> !</p>
|
|
</div>
|
|
|
|
<div id="mini-form" class="w-100-m w-50-l pl4 pr6 pv2 mw7 center">
|
|
<p class="ib">
|
|
<span>Vous êtes :</span>
|
|
<span class="pl2">
|
|
<input type="radio" id="candidate" name="user_type" value="candidate" class="radio-input">
|
|
<label for="candidate">talent</label>
|
|
</input>
|
|
</span>
|
|
<span class="pl2">
|
|
<input type="radio" id="recruiter" name="user_type" value="recruiter" class="radio-input">
|
|
<label for="recruiter">entreprise</label>
|
|
</input>
|
|
</span>
|
|
</p>
|
|
<p class="input-form">
|
|
<input class="mr2 textfield-input" name="user_email" type="text" placeholder="Enter your email">
|
|
<button id="sendBt" onclick="sendNotify()" class="button">
|
|
<span class="send-b">Send</span>
|
|
</button>
|
|
</p>
|
|
|
|
<div id="error"><p class="error-message"> </p></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |