templates/preise.html.twig line 1

1. {% extends 'base.html.twig' %}
3. {% block title %}Preise - MyVPN{% endblock %}
5. {% block body %}
6. <section class="py-8">
7.     <div class="container">
8.         <div class="text-center mb-5">
9.             <h1 class="fw-bold text-1000">Unsere Preise</h1>
10.             <p class="text-muted">Wähle das perfekte Paket, das zu deinen Bedürfnissen passt und genieße alle Vorteile unserer VPN- und Hosting-Services.</p>
11.         </div>
13.         <!-- VPN Pricing Cards -->
14.         <div class="row">
15.             {% for produkt in vpnProdukte %}
16.                 <div class="col-md-4 mb-4">
17.                     <div class="card h-100 shadow-sm {% if loop.index0 is divisible by(3) %}border-primary{% endif %}">
18.                         <div class="card-body text-center">
19.                             <div class="mb-3 text-primary">
20.                                 <!-- Stelle sicher, dass jedes Produkt das korrekte Icon hat -->
21.                                 <i class="{{ produkt.icon }} fa-3x"></i> 
22.                             </div>
23.                             <h4 class="card-title fw-bold text-primary">{{ produkt.name }}</h4>
24.                             <h2 class="fw-bold">{{ produkt.preis|number_format(2, ',', '.') }}€/Monat</h2>
25.                             <ul class="list-unstyled mt-4 mb-4 text-start px-4">
26.                                 <!-- Teile die Beschreibung auf und iteriere durch jeden Punkt -->
27.                                 {% set beschreibungPunkte = produkt.beschreibung|split("\n") %}
28.                                 {% for punkt in beschreibungPunkte %}
29.                                     <li class="d-flex align-items-center mb-2">
30.                                         <i class="fas fa-check-circle text-success me-2"></i> <!-- FontAwesome grünes Häkchen -->
31.                                         <span>{{ punkt }}</span>
32.                                     </li>
33.                                 {% endfor %}
34.                             </ul>
35.                             <!-- Button zum Hinzufügen zum Warenkorb -->
36.                             <a href="{{ path('shop_checkout', { id: produkt.id }) }}" class="btn btn-outline-primary btn-lg rounded-pill">Jetzt starten</a>
37.                         </div>
38.                     </div>
39.                 </div>
40.             {% else %}
41.                 <div class="col-12">
42.                     <div class="alert alert-info text-center">
43.                         Keine VPN-Produkte verfügbar.
44.                     </div>
45.                 </div>
46.             {% endfor %}
47.         </div>
48.     </div>
49. </section>
51. <!-- Discord Bot Hosting Plans Section -->
52. <section class="py-8 bg-light">
53.     <div class="container">
54.         <div class="text-center mb-5">
55.             <h2 class="fw-bold text-1000">Discord Bot Hosting Preise</h2>
56.             <p class="text-muted">Hoste deinen Discord-Bot zuverlässig und ohne Ausfallzeiten – egal, ob du Anfänger oder erfahrener Entwickler bist.</p>
57.         </div>
59.         <div class="row">
60.             {% for produkt in discordBotProdukte %}
61.                 <div class="col-md-4 mb-4">
62.                     <div class="card h-100 shadow-sm {% if loop.index0 is divisible by(3) %}border-primary{% endif %}">
63.                         <div class="card-body text-center">
64.                             <div class="mb-3 text-primary">
65.                                 <!-- Verwende das Produkt-Icon aus der Datenbank -->
66.                                 <i class="{{ produkt.icon }} fa-3x"></i> 
67.                             </div>
68.                             <h4 class="card-title fw-bold text-primary">{{ produkt.name }}</h4>
69.                             <h2 class="fw-bold">{{ produkt.preis|number_format(2, ',', '.') }}€/Monat</h2>
70.                             <ul class="list-unstyled mt-4 mb-4 text-start px-4">
71.                                 <!-- Teile die Beschreibung auf und iteriere durch jeden Punkt -->
72.                                 {% set beschreibungPunkte = produkt.beschreibung|split("\n") %}
73.                                 {% for punkt in beschreibungPunkte %}
74.                                     <li class="d-flex align-items-center mb-2">
75.                                         <i class="fas fa-check-circle text-success me-2"></i> <!-- FontAwesome grünes Häkchen -->
76.                                         <span>{{ punkt }}</span>
77.                                     </li>
78.                                 {% endfor %}
79.                             </ul>
80.                             <!-- Button zum Hinzufügen zum Warenkorb -->
81.                             <a href="{{ path('shop_checkout', { id: produkt.id }) }}" class="btn btn-outline-primary btn-lg rounded-pill">Bot hosten</a>
82.                         </div>
83.                     </div>
84.                 </div>
85.             {% else %}
86.                 <div class="col-12">
87.                     <div class="alert alert-info text-center">
88.                         Keine Discord Bot Produkte verfügbar.
89.                     </div>
90.                 </div>
91.             {% endfor %}
92.         </div>
93.     </div>
94. </section>
96. <!-- Call-to-Action einbinden -->
97. {% include 'CallToAction/register.html.twig' %}
99. {% endblock %}