You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
XJC/src/app/components/home/home.component.html

348 lines
23 KiB
HTML

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<navigationBar></navigationBar>
<!--Main Navigation-->
<header>
<!-- Intro Section -->
<div class="col-md-12 col-sm-12 mb-3 view hm-white-light jarallax" id="intro" data-jarallax='{"speed": 0.2}' style="background-image: url(https://mdbootstrap.com/img/Photos/Others/img%20%2844%29.jpg); background-attachment: fixed;">
<div class="full-bg-img">
<div class="container flex-center">
<div class="row pt-5 mt-3">
<div class="col-md-12 mb-3">
<div class="intro-info-content text-center">
<h1 class="display-3 mb-5 wow fadeInDown" data-wow-delay="0.3s">Parraine <a class="indigo-text font-bold">Tes Amis</a></h1>
<h5 class="font-up mb-5 mt-1 font-bold wow fadeInDown" data-wow-delay="0.3s">La Grosse Remise !</h5>
<button class="btn btn-light-blue btn-lg wow fadeInDown waves-light" id="inscription" data-wow-delay="0.3s" mdbRippleRadius (click)="loadRegisterComponent();">S'inscrire</button>
<div *ngIf='loadComponentRegister'>
<app-register></app-register>
</div>
<button class="btn btn-indigo btn-lg wow fadeInDown waves-light" id="login" data-wow-delay="0.3s" mdbRippleRadius (click)="loadLoginComponent();">Se connecter</button>
<div *ngIf='loadComponentLogin'>
<login></login>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<!--Section: Features v.1-->
<section class="section col-md-12 col-sm-12 mb-3 feature-box wow fadeInUp" id="features">
<!--Section heading-->
<h1 class="section-heading pt-4">Comment ça marche ?</h1>
<!--Section description-->
<p class="section-description lead grey-text"><label class="font-bold">ParraineTesAmis.com</label> est le 1er site de parrainage en ligne !
<br>Les <label class="font-bold">Commerçants</label> créent des offres de parrainage et élisent des <label class="font-bold">Parrains</label>.
<br>Les parrains reçoivent leurs <label class="font-bold">Cartes de parrainage</label> numériques et les transfèrent à leurs Filleuls.
<br>Dès lors qu'un Filleul réalise un achat chez un Commerçant, la Carte de parrainage correspondante est créditée.
</p>
<!--Grid row-->
<div class="row features-big">
<!--Grid column-->
<div class="col-md-4 mb-r wow fadeInLeft">
<i class="fa fa-handshake-o blue-text"></i>
<h5 class="feature-title">Commercant</h5>
<p class="grey-text">Les Commerçants fixent leurs offres de parrainages.<br>Exemple: 5€ de remise pour le Filleul.<br>5€ de remise pour le Parrain</p>
</div>
<!--Grid column-->
<!--Grid column-->
<div class="col-md-4 mb-r wow fadeInUp">
<i class="fa fa-euro blue-text"></i>
<h5 class="feature-title">Parrain</h5>
<p class="grey-text">Les Parrains sont récompensés sur leur Carte à chaque fois qu'un parrainage aboutie.<br>Les filleuls profitent de bons plans.</p>
</div>
<!--Grid column-->
<!--Grid column-->
<div class="col-md-4 mb-r wow fadeInRight">
<i class="fa fa-line-chart blue-text"></i>
<h5 class="feature-title">Avantages</h5>
<p class="grey-text">Les Parrains cumulent des récompenses toute l'année.<br> Les Commerçants voient leurs fréquentation augmenter.</p>
</div>
<!--Grid column-->
</div>
<!--Grid row-->
</section>
<!--Section: Features v.1-->
<hr>
<!--Projects section v.3-->
<section class="section col-md-12 col-sm-12 mb-3 extra-margins" id="projects">
<!--Grid row-->
<div class="row">
<!--Grid column-->
<div class="col-lg-6 col-xl-5 pr-lg-5 pb-5 wow fadeInLeft" id="featuresImg1">
<!--Image-->
<img src="https://firebasestorage.googleapis.com/v0/b/webappparrain.appspot.com/o/ImgApp%2FHomeImgPar.jpg?alt=media&token=febce08c-a3af-452b-b870-223b8b3b1583" alt="Sample project image" class="img-fluid z-depth-2">
</div>
<!--Grid column-->
<!--Grid column-->
<div class="features col-lg-6 col-xl-7 pl-lg-5 pb-4 wow fadeInLeft flex-center" id="part1Features">
<h5 class="feature-title font-bold">Particuliers</h5>
<!--Grid row-->
<div class="feature-item row mb-3" >
<div class="col-12">
<!--<h5 class="feature-title font-bold">Safety</h5>-->
<p class="black-text">100% gratuit pour les particuliers, vos données
Confidentielles sont protégées, gagnez des avantages
Na jamais été aussi simple…</p>
<br>
<p class="black-text">Inscrivez vous en quelques secondes et commencez à
Collectionner vos cartes de parrainage chez vos
Commerçants affiliés !</p>
<div class="btn-block mt-5 d-flex flex-column flex-lg-row flex-md-row justify-content-center align-items-center" id="btnFeature1">
<button class="btn btn-blue btn-lg wow fadeInDown" pageScroll="#intro" [pageScrollOffset]="0" [pageScrollDuration]="700" [pageScrollInterruptible]="false" href="#intro" (click)="loadRegisterComponent2();">Inscrivez vous !</button>
<button md-ripple type="button" class="btn btn-light-blue btn-lg wow fadeInDown" (click)="basicModal.show()" ripple-radius>Nos commerçants</button>
</div>
<div bsModal #basicModal="bs-modal" [config]="{keyboard: false}" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myBasicModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close pull-right" aria-label="Close" (click)="basicModal.hide()">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title w-100" id="myModalLabel">Nos commerçants</h4>
</div>
<div class="modal-body">
<ul class="list-group">
<li class="list-group-item blue-text font-bold" *ngFor="let comm of commList | async ">{{comm.commercialName}}</li>
</ul>
</div>
<div class="modal-footer flex-column">
<button type="button" class="btn btn-secondary ml-auto" aria-label="Close" (click)="basicModal.hide()" ripple-radius>Fermer</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Grid row-->
<!--Grid row
<div class="feature-item row mb-3">
<div class="col-1 mr-1">
<i class="fa fa-code fa-lg red-text"></i>
</div>
<div class="col-10 ">
<h5 class="feature-title font-bold">Technology</h5>
<p class="grey-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit maiores nam, aperiam minima assumenda voluptate velit.</p>
</div>
</div>
Grid row-->
<!--Third row
<div class="feature-item row">
<div class="col-1 mr-1">
<i class="fa fa-money fa-lg brown-text"></i>
</div>
<div class="col-10">
<h5 class="feature-title font-bold">Finance</h5>
<p class="grey-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit maiores nam, aperiam minima assumenda voluptate velit.</p>
</div>
</div>
Third row-->
</div>
<!--Grid column-->
</div>
<!--Grid row-->
<hr>
<!--Grid row-->
<div class="row pt-5">
<!--Grid column-->
<div class="features col-lg-6 col-xl-7 mb-3 wow fadeInRight">
<h5 class="feature-title font-bold">Commerçants</h5>
<h5 class="feature-title">Ce qui va changer pour votre commerce</h5>
<!--Grid row-->
<div class="feature-item row mb-3" id="part2features" >
<div class="col-12">
<!--<h5 class="feature-title font-bold">Safety</h5>-->
<p class="black-text"><label class="font-bold blue-text">Réaliser des économies</label>, contrairement à des services classiques
Et onéreux où vous devez payer davance, ne payer que lorsquun
client a effectivement réaliser un achat chez vous.</p>
<p class="black-text"><label class="font-bold blue-text">Des cartes de fidélités dématérialisées</label>, des frais en moins.</p>
<p class="black-text"><label class="font-bold blue-text">Moins de cartes oubliés</label>, un système de fidélité plus fiable.</p>
<p class="black-text"><label class="font-bold blue-text">Vos clients satisfaits</label>, ils sont récompensés lorsquils vous
Envoient des clients.</p>
<p class="black-text"><label class="font-bold blue-text">Une meilleure visibilité sur internet</label>, vous figurez
Automatiquement dans notre base de données clients
Consultables par tous. Vos offres de fidélité sont publiées
Sur notre page Facebook sous 24h.</p>
<div class="btn-block mt-5 d-flex flex-column flex-lg-row flex-md-row justify-content-center align-items-center" id="btnFeature2">
<button class="btn btn-blue btn-lg wow fadeInDown waves-light" pageScroll="#intro" [pageScrollOffset]="0" [pageScrollDuration]="700" [pageScrollInterruptible]="false" href="#intro" (click)="loadRegisterComponent2();">Inscrivez vous !</button>
</div>
</div>
</div>
</div>
<!--Grid column-->
<!--Grid column-->
<div class="col-lg-6 col-xl-5 mb-3 wow fadeInRight" id="featuresImg2">
<!--Image-->
<img src="https://firebasestorage.googleapis.com/v0/b/webappparrain.appspot.com/o/ImgApp%2FHomeImgCom.jpg?alt=media&token=beb1ef50-e902-4d18-ac05-e4f48a7cf72b" alt="Sample project image" class="img-fluid card-img z-depth-2">
</div>
<!--Grid column-->
</div>
<!--Grid row-->
</section>
<!--Projects section v.3-->
<hr>
<!--Main Navigation-->
<main>
<div class="container wow fadeInLeftBig" id="footer-text">
<!--Grid row-->
<div class="row py-5 mt-4">
<!--Grid column-->
<div class="col-md-12 p-5">
<h1>Mentions légales</h1>
<br>
Merci de lire avec attention les différentes modalités dutilisation du présent site avant dy parcourir ses pages. En vous connectant sur ce site, vous acceptez sans réserves les présentes modalités. Aussi, conformément à larticle n°6 de la Loi n°2004-575 du 21 Juin 2004 pour la confiance dans léconomie numérique, les responsables du présent site internet <a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a> sont :
<br>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Editeur du Site : </b></span></p>
<p>EIRL XJC INFORMATIQUE</p>
<p>Numéro de SIRET : 81149124000016</p>
<p>Responsable editorial : Xavier JEAN-CHARLES</p>
<p>106 RES LES PLEIADES 1 AVENUE GOTTSCHALK</p>
<p>Téléphone :0696101601 - Fax : 0696101601</p>
<p>Email : xjc@live.fr</p>
<p>Site Web : <a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a></p>
<br>
<br>
<p style="color: #b51a00;"><b><span style="color: rgb(0, 0, 0);">Hébergement :</span> </b></p>
<p>Hébergeur : FIREBASEE</p>
<p>San Francisco, Californie, États-Unis</p>
<p>Site Web : <a href="http://https://firebase.google.com/">https://firebase.google.com/</a></p>
<br>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Développement</b><b> : </b></span></p>
<p>Thierry MADKAUD</p>
<p>Site Web : <a href="https://www.hopwork.fr/profile/thierrymadkaud">https://www.hopwork.fr/profile/thierrymadkaud</a></p>
<p>Anis BENZIANE</p>
<p>Site Web : <a href="https://www.hopwork.fr/profile/anisbenziane">https://www.hopwork.fr/profile/anisbenziane</a></p>
<br>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Conditions dutilisation : </b></span></p>
<p>Ce site (<a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a>) est proposé en différents langages web (HTML, HTML5, Javascript, CSS, etc…) pour un meilleur confort d'utilisation et un graphisme plus agréable, nous vous recommandons de recourir à des navigateurs modernes comme Internet explorer, Safari, Firefox, Google Chrome, etc…</p>
<p>Les mentions légales ont été générées sur le site <a title="générateur de mentions légales pour site internet gratuit" href="http://www.generateur-de-mentions-legales.com">Générateur de mentions légales</a>, offert par <a title="imprimerie paris, imprimeur paris" href="http://welye.com">Welye</a>.</p>
<span style="color: #323333;">EIRL XJC INFORMATIQUE<b> </b></span>met en œuvre tous les moyens dont elle dispose, pour assurer une information fiable et une mise à jour fiable de ses sites internet. Toutefois, des erreurs ou omissions peuvent survenir. L'internaute devra donc s'assurer de l'exactitude des informations auprès de , et signaler toutes modifications du site qu'il jugerait utile. n'est en aucun cas responsable de l'utilisation faite de ces informations, et de tout préjudice direct ou indirect pouvant en découler.
<b>Cookies</b> : Le site <a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a> peut-être amené à vous demander lacceptation des cookies pour des besoins de statistiques et d'affichage. Un cookies est une information déposée sur votre disque dur par le serveur du site que vous visitez. Il contient plusieurs données qui sont stockées sur votre ordinateur dans un simple fichier texte auquel un serveur accède pour lire et enregistrer des informations . Certaines parties de ce site ne peuvent être fonctionnelles sans lacceptation de cookies.
<b>Liens hypertextes :</b> Les sites internet de peuvent offrir des liens vers dautres sites internet ou dautres ressources disponibles sur Internet. EIRL XJC INFORMATIQUE ne dispose d'aucun moyen pour contrôler les sites en connexion avec ses sites internet. ne répond pas de la disponibilité de tels sites et sources externes, ni ne la garantit. Elle ne peut être tenue pour responsable de tout dommage, de quelque nature que ce soit, résultant du contenu de ces sites ou sources externes, et notamment des informations, produits ou services quils proposent, ou de tout usage qui peut être fait de ces éléments. Les risques liés à cette utilisation incombent pleinement à l'internaute, qui doit se conformer à leurs conditions d'utilisation.
<p>Les utilisateurs, les abonnés et les visiteurs des sites internet de ne peuvent mettre en place un hyperlien en direction de ce site sans l'autorisation expresse et préalable de EIRL XJC INFORMATIQUE.</p>
<p>Dans l'hypothèse où un utilisateur ou visiteur souhaiterait mettre en place un hyperlien en direction dun des sites internet de EIRL XJC INFORMATIQUE, il lui appartiendra d'adresser un email accessible sur le site afin de formuler sa demande de mise en place d'un hyperlien. EIRL XJC INFORMATIQUE se réserve le droit daccepter ou de refuser un hyperlien sans avoir à en justifier sa décision.</p>
<br>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Services fournis : </b></span></p>
<p style="color: #323333;">L'ensemble des activités de la société ainsi que ses informations sont présentés sur notre site <a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a>.</p>
<p style="color: #323333;">EIRL XJC INFORMATIQUE sefforce de fournir sur le site https://webappparrain.firebaseapp.com/ des informations aussi précises que possible. les renseignements figurant sur le site <a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a> ne sont pas exhaustifs et les photos non contractuelles. Ils sont donnés sous réserve de modifications ayant été apportées depuis leur mise en ligne. Par ailleurs, tous les informations indiquées sur le site https://webappparrain.firebaseapp.com/<span style="color: #000000;"><b> </b></span>sont données à titre indicatif, et sont susceptibles de changer ou dévoluer sans préavis. </p>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Limitation contractuelles sur les données : </b></span></p>
<p>Les informations contenues sur ce site sont aussi précises que possible et le site remis à jour à différentes périodes de lannée, mais peut toutefois contenir des inexactitudes ou des omissions. Si vous constatez une lacune, erreur ou ce qui parait être un dysfonctionnement, merci de bien vouloir le signaler par email, à ladresse xjc@live.fr, en décrivant le problème de la manière la plus précise possible (page posant problème, type dordinateur et de navigateur utilisé, …).</p>
<p>Tout contenu téléchargé se fait aux risques et périls de l'utilisateur et sous sa seule responsabilité. En conséquence, ne saurait être tenu responsable d'un quelconque dommage subi par l'ordinateur de l'utilisateur ou d'une quelconque perte de données consécutives au téléchargement. <span style="color: #323333;">De plus, lutilisateur du site sengage à accéder au site en utilisant un matériel récent, ne contenant pas de virus et avec un navigateur de dernière génération mis-à-jour</span></p>
<p>Les liens hypertextes mis en place dans le cadre du présent site internet en direction d'autres ressources présentes sur le réseau Internet ne sauraient engager la responsabilité de EIRL XJC INFORMATIQUE.</p>
<br>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Propriété intellectuelle :</b></span></p>
<p>Tout le contenu du présent sur le site <a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a>, incluant, de façon non limitative, les graphismes, images, textes, vidéos, animations, sons, logos, gifs et icônes ainsi que leur mise en forme sont la propriété exclusive de la société à l'exception des marques, logos ou contenus appartenant à d'autres sociétés partenaires ou auteurs.</p>
<p>Toute reproduction, distribution, modification, adaptation, retransmission ou publication, même partielle, de ces différents éléments est strictement interdite sans l'accord exprès par écrit de EIRL XJC INFORMATIQUE. Cette représentation ou reproduction, par quelque procédé que ce soit, constitue une contrefaçon sanctionnée par les articles L.335-2 et suivants du Code de la propriété intellectuelle. Le non-respect de cette interdiction constitue une contrefaçon pouvant engager la responsabilité civile et pénale du contrefacteur. En outre, les propriétaires des Contenus copiés pourraient intenter une action en justice à votre encontre.</p>
<br>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Déclaration à la CNIL : </b></span></p>
<p>Conformément à la loi 78-17 du 6 janvier 1978 (modifiée par la loi 2004-801 du 6 août 2004 relative à la protection des personnes physiques à l'égard des traitements de données à caractère personnel) relative à l'informatique, aux fichiers et aux libertés, ce site a fait l'objet d'une déclaration 0108461 auprès de la Commission nationale de l'informatique et des libertés (<a href="http://www.cnil.fr/">www.cnil.fr</a>).</p>
<br>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Litiges : </b></span></p>
Les présentes conditions du site <a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a> sont régies par les lois françaises et toute contestation ou litiges qui pourraient naître de l'interprétation ou de l'exécution de celles-ci seront de la compétence exclusive des tribunaux dont dépend le siège social de la société. La langue de référence, pour le règlement de contentieux éventuels, est le français.
<br>
<br>
<p style="color: #b51a00;"><span style="color: rgb(0, 0, 0);"><b>Données personnelles :</b></span></p>
<p>De manière générale, vous nêtes pas tenu de nous communiquer vos données personnelles lorsque vous visitez notre site Internet <a href="http://https://webappparrain.firebaseapp.com/">https://webappparrain.firebaseapp.com/</a>.</p>
<p>Cependant, ce principe comporte certaines exceptions. En effet, pour certains services proposés par notre site, vous pouvez être amenés à nous communiquer certaines données telles que : votre nom, votre fonction, le nom de votre société, votre adresse électronique, et votre numéro de téléphone. Tel est le cas lorsque vous remplissez le formulaire qui vous est proposé en ligne, dans la rubrique « contact ». Dans tous les cas, vous pouvez refuser de fournir vos données personnelles. Dans ce cas, vous ne pourrez pas utiliser les services du site, notamment celui de solliciter des renseignements sur notre société, ou de recevoir les lettres dinformation.</p>
<p>Enfin, nous pouvons collecter de manière automatique certaines informations vous concernant lors dune simple navigation sur notre site Internet, notamment : des informations concernant lutilisation de notre site, comme les zones que vous visitez et les services auxquels vous accédez, votre adresse IP, le type de votre navigateur, vos temps d'accès. De telles informations sont utilisées exclusivement à des fins de statistiques internes, de manière à améliorer la qualité des services qui vous sont proposés. Les bases de données sont protégées par les dispositions de la loi du 1er juillet 1998 transposant la directive 96/9 du 11 mars 1996 relative à la protection juridique des bases de données.</p>
</div>
<!--Grid column-->
</div>
<!--Grid row-->
</div>
</main>
<!--Footer-->
<footer class="page-footer mdb-color center-on-small-only">
<!--Social buttons-->
<div class="text-center mb-3">
<a class="btn-floating btn-small btn-fb waves-light" mdbRippleRadius><i class="fa fa-facebook"> </i></a>
<a class="btn-floating btn-small btn-tw waves-light" mdbRippleRadius><i class="fa fa-twitter"> </i></a>
<a class="btn-floating btn-small btn-gplus waves-light" mdbRippleRadius><i class="fa fa-google-plus"> </i></a>
</div>
<!--/.Social buttons-->
<!--Copyright-->
<div class="footer-copyright">
<div class="container-fluid">
© 2017 Copyright: <a href=""> XJC </a>
</div>
</div>
<!--/.Copyright-->
</footer>
<!--/.Footer-->