add: button

src/data/templates/projects.html

@@ -2,17 +2,21 @@
 
 {% block content %}
 <div class="container my-5">
-    <h1 class="mb-4 text-center">My Projects</h1>
+    <h1 class="mb-4 text-center">Mes projets:</h1>
 
     {% for project in projects %}
     <div class="row mb-4 justify-content-center">
         <div class="col-md-10">
+
             <a href="{{ project.link }}" class="text-decoration-none">
-                <div class="p-4 rounded-4 text-light shadow hover-scale transparent-box d-flex flex-column flex-md-row align-items-center">
+                <div class="p-4 rounded-4 text-light shadow hover-scale transparent-box d-flex flex-column flex-md-row align-items-center position-relative">
+
                     <!-- Project Image -->
                     <div class="project-img-wrapper text-center mb-3 mb-md-0 me-md-4">
                         <img src="{{ url_for('static', filename='img/' ~ project.image) }}"
-                             alt="{{ project.title }}" class="img-fluid rounded shadow project-img" style="max-width: 200px;">
+                            alt="{{ project.title }}"
+                            class="img-fluid rounded shadow project-img"
+                            style="max-width: 200px;">
                     </div>
 
                     <!-- Project Text -->
@@ -20,8 +24,17 @@
                         <h4>{{ project.title }}</h4>
                         <p>{{ project.description }}</p>
                     </div>
+
+                    <!-- Button in bottom-right -->
+                    { % if project.button % }
+                        <button class="btn btn-primary project-btn"
+                            onclick="window.location='{{ project.button[1] }}'">
+                            {{ project.button[0] }}
+                        </button>
+                    { % endif % }
                 </div>
             </a>
+
         </div>
     </div>
     {% endfor %}