Files
aduzuki/pdf/template/carte_adherent.html
2026-07-20 16:33:04 +02:00

344 lines
12 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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 à lAssociation Française pour la Pédagogie Suzuki</h1>
<p>Année 2025/2026 <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 de l'Association AFPS : <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 2025/2026</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>