344 lines
12 KiB
HTML
344 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="fr-FR">
|
||
|
||
<head>
|
||
|
||
|
||
<!-- Encodage -->
|
||
<meta charset="UTF-8">
|
||
|
||
|
||
|
||
<!-- Taille écran étalonnage -->
|
||
<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"> -->
|
||
|
||
<!-- Titre -->
|
||
<title>AFPS - Adhésion</title>
|
||
|
||
<!-- Description -->
|
||
<meta name="description" content="Association Française pour la Pédagogie Suzuki - ADHÉSION">
|
||
|
||
<!-- mots-clés -->
|
||
<meta name="keywords" content="musique, apprentissage, cours, pedagogie, suzuki">
|
||
|
||
<!-- Auteur / Créateur / Publication -->
|
||
<link rel="author" href="mailto:juliechaumard@icloud.com" title="JulieChaumard.paris" />
|
||
<meta name="creator" content="JulieChaumard.paris">
|
||
<meta name="publisher" content="AFPS">
|
||
|
||
<!-- Page accueil -->
|
||
<link rel="start" href="" />
|
||
|
||
<!-- Logiciel utilisé pour créer la page -->
|
||
<meta name="generator" content="Visual Studio code">
|
||
|
||
<!-- Géolocalisation -->
|
||
<meta name="DC.title" content="AFPS">
|
||
<meta name="geo.region" content="FR-75">
|
||
<meta name="geo.placename" content="Paris">
|
||
<meta name="geo.position" content="48.866669;2.33333">
|
||
<meta name="ICBM" content="48.866669;2.33333">
|
||
|
||
<!-- Open Graph -->
|
||
<!-- TOUTES PAGES SAUF FICHE CONCERT -->
|
||
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:locale" content="fr_FR">
|
||
<meta property="og:title" content="Association Française pour la Pédagogie Suzuki">
|
||
<meta property="og:description" content="Association Française pour la Pédagogie Suzuki">
|
||
<meta property="og:url" content="">
|
||
<meta property="og:image" content="">
|
||
<meta property="og:image:alt" content="Illustration du site">
|
||
|
||
<!-- CSS -->
|
||
<link href="/public/css/app.css" rel="stylesheet">
|
||
|
||
|
||
</head>
|
||
{{#each membres}}
|
||
<body>
|
||
|
||
<style>
|
||
|
||
@font-face {
|
||
font-family: "montserrat_regular";
|
||
src: url("/Users/julie/Documents/GitHub/aduzuki/public/fonts/montserrat_regular.ttf") format("truetype");
|
||
}
|
||
|
||
@font-face {
|
||
font-family: "montserrat_semibold";
|
||
src: url("/Users/julie/Documents/GitHub/aduzuki/public/fonts/montserrat_semibold.ttf") format("truetype");
|
||
}
|
||
|
||
@font-face {
|
||
font-family: "montserrat_thin";
|
||
src: url("/Users/julie/Documents/GitHub/aduzuki/public/fonts/montserrat_thin.ttf") format("truetype");
|
||
}
|
||
|
||
/* BASE */
|
||
body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, blockquote, main, article, aside, section {
|
||
margin:0px 0px 0px 0px;
|
||
padding:0px 0px 0px 0px;
|
||
}
|
||
|
||
li, ul {
|
||
list-style: none;
|
||
}
|
||
|
||
|
||
|
||
a {
|
||
color: inherit;
|
||
text-decoration: none;
|
||
}
|
||
|
||
body {
|
||
font-family: cabin_regular;
|
||
}
|
||
|
||
/* HEADER */
|
||
|
||
header {
|
||
max-width: 1800px;
|
||
margin-left: auto;
|
||
margin-right: auto;
|
||
margin-bottom: 40px;
|
||
}
|
||
header .logo {
|
||
margin-top: 5px;
|
||
margin-left: 5px;
|
||
margin-bottom: 5px;
|
||
}
|
||
header .logo img {
|
||
max-width: 100%;
|
||
}
|
||
header h1 {
|
||
margin-bottom: 10px;
|
||
text-align: center;
|
||
font-family: cabin_semibold;
|
||
font-size: 15px;
|
||
}
|
||
header p {
|
||
text-align: center;
|
||
font-family: cabin_bold;
|
||
font-size: 15px;
|
||
color: #1c1c1c;
|
||
}
|
||
header p .soft {
|
||
font-family: cabin_regular;
|
||
color: #707070;
|
||
}
|
||
|
||
/* MAIN */
|
||
|
||
.adhesion_fin_container {
|
||
display: grid;
|
||
grid-column-gap: 20px;
|
||
grid-template-columns: 1fr 3fr 1fr;
|
||
grid-template-areas: ". adhesion_fin .";
|
||
text-align: center;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin {
|
||
grid-area: adhesion_fin;
|
||
display: grid;
|
||
grid-template-rows: auto auto auto;
|
||
row-gap: 30px;
|
||
grid-template-areas: "adhesion_fin_adresse" "adhesion_fin_description" "adhesion_fin_card";
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_adresse {
|
||
grid-area: adhesion_fin_adresse;
|
||
justify-self: end;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_adresse .adhesion_fin_adresse_titre {
|
||
font-family: montserrat_semibold;
|
||
font-size: 10px;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_adresse .adhesion_fin_adresse_infos {
|
||
margin-top: 10px;
|
||
line-height: 10px;
|
||
font-family: montserrat_regular;
|
||
font-size: 7px
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_adresse .adhesion_fin_adresse_identifiant {
|
||
margin-top: 7px;
|
||
|
||
font-family: montserrat_thin;
|
||
font-size: 7px
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_adresse .adhesion_fin_adresse_identifiant .adhesion_fin_adresse_identifiant_bold {
|
||
font-family: montserrat_regular;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_adresse .adhesion_fin_date {
|
||
margin-top: 15px;
|
||
font-family: montserrat_thin;
|
||
font-size: 10px
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_description {
|
||
grid-area: adhesion_fin_description;
|
||
margin-top: 60px;
|
||
text-align: center;
|
||
font-size: 10px
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_description .adhesion_fin_description_identifiant {
|
||
margin-top: 10px;
|
||
font-family: montserrat_thin;
|
||
font-size: 8px;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card {
|
||
grid-area: adhesion_fin_card;
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr 1fr 2fr;
|
||
grid-template-rows: auto auto auto auto;
|
||
row-gap: 30px;
|
||
grid-template-areas: "logo logo . adhesion_fin_card_description" ". adhesion_fin_card_identifiant adhesion_fin_card_identifiant adhesion_fin_card_identifiant" ". adhesion_fin_card_profil adhesion_fin_card_profil adhesion_fin_card_profil" ". adhesion_fin_paiement adhesion_fin_paiement adhesion_fin_paiement";
|
||
margin: 10%;
|
||
padding: 20px;
|
||
background-color: #e7305821;
|
||
border: 4px dashed #E73058;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .logo {
|
||
grid-area: logo;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .logo img {
|
||
width: 100%;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .adhesion_fin_card_description {
|
||
grid-area: adhesion_fin_card_description;
|
||
justify-self: end;
|
||
text-align: center;
|
||
font-size: 15px
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .adhesion_fin_card_description .adhesion_fin_card_description_assoc {
|
||
margin-top: 10px;
|
||
font-family: montserrat_regular;
|
||
font-size: 10px;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .adhesion_fin_card_description .adhesion_fin_card_description_annee {
|
||
margin-top: 5px;
|
||
font-family: montserrat_light;
|
||
font-size: 10px;
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .adhesion_fin_card_identifiant {
|
||
grid-area: adhesion_fin_card_identifiant;
|
||
margin-top: 15px;
|
||
margin-bottom: 15px;
|
||
font-family: montserrat_thin;
|
||
font-size: 10px
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .adhesion_fin_card_identifiant .adhesion_fin_card_identifiant_mail {
|
||
padding-left: 5px;
|
||
font-family: montserrat_regular;
|
||
color: #E73058;
|
||
font-size: 10px
|
||
}
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .adhesion_fin_card_profil {
|
||
grid-area: adhesion_fin_card_profil;
|
||
font-family: montserrat_regular;
|
||
font-size: 10px
|
||
}
|
||
|
||
.adhesion_fin_container .adhesion_fin .adhesion_fin_card .adhesion_fin_paiement {
|
||
grid-area: adhesion_fin_paiement;
|
||
margin-top: 20px;
|
||
margin-bottom: 15px;
|
||
font-family: montserrat_thin;
|
||
font-size: 7px;
|
||
}
|
||
</style>
|
||
|
||
|
||
<header>
|
||
<div class="logo">
|
||
<img src="" alt="">
|
||
</div>
|
||
|
||
<div>
|
||
<h1>Adhésion annuelle à l’Association Française pour la Pédagogie Suzuki</h1>
|
||
<p>Année 2022/2023 <span class="soft"> du 1er septembre au 31 août</span></p>
|
||
</div>
|
||
|
||
</header>
|
||
|
||
|
||
<main>
|
||
|
||
<section class="adhesion_fin_container">
|
||
|
||
<div class="adhesion_fin">
|
||
|
||
<div class="adhesion_fin_adresse">
|
||
<div class="adhesion_fin_adresse_titre">
|
||
<p>Association Française pour la pédagogie Suzuki</p>
|
||
</div>
|
||
<div class="adhesion_fin_adresse_infos">
|
||
<p>Chez Anne PAGES<br>30 rue des Tattes<br>74500 PUBLIER <br>afpedagogiesuzuki@gmail.com</p>
|
||
</div>
|
||
<div class="adhesion_fin_adresse_identifiant">
|
||
<p>SIRET : <span class="adhesion_fin_adresse_identifiant_bold">507 569 952 00033</span></p>
|
||
</div>
|
||
<div class="adhesion_fin_date">
|
||
<p>Le {{this.today}}</p>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="adhesion_fin_description">
|
||
<div>
|
||
<p>{{this.description}}</p>
|
||
</div>
|
||
<div class="adhesion_fin_description_identifiant">
|
||
<p></p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="adhesion_fin_card">
|
||
|
||
<div class="logo">
|
||
<img src="/public/images/logos/LogoSuzukiGris.png" alt="">
|
||
</div>
|
||
|
||
<div class="adhesion_fin_card_description">
|
||
<div>
|
||
<p>CARTE {{this.type_card}}</p>
|
||
</div>
|
||
<div class="adhesion_fin_card_description_assoc">
|
||
<p>Association Française pour la pédagogie Suzuki</p>
|
||
</div>
|
||
<div class="adhesion_fin_card_description_annee">
|
||
<p>ANNÉE 2022/2023</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="adhesion_fin_card_identifiant">
|
||
<p>IDENTIFIANT : <span class="adhesion_fin_card_identifiant_mail">{{this.identifiant}}</span></p>
|
||
</div>
|
||
|
||
<div class="adhesion_fin_card_profil">
|
||
<ul>
|
||
<li>{{this.profil1}}</li>
|
||
<li>{{this.profil2}}</li>
|
||
<li>{{this.profil3}}</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="adhesion_fin_paiement">
|
||
<p>{{this.adherent_paiement_mode}}</p>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</section>
|
||
|
||
</main>
|
||
|
||
|
||
|
||
<footer>
|
||
</footer>
|
||
|
||
</body>
|
||
{{/each}}
|
||
|
||
</html> |