Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 | 1x | import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
@Component({
selector: 'app-legal',
standalone: true,
imports: [CommonModule],
template: `
<div class="legal-container">
<!-- Warning Banner -->
<div class="warning-banner">
<p class="warning-text">
Projet Fictif Étudiant : Ce site est une simulation réalisée dans un cadre pédagogique.
Aucune commande ne sera honorée et aucun concours n'est réel.
</p>
</div>
<div class="legal-content">
<h1 class="legal-title">Mentions Légales & CGU</h1>
<p class="legal-intro">
Conformément aux dispositions de la loi n° 2004-575 du 21 juin 2004 pour la confiance dans l'économie numérique,
il est porté à la connaissance des utilisateurs et visiteurs du site les présentes mentions légales.
</p>
<!-- Legal Information -->
<div class="legal-section">
<h2 class="section-title">1. Informations légales</h2>
<div class="section-content">
<p><strong>Propriétaire du site :</strong> Groupe Étudiant Fictif</p>
<p><strong>Adresse :</strong> 123 Rue de l'Exemple, 75000 Paris (Fictif)</p>
<p><strong>Contact :</strong> <a href="mailto:contact@thetiptop.fr" class="email-link">contact@thetiptop.fr</a></p>
<p><strong>Hébergeur :</strong> Service d'hébergement fictif</p>
</div>
</div>
<!-- Terms of Use -->
<div class="legal-section">
<h2 class="section-title">2. Conditions Générales d'Utilisation (CGU)</h2>
<div class="section-content">
<p>
Ce site est un projet fictif. Le jeu-concours présenté n'est pas réel.
Aucune participation ne sera prise en compte et aucun lot ne sera distribué.
</p>
</div>
</div>
<!-- Privacy Policy -->
<div class="legal-section">
<h2 class="section-title">3. Protection des données personnelles (RGPD)</h2>
<div class="section-content">
<p>
Les informations recueillies sur ce site sont purement fictives et ne font l'objet d'aucun traitement réel.
Aucune donnée personnelle n'est collectée, stockée ou traitée dans le cadre de ce projet pédagogique.
</p>
<p>
Les champs de formulaire présents sur le site sont uniquement destinés à la simulation et ne transmettent
aucune donnée réelle. Vous disposez d'un droit d'accès, de rectification et de suppression de vos données
en contactant <a href="mailto:contact@thetiptop.fr" class="email-link">contact@thetiptop.fr</a>.
</p>
</div>
</div>
</div>
</div>
`,
styles: [`
.legal-container {
min-height: 80vh;
background: var(--very-light-green);
}
.warning-banner {
background: var(--light-green);
padding: 1rem 2rem;
text-align: center;
border-bottom: 1px solid rgba(46, 92, 62, 0.1);
}
.warning-text {
color: var(--primary-green);
font-weight: 600;
font-size: 0.95rem;
margin: 0;
line-height: 1.5;
}
.legal-content {
max-width: 800px;
margin: 0 auto;
padding: 3rem 2rem;
}
.legal-title {
font-size: 2.5rem;
font-weight: 700;
color: var(--dark-gray);
text-align: center;
margin-bottom: 2rem;
}
.legal-intro {
font-size: 1.1rem;
color: var(--dark-gray);
text-align: center;
margin-bottom: 3rem;
line-height: 1.6;
opacity: 0.9;
}
.legal-section {
background: white;
border-radius: 12px;
padding: 2rem;
margin-bottom: 2rem;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.section-title {
font-size: 1.5rem;
font-weight: 700;
color: var(--dark-gray);
margin-bottom: 1.5rem;
}
.section-content {
color: var(--dark-gray);
line-height: 1.6;
}
.section-content p {
margin-bottom: 1rem;
}
.section-content p:last-child {
margin-bottom: 0;
}
.email-link {
color: var(--secondary-green);
text-decoration: none;
font-weight: 600;
}
.email-link:hover {
text-decoration: underline;
}
/* Responsive */
@media (max-width: 768px) {
.legal-content {
padding: 2rem 1rem;
}
.legal-title {
font-size: 2rem;
}
.legal-intro {
font-size: 1rem;
}
.legal-section {
padding: 1.5rem;
}
.section-title {
font-size: 1.3rem;
}
.warning-banner {
padding: 1rem;
}
.warning-text {
font-size: 0.9rem;
}
}
@media (max-width: 480px) {
.legal-section {
padding: 1.2rem;
}
.legal-title {
font-size: 1.8rem;
}
}
`]
})
export class LegalComponent {}
|