Update public/index.html

public/index.html

@@ -222,6 +222,53 @@
 body {
   font-family: 'Inter', sans-serif;
 }
+
+
+.repo-card {
+  display: flex;
+  align-items: flex-start;
+  background: #fff;
+  border-radius: 10px;
+  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
+  padding: 12px;
+  margin-bottom: 12px;
+  text-decoration: none;
+  transition: transform 0.2s ease;
+}
+.repo-card:hover {
+  transform: translateY(-3px);
+}
+
+.repo-icon {
+  margin-right: 12px;
+  font-size: 1.5rem;
+  color: #0d6efd;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.repo-content h5 {
+  font-size: 1rem;
+  font-weight: 600;
+  margin-bottom: 4px;
+}
+.repo-content p {
+  font-size: 0.875rem;
+  color: #555;
+  margin: 0;
+}
+
+.repo-group-header {
+  font-weight: 600;
+  font-size: 0.95rem;
+  color: #198754;
+  margin-bottom: 8px;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
 </style>
 
   <!-- =======================================================
@@ -462,7 +509,7 @@ body {
       <ul class="portfolio-filters isotope-filters" data-aos="fade-up" data-aos-delay="100">
         <li data-filter=".filter-publikationen" class="filter-active">Publikationen</li>
         <li data-filter=".filter-workshops">Workshops & Events</li>
-        <li data-filter=".filter-repo">GitLab-Repositories & Berichte</li>
+        <li data-filter=".filter-repo">GitLab- & Berichte-Repositories </li>
         <li data-filter=".filter-ergebnisse">Verwendung der Ergebnisse</li>
        <!-- <li data-filter=".filter-prototypen">Prototypen & Tools</li>
         <li data-filter=".filter-videos">Videos & Tutorials</li>-->
@@ -586,34 +633,57 @@ Implementations, and Perspectives
         </div><!-- End Workshop -->
 
 
-      <!-- GitLab-Repositories -->
+      <!-- GitLab- und Berichte-Repositories -->
 
        <!-- GitLab Repository: Adaptive Tests Plugin -->
         <div class="col-lg-4 col-md-6 portfolio-item isotope-item filter-repo">
-          <a href="https://transfer.hft-stuttgart.de/gitlab/knight/adaptivetests" class="custom-card-link">
-            <div class="custom-card-horizontal">
-              <img src="ausschreibung/img/gitlab.PNG" alt="Adaptive Tests Plugin">
-              <div class="custom-card-info">
-                  <h4>(AP4) Moodle-Plugin: Adaptive Tests</h4>
-                  <p>Plugin-Code zur Unterstützung adaptiver Tests (Moodle 4.1)</p>
-              </div>
+              <!-- Überschrift oder Badge für Kategorie -->
+              <div class="repo-group-header"><i class="bi bi-hdd-network"></i> GitLab-Repositories</div>
+
+              <!-- GitLab Repo 1 -->
+              <a href="https://transfer.hft-stuttgart.de/gitlab/knight/adaptivetests" class="repo-card" target="_blank">
+                <div class="repo-icon"><img src="ausschreibung/img/gitlab.PNG" alt="GitLab" width="28"></div>
+                <div class="repo-content">
+                  <h5>(AP4) Adaptive Tests</h5>
+                  <p>Moodle-Plugin für adaptive Testverfahren</p>
                 </div>
               </a>
+
+              <!-- GitLab Repo 2 -->
+              <a href="https://transfer.hft-stuttgart.de/gitlab/ulrike.pado/asyst-moodle-plugin" class="repo-card" target="_blank">
+                <div class="repo-icon"><img src="ausschreibung/img/gitlab.PNG" alt="GitLab" width="28"></div>
+                <div class="repo-content">
+                  <h5>ASYST Plugin</h5>
+                  <p>KI-gestützte Freitextbewertung</p>
                 </div>
+              </a>
 
-        <!-- GitLab Repository: ASYST Plugin -->
-         <div class="col-lg-4 col-md-6 portfolio-item isotope-item filter-repo">
-          <a href="https://transfer.hft-stuttgart.de/gitlab/ulrike.pado/asyst-moodle-plugin" class="custom-card-link">
-            <div class="custom-card-horizontal">
-              <img src="ausschreibung/img/gitlab.PNG" alt="ASYST Plugin">
-              <div class="custom-card-info">
-                  <h4>Moodle-Plugin: ASYST</h4>
-                  <p>Freitextbewertung mit KI – Plugin zur automatisierten Korrekturunterstützung</p>
+              <!-- Abschnittstrenner -->
+              <hr style="margin: 1rem 0; border-top: 1px solid #ccc;" />
+
+              <!-- Neue Kategorie -->
+              <div class="repo-group-header"><i class="bi bi-file-earmark-text"></i> Projektberichte</div>
+
+              <!-- Bericht 1 -->
+              <a href="https://transfer.hft-stuttgart.de/knight/bericht-adaptivetests.pdf" class="repo-card" target="_blank">
+                <div class="repo-icon"><i class="bi bi-file-earmark-pdf"></i></div>
+                <div class="repo-content">
+                  <h5>Bericht Adaptive Tests</h5>
+                  <p>PDF-Dokument zur technischen Umsetzung</p>
                 </div>
+              </a>
+
+              <!-- Bericht 2 -->
+              <a href="https://transfer.hft-stuttgart.de/knight/bericht-asyst.pdf" class="repo-card" target="_blank">
+                <div class="repo-icon"><i class="bi bi-file-earmark-pdf"></i></div>
+                <div class="repo-content">
+                  <h5>Bericht ASYST</h5>
+                  <p>Entwicklung des ASYST-Plugins</p>
                 </div>
               </a>
             </div>
 
+
         <!-- End GitLab -->
 
         <!-- Verwendungs der Ergebnisse  -->