Update search-results.php

Reviewed-on: #9

.idea/php.xml

@@ -10,9 +10,6 @@
     <option name="highlightLevel" value="WARNING" />
     <option name="transferred" value="true" />
   </component>
-  <component name="PhpProjectSharedConfiguration" php_language_level="7.0">
-    <option name="suggestChangeDefaultLanguageLevel" value="false" />
-  </component>
   <component name="PhpStanOptionsConfiguration">
     <option name="transferred" value="true" />
   </component>

content/createArticle.php

@@ -1,84 +0,0 @@
-<?php
-session_start();
-?>
-<!--
-    Seite: Beitrag erstellen
-    Inhalt: Formular für die Erstellung eines neuen Beitrags
--->
-<form method="post" action="php/controller/createArticle-controller.php" id="editor-form" class="article-editor-scope editor-container">
-
-    <main class="editor-main">
-        <?php if (isset($_SESSION["message"]) && $_SESSION["message"] == "internal_error"): ?>
-        <p class="alert-message is-error">
-            Es ist ein Fehler beim Speichern aufgetreten. Bitte versuche es erneut.
-        </p>
-        <?php endif; ?>
-        <?php if (isset($_SESSION["message"]) && $_SESSION["message"] == "missing_parameters"): ?>
-        <p class="alert-message is-error">
-            Jeder Beitrag muss einen Titel, Kategorie und Inhalt besitzen.
-        </p>
-        <?php endif; ?>
-        <input type="text" id="title" name="title" placeholder="Titel hier eingeben" required>
-        <textarea id="content" name="content" placeholder="Schreibe deinen Beitrag..."></textarea>
-    </main>
-
-    <!-- Seitenleiste -->
-    <aside class="editor-sidebar">
-
-        <div class="sidebar-block">
-            <button type="submit" class="btn-publish">Veröffentlichen</button>
-        </div>
-
-        <div class="sidebar-block">
-            <label for="category">Kategorie <span class="required">*</span></label>
-            <select id="category" name="category" required>
-                <option value="" disabled selected>Kategorie wählen...</option>
-
-                <optgroup label="Sprachen">
-                    <option value="deutsch">Deutsch</option>
-                    <option value="englisch">Englisch</option>
-                    <option value="franzoesisch">Französisch</option>
-                    <option value="latein">Latein</option>
-                    <option value="literatur">Literatur</option>
-                </optgroup>
-
-                <optgroup label="MINT">
-                    <option value="mathe">Mathematik</option>
-                    <option value="biologie">Biologie</option>
-                    <option value="chemie">Chemie</option>
-                    <option value="physik">Physik</option>
-                    <option value="informatik">Informatik</option>
-                    <option value="astronomie">Astronomie</option>
-                </optgroup>
-
-                <optgroup label="Gesellschaft & Werte">
-                    <option value="geschichte">Geschichte</option>
-                    <option value="erdkunde">Erdkunde</option>
-                    <option value="sozialkunde">Sozialkunde</option>
-                    <option value="wirtschaft">Wirtschaftskunde</option>
-                    <option value="religion">Religion</option>
-                    <option value="ethik">Ethikunterricht</option>
-                    <option value="philosophie">Philosophie</option>
-                    <option value="psychologie">Psychologie</option>
-                    <option value="kunst">Kunst</option>
-                    <option value="musik">Musik</option>
-                    <option value="theater">Theater</option>
-                </optgroup>
-
-                <optgroup label="Technik & Praxis">
-                    <option value="technik">Technik</option>
-                    <option value="werken">Werken</option>
-                    <option value="hauswirtschaft">Hauswirtschaft</option>
-                    <option value="sport">Sport</option>
-                </optgroup>
-            </select>
-        </div>
-
-        <div class="sidebar-block">
-            <label for="tags">Schlagwörter</label>
-            <input type="text" id="tags" name="tags" placeholder="z.B. Technik, IT (mit Komma trennen)">
-        </div>
-
-    </aside>
-
-</form>

content/home.php

@@ -1,25 +1,8 @@
-<?php
-include_once 'php/controller/home-controller.php';
-?>
-
 <!--
     Seite: Home
     Inhalt: Beinhaltet den Inhalt der Startseite
 -->
 <main>
-    <?php if (isset($_SESSION["message"]) && $_SESSION["message"] == "internal_error"): ?>
-        <p class="alert-message is-error">
-            Es ist ein Fehler beim Speichern aufgetreten. Bitte versuche es erneut.
-        </p>
-    <?php endif; ?>
-    <?php if (isset($_SESSION["message"]) && $_SESSION["message"] == "new_article"): ?>
-    <p class="alert-message is-success">
-        Dein Beitrag wurde erfolgreich veröffentlicht!
-    </p>
-    <?php endif; ?>
-    <?php
-    unset($_SESSION["message"]);
-    ?>
 
     <h1>Home</h1>
     <p>
@@ -36,23 +19,22 @@ include_once 'php/controller/home-controller.php';
         <div class="container">
             <a href="index.php?pfad=informatik" class="category-link">Informatik</a>
             <div class="article-link">
-                <a href="index.php?pfad=showArticle&id=<?php echo $dummy3->getId()?>"><?php if(isset($dummy3)){echo $dummy3->getTitle();}else{echo "Fehler: Beitrag nicht gefunden!";} ?></a>
+                <a href="datenschutzVSdatensicherheit.php">Datenschutz vs. Datensicherheit</a>
             </div>
         </div>
 
         <div class="container">
             <a href="index.php?pfad=mathe" class="category-link">Mathe</a>
             <div class="article-link">
-                <a href="index.php?pfad=showArticle&id=<?php echo $dummy1->getId()?>"><?php if(isset($dummy1)){echo $dummy1->getTitle();}else{echo "Fehler: Beitrag nicht gefunden!";} ?></a>
+                <a href="pythagoras.php">Satz des Pythagoras</a>
             </div>
         </div>
         
         <div class="container">
             <a href="index.php?pfad=physik" class="category-link">Physik</a>
             <div class="article-link">
-                <a href="index.php?pfad=showArticle&id=<?php echo $dummy2->getId()?>"><?php if(isset($dummy2)){echo $dummy2->getTitle();}else{echo "Fehler: Beitrag nicht gefunden!";} ?></a>
+                <a href="tunneleffekt.php">Der Tunneleffekt</a>
             </div>
         </div>
     </div>
-
 </main>

content/nutzungsbedingungen.php

@@ -10,10 +10,10 @@
     <meta name="description" content="EduForge">
     <meta name="author" content="Niklas Ortmann">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="icon" type="image/x-icon" href="images/logos/logo_icon.ico">
+    <link rel="icon" type="image/x-icon" href="../images/logos/logo_icon.ico">
-    <link rel="stylesheet" href="css/main.css">
+    <link rel="stylesheet" href="../css/main.css">
-    <link rel="stylesheet" href="css/navbar.css">
+    <link rel="stylesheet" href="../css/navbar.css">
-    <link rel="stylesheet" href="css/footer.css">
+    <link rel="stylesheet" href="../css/footer.css">
     <title>EduForge</title>
 </head>
 

content/search-results.php

@@ -0,0 +1,125 @@
+<?php
+session_start();
+?>
+<!--
+    Seite: Suchergebnisse
+    Inhalt: Zeigt die Ergebnisse einer Suche an
+-->
+<div class="s-res-layout-grid">
+
+    <!-- Links: Seitenleiste für Filter und Suche -->
+    <aside class="s-res-sidebar">
+
+        <!-- Suchleiste Box -->
+        <div class="s-res-sidebar-box">
+            <h3 class="s-res-sidebar-title">Suche anpassen</h3>
+            <form action="#" method="GET" class="s-res-search-form">
+                <input type="search" id="site-search" name="q" placeholder="Suchen..." class="nav__search">
+                <button type="submit" class="nav__search-button">Suchen</button>
+            </form>
+        </div>
+
+        <!-- Sortierfuntion Box -->
+        <div class="s-res-sidebar-box">
+            <h3 class="s-res-sidebar-title">Sortierung</h3>
+            <div class="s-res-filter-group">
+                <label class="s-res-filter-option">
+                    <input type="radio" name="sort" value="alphabet" checked>
+                    <span>Alphabetisch</span>
+                </label>
+                <label class="s-res-filter-option">
+                    <input type="radio" name="sort" value="likes">
+                    <span>Beliebtheit (Likes)</span>
+                </label>
+                <label class="s-res-filter-option">
+                    <input type="radio" name="sort" value="newest">
+                    <span>Neueste Beiträge</span>
+                </label>
+                <label class="s-res-filter-option">
+                    <input type="radio" name="sort" value="oldest">
+                    <span>Älteste Beiträge</span>
+                </label>
+            </div>
+        </div>
+
+    </aside>
+
+    <main class="s-res-main-content">
+
+        <div class="s-res-header">
+            <h1 class="s-res-main-title">Suchergebnisse</h1>
+            <p class="s-res-meta">3 Treffer für Ihre Suchanfrage</p>
+        </div>
+
+        <!-- Ergebnisliste -->
+        <div class="s-res-list">
+
+            <?php
+            if(isset($_SESSION['message']) && $_SESSION['message'] == "new_search_results"): ?>
+            <!-- TODO: Hier die Beiträge ausgeben. -->
+            <?php elseif (isset($_SESSION["message"]) && $_SESSION["message"] == "missing_parameters"): ?>
+            <p>
+                Bitte überprüfe deine Sucheingabe und versuche es erneut!
+            </p>
+            <?php endif; ?>
+            <?php
+            unset($_SESSION["message"]);
+            ?>
+
+            <!-- Beispielbeitrag -->
+            <div class="s-res-item">
+                <div class="s-res-content">
+                    <h2 class="s-res-item-title">
+                        <a href="#" class="s-res-link">Pythagoras</a>
+                    </h2>
+                    <p class="s-res-author">Von: <span class="s-res-author-name">Max Mustermann</span></p>
+                </div>
+                <div class="s-res-arrow">&rarr;</div>
+            </div>
+
+            <!-- Beispielbeitrag -->
+            <div class="s-res-item">
+                <div class="s-res-content">
+                    <h2 class="s-res-item-title">
+                        <a href="#" class="s-res-link">Pythagoras</a>
+                    </h2>
+                    <p class="s-res-author">Von: <span class="s-res-author-name">Max Mustermann</span></p>
+                </div>
+                <div class="s-res-arrow">&rarr;</div>
+            </div>
+
+            <!-- Beispielbeitrag -->
+            <div class="s-res-item">
+                <div class="s-res-content">
+                    <h2 class="s-res-item-title">
+                        <a href="#" class="s-res-link">Pythagoras</a>
+                    </h2>
+                    <p class="s-res-author">Von: <span class="s-res-author-name">Max Mustermann</span></p>
+                </div>
+                <div class="s-res-arrow">&rarr;</div>
+            </div>
+
+        </div>
+        <div class="s-res-pagination-footer">
+
+            <!-- Auswahl der Ergebnisse pro Seite -->
+            <div class="s-res-limit-selector">
+                <label for="s-res-per-page" class="s-res-limit-label">Ergebnisse pro Seite:</label>
+                <select id="s-res-per-page" name="limit" class="s-res-limit-select">
+                    <option value="10" selected>10</option>
+                    <option value="20">20</option>
+                    <option value="50">50</option>
+                    <option value="100">100</option>
+                </select>
+            </div>
+
+            <div class="s-res-page-navigation">
+                <button type="button" class="s-res-page-btn" disabled>&laquo;</button>
+                <button type="button" class="s-res-page-btn s-res-page-btn-active">1</button>
+                <button type="button" class="s-res-page-btn">&raquo;</button>
+            </div>
+
+        </div>
+    </main>
+
+</div>

content/showArticle.php

@@ -1,61 +0,0 @@
-<!--
-    Seite: Anzeige für Beiträge
-    Funktion: Stellt einen übergebenen Beitrag dar.
--->
-
-<?php
-include_once 'php/controller/showArticle-controller.php';
-?>
-
-<!-- Hauptcontainer für die Beitragsansicht (Ausschließlich der Content-Bereich) -->
-<main class="article-view-container">
-    <!-- Metadaten & Titel -->
-    <div class="article-view-top-section">
-
-        <?php if (isset($category) && !empty($category)): ?>
-            <span class="article-view-category"><?php echo htmlspecialchars($category); ?></span>
-        <?php endif; ?>
-
-        <h1 class="article-view-title">
-            <?php if (isset($title)) { echo htmlspecialchars($title); } ?>
-        </h1>
-
-        <div class="article-view-meta">
-            <?php if (isset($author) && !empty($author)): ?>
-                <span class="article-view-author">Von: <strong><?php echo htmlspecialchars($author); ?></strong></span>
-            <?php endif; ?>
-        </div>
-
-    </div>
-
-    <!-- articleikel-Inhalt -->
-    <div class="article-view-content">
-        <?php if (isset($content)): ?>
-            <!-- nl2br für Zeilenumbrüche -->
-            <div class="article-view-body"><?php echo nl2br(htmlspecialchars($content)); ?></div>
-        <?php endif; ?>
-    </div>
-
-    <!-- articleikel-Endbereich (Tags) -->
-    <?php if (isset($tags) && !empty($tags)): ?>
-        <div class="article-view-bottom-section">
-            <div class="article-view-tags-label">Tags:</div>
-            <div class="article-view-tags-list">
-                <?php
-                // Falls $tags ein String ist (z.B. "Web, CSS"), in ein Array umwandeln
-                $tagArray = is_array($tags) ? $tags : explode(',', $tags);
-                foreach ($tagArray as $tag):
-                    $trimmedTag = trim($tag);
-                    if (!empty($trimmedTag)):
-                        ?>
-                        <span class="article-view-tag-item"><?php echo htmlspecialchars($trimmedTag); ?></span>
-                    <?php
-                    endif;
-                endforeach;
-                ?>
-            </div>
-        </div>
-    <?php endif; ?>
-
-</main>
-

css/createArticle.css

@@ -1,124 +0,0 @@
-/* editor in Flexbox */
-.article-editor-scope.editor-container {
-    display: flex;
-    min-height: 100vh;
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-    color: #1e1e1e;
-    background-color: #f0f2f5;
-    box-sizing: border-box;
-}
-
-.article-editor-scope * {
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-}
-
-/* Hauptbereich */
-.article-editor-scope .editor-main {
-    flex: 1;
-    padding: 40px;
-    display: flex;
-    flex-direction: column;
-    gap: 20px;
-    background: #ffffff;
-}
-
-.article-editor-scope #title {
-    font-size: 2.5rem;
-    font-weight: 700;
-    border: none;
-    outline: none;
-    width: 100%;
-    background: transparent;
-}
-
-.article-editor-scope #content {
-    flex: 1;
-    font-size: 1.1rem;
-    line-height: 1.6;
-    border: none;
-    outline: none;
-    resize: none;
-    width: 100%;
-    background: transparent;
-}
-
-/* Seitenleiste */
-.article-editor-scope .editor-sidebar {
-    width: 300px;
-    background-color: #ffffff;
-    border-left: 1px solid #e0e0e0;
-    padding: 20px;
-    display: flex;
-    flex-direction: column;
-    gap: 24px;
-}
-
-.article-editor-scope .sidebar-block {
-    display: flex;
-    flex-direction: column;
-    gap: 8px;
-}
-
-.article-editor-scope .sidebar-block label {
-    font-weight: 600;
-    font-size: 0.9rem;
-}
-
-.article-editor-scope .required {
-    color: #d94f4f;
-}
-
-/* Formularelemente innerhalb der Editor-Sidebar */
-.article-editor-scope .editor-sidebar select,
-.article-editor-scope .editor-sidebar input[type="text"] {
-    width: 100%;
-    padding: 8px;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    font-size: 0.9rem;
-    background: #ffffff;
-}
-
-/* Button-Zeugs */
-.article-editor-scope .btn-publish {
-    background-color: #007cba;
-    color: white;
-    border: none;
-    padding: 12px;
-    border-radius: 4px;
-    font-weight: 600;
-    cursor: pointer;
-    font-size: 1rem;
-    width: 100%;
-}
-
-.article-editor-scope .btn-publish:hover {
-    background-color: #006ba1;
-}
-
-/* Responsive Anpassungen unter 760px (für z.B. Smartphones) */
-@media (max-width: 760px) {
-    .article-editor-scope.editor-container {
-        /* Sidebar nach unten */
-        flex-direction: column;
-    }
-
-    .article-editor-scope .editor-main {
-        /* weniger Innenabstand */
-        padding: 20px;
-    }
-
-    .article-editor-scope #content {
-        /* Verhindert, dass das Textfeld auf kleinen Displays kollabiert */
-        min-height: 300px;
-    }
-
-    .article-editor-scope .editor-sidebar {
-        width: 100%;
-        /* Entfernt den linken Rand und setzt ihn nach oben als Trenner */
-        border-left: none;
-        border-top: 1px solid #e0e0e0;
-    }
-}

css/footer.css

@@ -1,7 +1,5 @@
 /* Footer‑Grundlayout */
 footer {
-    position: fixed;
-    bottom: 0;
     width: 100%;
     background: #333d43;
     text-align: center;

css/main.css

@@ -3,12 +3,19 @@ main {
     max-width:1200px;
     margin: 0 auto;
     padding: 20px;
+
+    width: 100%;
+    box-sizing: border-box;
 }
 
 body {
     background-color: #eef2f7;
     color: #1f2937;
     margin: 0;
+
+    min-height: 100vh;
+    display: grid;
+    grid-template-rows: auto 1fr auto; /* Header(auto), Inhalt (bekommt Rest), Footer(auto) */
 }
 
 a, button, input, select, textarea, label, main{
@@ -17,7 +24,8 @@ a, button, input, select, textarea, label, main{
 
 .flexbox {
     display: flex;
-    flex-direction: column;
+    flex-direction: row;
+    flex-wrap: wrap;
     gap: 20px;
     margin-top: 30px;
 }
@@ -29,6 +37,7 @@ a, button, input, select, textarea, label, main{
     border: 1px solid #dbe3ec;
     box-shadow: 0 4px 12px rgba(0,0,0,0.08);
     transition: transform 0.2s, box-shadow 0.2s;
+    flex: 1 1 300px;
 }
 
 .container:hover {

css/message.css

@@ -1,29 +0,0 @@
-.alert-message {
-    padding: 12px 16px;
-    margin: 12px 0;
-    border-radius: 6px;
-    border: 1px solid transparent;
-
-    font-family: sans-serif;
-    font-size: 14px;
-    font-weight: 500;
-    line-height: 1.5;
-
-    display: flex;
-    align-items: center;
-    gap: 10px;
-}
-
-/* Rote Fehlermeldung */
-.alert-message.is-error {
-    color: #ba1a1a;
-    background-color: #ffeede;
-    border-color: #ffb4ab;
-}
-
-/* Grüne Erfolgsmeldung */
-.alert-message.is-success {
-    color: #006e2c;
-    background-color: #e8f5e9;
-    border-color: #b2dfdb;
-}

css/navbar.css

@@ -205,6 +205,10 @@ CSS für die navbar
         margin-left: 4px;
     }
 
+    .nav__search-button:hover {
+        background-color: #f8f9fa;
+    }
+
     /* restliche desktop-navbar aus */
     .nav__center,
     .nav__right .nav__button,
@@ -227,6 +231,9 @@ CSS für die navbar
         padding: 2rem 1rem;
         box-shadow: 2px 0 10px rgba(0,0,0,0.5);
         overflow-y: auto;
+        
+        /* Genug Abstand oben rechts, damit Links nicht hinter dem X liegen */
+        padding: 4rem 1.5rem 2rem 1.5rem;
     }
 
     .nav__checkbox:checked ~ .nav__mobile-menu {
@@ -237,6 +244,18 @@ CSS für die navbar
         left: 0;
     }
 
+    .nav__close-btn {
+        position: absolute;
+        top: 1rem;
+        right: 1.5rem;
+        font-size: 2rem;
+        color: #fff;
+        cursor: pointer;
+        line-height: 1;
+        user-select: none;
+        transition: color 0.2s ease, transform 0.2s ease;
+    }
+
     .nav__mobile-menu a {
         color: #fff;
         text-decoration: none;

css/search-results.css

@@ -0,0 +1,263 @@
+/*
+CSS für die Suchergebnis-Seite
+ */
+/* Container und Layout-Schutz vor globalen Styles */
+.s-res-layout-grid {
+    box-sizing: border-box;
+    max-width: 95%; /* Nutzt jetzt 95% der Bildschirmbreite statt starrer Pixel */
+    width: 95%;  /* Erhöht das Limit für extrem große Monitore von 1200px auf 1600px */
+    margin: 2rem auto;
+    padding: 0 1rem;
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+    color: #212529;
+    line-height: 1.5;
+
+    /* Grid für die Zweispaltigkeit */
+    display: grid;
+    grid-template-columns: 320px 1fr; /* Seitenleiste leicht verbreitert, Inhalt nimmt den gesamten Rest ein */
+    gap: 2.5rem; /* Etwas mehr Abstand zwischen Seitenleiste und Inhalt für das breitere Layout */
+}
+
+.s-res-layout-grid * {
+    box-sizing: border-box;
+}
+
+/* --- SEITENLEISTE (FILTER & SUCHE) --- */
+.s-res-sidebar {
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+}
+
+.s-res-sidebar-box {
+    background-color: #ffffff;
+    border: 1px solid #e2e8f0;
+    border-radius: 8px;
+    padding: 1.25rem;
+}
+
+.s-res-sidebar-title {
+    font-size: 1rem;
+    font-weight: 700;
+    color: #1a202c;
+    margin: 0 0 1rem 0;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+}
+
+/* Formular & deine Suchleisten-Klassen */
+.s-res-search-form {
+    display: flex;
+    align-items: center;
+}
+
+/* Filter Radio-Buttons */
+.s-res-filter-group {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+}
+
+.s-res-filter-option {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    cursor: pointer;
+    font-size: 0.95rem;
+    color: #4a5568;
+}
+
+.s-res-filter-option input[type="radio"] {
+    margin: 0;
+    accent-color: #3182ce; /* Moderne Färbung des Radio-Buttons */
+}
+
+/* --- HAUPTINHALT (ERGEBNISSE) --- */
+.s-res-main-content {
+    min-width: 0; /* Verhindert das Ausbrechen von Flex-Elementen */
+}
+
+.s-res-header {
+    margin-bottom: 2rem;
+    border-bottom: 2px solid #dee2e6;
+    padding-bottom: 1rem;
+}
+
+.s-res-main-title {
+    font-size: 2rem;
+    color: #1a202c;
+    margin: 0 0 0.5rem 0;
+    font-weight: 700;
+}
+
+.s-res-meta {
+    color: #6c757d;
+    font-size: 0.95rem;
+    margin: 0;
+}
+
+.s-res-list {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+}
+
+/* Einzelner Beitrag */
+.s-res-item {
+    background-color: #ffffff;
+    border: 1px solid #e2e8f0;
+    border-radius: 8px;
+    padding: 1.25rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
+}
+
+.s-res-item:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
+    border-color: #cbd5e1;
+}
+
+.s-res-content {
+    flex: 1;
+}
+
+.s-res-item-title {
+    font-size: 1.25rem;
+    margin: 0 0 0.25rem 0;
+    font-weight: 600;
+}
+
+.s-res-link {
+    color: #3182ce;
+    text-decoration: none;
+    transition: color 0.2s ease;
+}
+
+.s-res-link:hover {
+    text-decoration: underline;
+    color: #2b6cb0;
+}
+
+.s-res-author {
+    font-size: 0.875rem;
+    color: #4a5568;
+    margin: 0;
+}
+
+.s-res-author-name {
+    font-weight: 600;
+    color: #2d3748;
+}
+
+.s-res-arrow {
+    font-size: 1.5rem;
+    color: #a0aec0;
+    padding-left: 1rem;
+    transition: color 0.2s ease, transform 0.2s ease;
+}
+
+.s-res-item:hover .s-res-arrow {
+    color: #3182ce;
+    transform: translateX(3px);
+}
+
+/* --- ERGEBNISSE PRO SEITE & PAGINIERUNG --- */
+.s-res-pagination-footer {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-top: 2rem;
+    padding-top: 1.5rem;
+    border-top: 1px solid #e2e8f0;
+}
+
+/* Dropdown-Auswahl */
+.s-res-limit-selector {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+}
+
+.s-res-limit-label {
+    font-size: 0.9rem;
+    color: #4a5568;
+}
+
+.s-res-limit-select {
+    padding: 0.35rem 1.5rem 0.35rem 0.5rem;
+    font-size: 0.9rem;
+    color: #2d3748;
+    background-color: #ffffff;
+    border: 1px solid #cbd5e1;
+    border-radius: 4px;
+    cursor: pointer;
+    outline: none;
+    transition: border-color 0.2s;
+
+    /* Diskreter nativer Pfeil-Style */
+    appearance: none;
+    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://w3.org' viewBox='0 0 24 24' fill='none' stroke='%234a5568' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+    background-repeat: no-repeat;
+    background-position: right 0.4rem center;
+    background-size: 1em;
+}
+
+.s-res-limit-select:focus {
+    border-color: #3182ce;
+}
+
+/* Seitennummern Navigation */
+.s-res-page-navigation {
+    display: flex;
+    gap: 0.25rem;
+}
+
+.s-res-page-btn {
+    background-color: #ffffff;
+    border: 1px solid #cbd5e1;
+    color: #4a5568;
+    padding: 0.35rem 0.75rem;
+    font-size: 0.9rem;
+    font-weight: 500;
+    border-radius: 4px;
+    cursor: pointer;
+    transition: all 0.2s ease;
+}
+
+.s-res-page-btn:hover:not(:disabled) {
+    background-color: #f8f9fa;
+    border-color: #cbd5e1;
+    color: #2d3748;
+}
+
+.s-res-page-btn-active {
+    background-color: #3182ce;
+    border-color: #3182ce;
+    color: #ffffff;
+    cursor: default;
+}
+
+.s-res-page-btn:disabled {
+    background-color: #f1f5f9;
+    border-color: #e2e8f0;
+    color: #94a3b8;
+    cursor: not-allowed;
+}
+
+/* --- RESPONSIVE DESIGN (MOBILGERÄTE) --- */
+@media (max-width: 768px) {
+    .s-res-layout-grid {
+        grid-template-columns: 1fr; /* Stapelt Seitenleiste und Inhalt untereinander */
+        gap: 1.5rem;
+        margin: 1rem auto;
+    }
+    .s-res-pagination-footer {
+        flex-direction: column;
+        gap: 1rem;
+        align-items: flex-start;
+    }
+}
+

css/showArticle.css

@@ -1,118 +0,0 @@
-/* Container für den gesamten articleikel */
-.article-view-container {
-    box-sizing: border-box;
-    max-width: 900px; /* Angenehme Lesebreite für längere Texte */
-    margin: 3rem auto;
-    padding: 0 2rem;
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
-    color: #212529;
-    line-height: 1.6;
-}
-
-.article-view-container * {
-    box-sizing: border-box;
-}
-
-/* --- KOPFDATEN-BEREICH --- */
-.article-view-top-section {
-    margin-bottom: 2.5rem;
-    border-bottom: 1px solid #e2e8f0;
-    padding-bottom: 1.5rem;
-}
-
-/* Kategorie-Badge */
-.article-view-category {
-    display: inline-block;
-    background-color: #ebf8ff;
-    color: #2b6cb0;
-    font-size: 0.8rem;
-    font-weight: 700;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-    padding: 0.25rem 0.75rem;
-    border-radius: 4px;
-    margin-bottom: 0.75rem;
-}
-
-/* Hauptüberschrift */
-.article-view-title {
-    font-size: 2.5rem;
-    color: #1a202c;
-    line-height: 1.2;
-    margin: 0 0 0.75rem 0;
-    font-weight: 800;
-}
-
-/* Autoren-Zeile */
-.article-view-meta {
-    font-size: 0.95rem;
-    color: #4a5568;
-}
-
-.article-view-author strong {
-    color: #2d3748;
-}
-
-/* --- INHALT --- */
-.article-view-content {
-    margin-bottom: 3rem;
-}
-
-.article-view-body {
-    font-size: 1.125rem;
-    color: #2d3748;
-    white-space: pre-line;
-}
-
-/* --- TAG-BEREICH --- */
-.article-view-bottom-section {
-    border-top: 1px solid #e2e8f0;
-    padding-top: 1.5rem;
-    display: flex;
-    flex-direction: column;
-    gap: 0.5rem;
-}
-
-.article-view-tags-label {
-    font-size: 0.9rem;
-    font-weight: 600;
-    color: #718096;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-}
-
-.article-view-tags-list {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 0.5rem;
-}
-
-/* Einzelner Tag */
-.article-view-tag-item {
-    background-color: #f1f5f9;
-    color: #475569;
-    font-size: 0.85rem;
-    font-weight: 500;
-    padding: 0.35rem 0.75rem;
-    border-radius: 6px;
-    border: 1px solid #e2e8f0;
-    transition: background-color 0.2s, color 0.2s;
-}
-
-.article-view-tag-item:hover {
-    background-color: #e2e8f0;
-    color: #1e293b;
-    cursor: default;
-}
-
-/* Responsive Anpassungen unter 760px (für z.B. Smarticlephones) */
-@media (max-width: 760px) {
-    .article-view-container {
-        margin: 1.5rem auto;
-        padding: 0 1rem;
-    }
-
-    .article-view-title {
-        font-size: 1.85rem;
-    }
-}

includes/footer.php

@@ -1,5 +1,5 @@
 <footer>
-    <a href="impressum.php">Impressum</a>
+    <a href="index.php?pfad=impressum">Impressum</a>
-    <a href="datenschutz.php">Datenschutz</a>
+    <a href="index.php?pfad=datenschutz">Datenschutz</a>
-    <a href="nutzungsbedingungen.php">Nutzungsbedingungen</a>
+    <a href="index.php?pfad=nutzungsbedingungen">Nutzungsbedingungen</a>
 </footer>

includes/navbar.php

@@ -21,7 +21,6 @@ Globales Menü, wird via PHP später in alle Seiten eingebunden
         <li><a href="index.php?pfad=profile">Profil</a></li>
         <li><a href="index.php?pfad=login">Anmelden</a></li>
         <li><a href="index.php?pfad=register">Registrieren</a></li>
-        <li><a href="index.php?pfad=createArticle">Beitrag erstellen</a></li>
         <li>
             <label class="nav__mobile-label">Sprachen</label>
             <ul class="nav__mobile-submenu">
@@ -130,8 +129,7 @@ Globales Menü, wird via PHP später in alle Seiten eingebunden
             include_once 'search.php';
         ?>
         </div>
-	    <a href="index.php?pfad=login" class="nav__item nav__button">Anmelden</a>
+	    <a href = "index.php?pfad=login" class="nav__item nav__button">Anmelden</a>
-	    <a href="index.php?pfad=register" class="nav__item nav__button">Registrieren</a>
+	    <a href = "index.php?pfad=register" class="nav__item nav__button">Registrieren</a>
-        <a href="index.php?pfad=createArticle" class="nav__item nav__button">Beitrag erstellen</a>
     </div>
 </nav>

index.php

@@ -1,12 +1,3 @@
-
-<?php
-session_start();
-if (!isset($abs_path)) {
-    require_once "path.php";
-}
-require_once $abs_path . "/php/controller/index-controller.php";
-?>
-
 <!--
     Seite: Index der Lernplattform
     Funktion: Webseitengerüst, Anzeigen von Content
@@ -23,27 +14,26 @@ require_once $abs_path . "/php/controller/index-controller.php";
     <link rel="stylesheet" href="css/main.css">
     <link rel="stylesheet" href="css/navbar.css">
     <link rel="stylesheet" href="css/footer.css">
-    <link rel="stylesheet" href="css/createArticle.css">
+    <link rel="stylesheet" href="css/search-results.css">
-    <link rel="stylesheet" href="css/showArticle.css">
-    <link rel="stylesheet" href="css/message.css">
     <title>EduForge</title>
 </head>
 
 
 <body>
+
     <?php
-    include_once 'includes/navbar.php';
+	include_once 'includes/navbar.php';
 	//Dynamischer Inhalt:
     if (isset($_GET["pfad"])) {
-        if (file_exists($abs_path . '/content/' . $_GET["pfad"] . '.php')) {
+        if (file_exists('content/' . $_GET["pfad"] . '.php')) {
-            include_once $abs_path . '/content/' . $_GET["pfad"] . '.php';
+            include_once 'content/' . $_GET["pfad"] . '.php';
         } else {
-            include_once $abs_path . '/content/404.php';
+            include_once 'content/404.php';
         }
     } else {
-        include_once $abs_path . '/content/home.php';
+        include_once 'content/home.php';
     }
-    include_once $abs_path . '/includes/footer.php';
+    include_once 'includes/footer.php';
     ?>
 </body>
 

path.php

@@ -1,3 +0,0 @@
-<?php
-$abs_path = __DIR__;
-?>

php/controller/createArticle-controller.php

@@ -1,32 +0,0 @@
-<?php
-session_start();
-require_once '../model/LocalArticleManager.php';
-require_once '../model/ArticleManager.php';
-
-if ($_SERVER["REQUEST_METHOD"] === "POST") {
-    if(!isset($_POST["title"]) ||!isset($_POST["content"]) || !isset($_POST["category"])){
-        $_SESSION["message"] = "missing_parameters";
-        header("location: ../../index.php?pfad=createArticle");
-    } else {
-
-        $title = $_POST["title"];
-        $content = $_POST["content"];
-        $category = $_POST["category"];
-        $author = "max.mustermann"; // TODO: später aus Session den angemeldeten Nutzer beziehen.
-        $tags = $_POST["tags"];
-
-        try {
-            $articleManager = ArticleManager::getInstance();
-            $articleManager->addArticle($title, $content, $author, $category, $tags);
-        } catch (Exception $e){
-            $_SESSION["message"] = "internal_error";
-        }
-        $_SESSION["message"] = "new_article";
-        // Weiterleitung zur Homepage
-        header("location: ../../index.php");
-        exit();
-
-    }
-}
-
-?>

php/controller/home-controller.php

@@ -1,17 +0,0 @@
-<?php
-session_start();
-require_once 'php/model/Article.php';
-require_once 'php/model/ArticleManager.php';
-require_once 'php/model/LocalArticleManager.php';
-
-try {
-    $articleManager = ArticleManager::getInstance();
-    // Beziehen der Dummy-Beiträge aus dem ArticleManager:
-    $dummy1 = $articleManager->getArticle(1);
-    $dummy2 = $articleManager->getArticle(2);
-    $dummy3 = $articleManager->getArticle(3);
-} catch (Exception $e){
-    $_SESSION["message"] = "internal_error";
-    echo "Fehler aufgetreten: " . $e->getMessage();
-}
-?>

php/controller/index-controller.php

@@ -1,3 +0,0 @@
-<?php
-
-?>

php/controller/search-results-controller.php

@@ -0,0 +1,29 @@
+<?php
+session_start();
+require_once '../model/LocalArticleManager.php';
+require_once '../model/ArticleManager.php';
+
+if ($_SERVER["REQUEST_METHOD"] === "POST") {
+    if(!isset($_POST["search"])){
+        $_SESSION["message"] = "missing_parameters";
+        header("location: ../../index.php?pfad=search-results");
+    } else {
+
+        $search = $_POST["search"];
+
+        try {
+            $articleManager = ArticleManager::getInstance();
+            $articleManager->search($search); // TODO: Methode implementieren.
+        } catch (Exception $e){
+            $_SESSION["message"] = "internal_error";
+        }
+        $_SESSION["message"] = "new_search_results";
+        // TODO: Liste mit Artikeln in der Suchreihenfolge übertragen.
+        // Weiterleitung zur Suchergebnisanzeige
+        header("location: ../../index.php?pfad=search-results");
+        exit();
+
+    }
+}
+
+?>

php/controller/showArticle-controller.php

@@ -1,28 +0,0 @@
-<?php
-session_start();
-require_once 'php/model/Article.php';
-require_once 'php/model/ArticleManager.php';
-
-if (isset($_GET["id"])){
-    try {
-        $articleManager = ArticleManager::getInstance();
-        $article = $articleManager->getArticle($_GET["id"]);
-        if($article != null){
-            $title = $article->getTitle();
-            $content = $article->getContent();
-            $category = $article->getCategory();
-            $author = $article->getAuthor();
-            $tags = $article->getTags();
-        }else{
-            $_SESSION["message"] = "article_not_found";
-            echo "article_not_found";
-        }
-    } catch (Exception $e){
-        $_SESSION["message"] = "internal_error";
-        echo "Fehler aufgetreten: " . $e->getMessage();
-    }
-}else{
-    $_SESSION["message"] = "article_not_found";
-    echo "article_not_found";
-}
-?>

php/model/Article.php

@@ -1,137 +0,0 @@
-<?php
-/**
- * Klasse: Artikel
- * Diese Klasse stellt alle Daten eines Artikels (Beitrag) bereit
- *
- * @author Niklas Ortmann
- */
-class Article
-{
-    private $id;
-    private $title;
-    private $content;
-    private $author;
-    private $creationDate;
-    private $category;
-    private $tags;
-
-    /**
-     * Konstruktor
-     *
-     * @param $id integer ID des Beitrages
-     * @param $title string Titel des Beitrags
-     * @param $content string Inhalt des Beitrags
-     * @param $author string der Autor des des Beitrages NID
-     * @param $category string Kategorie des Beitrages
-     * @param $tags string optionale Schlagworte für eine bessere Suche
-     * @param $creationDate string Datum der Beitragserstellung
-     */
-    public function __construct(int $id, string $title, string $content, string $author, string $category, string $tags, string $creationDate)
-    {
-        $this->id = $id;
-        $this->title = $title;
-        $this->content = $content;
-        $this->author = $author;
-        $this->creationDate = $creationDate;
-        $this->category = $category;
-        $this->tags = $tags;
-    }
-
-    /**
-     * Gibt die ID eines Artikels zurück.
-     * @return int
-     */
-    public function getId(): int
-    {
-        return $this->id;
-    }
-
-    /**
-     * Gibt den Titel eines Artikels zurück.
-     * @return string
-     */
-    public function getTitle(): string
-    {
-        return $this->title;
-    }
-
-    /**
-     * Setzt den Titel eines Artikels
-     * @param $title
-     * @return void
-     */
-    public function setTitle($title)
-    {
-        $this->title = $title;
-    }
-
-    /**
-     * Gibt den Content eines Artikels zurück.
-     * TODO: Content muss noch definiert werden.
-     * @return string
-     */
-    public function getContent(): string
-    {
-        return $this->content;
-    }
-
-    /**
-     * Setzt den Content eines Artikels.
-     * TODO: Content muss noch definiert werden.
-     * @param $content
-     * @return void
-     */
-    public function setContent($content)
-    {
-        $this->content = $content;
-    }
-
-    /**
-     * Gibt den Autor eines Artikels zurück.
-     * @return string
-     */
-    public function getAuthor(): string
-    {
-        return $this->author;
-    }
-
-    /**
-     * Gibt das Veröffentlichungsdatum des Artikels zurück.
-     * @return string
-     */
-    public function getCreationDate(): string
-    {
-        return $this->creationDate;
-    }
-
-    /**
-     * Gibt die Kategorie eines Artikels zurück.
-     * @return string
-     */
-    public function getCategory(): string
-    {
-        return $this->category;
-    }
-
-    /**
-     * Gibt die Schlagworte eines Artikels zurück.
-     * @return string
-     */
-    public function getTags(): string
-    {
-        return $this->tags;
-    }
-
-    /**
-     * Setzt die Schlagworte eines Artikels.
-     * @param string $tags
-     */
-    public function setTags(string $tags)
-    {
-        $this->tags = $tags;
-    }
-
-
-
-}
-?>

php/model/ArticleManager.php

@@ -1,47 +0,0 @@
-<?php
-require_once 'LocalArticleManager.php';
-require_once 'Article.php';
-
-/**
- * Die Klasse beinhaltet alle Methoden für die Operation mit den Artikel-Daten.
- *
- * @author Niklas Ortmann
- */
-class ArticleManager extends LocalArticleManager
-{
-    public static function getInstance()
-    {
-        $articleManager = LocalArticleManager::getInstance(); // TODO: später durch DataBaseArticleManager ersetzen.
-
-        // Erstellen von Dummy-Beiträgen:
-        if($articleManager->getArticle(1) == null ){
-            $articleManager->addArticle(
-                "Satz des Pythagoras",
-                "Der Satz des Pythagoras wurde von dem griechischen Philosophen Pythagoras von Samos formuliert und im dritten Jahrhundert vor Christus veröffentlicht. In der beigefügten Abbildung sehen wir ein rechtwinkliges Dreieck...",
-                "max.mustermann",
-                "Mathe",
-                "Dreiecke, Dreiecksseiten berechnen"
-            );
-        }
-        if($articleManager->getArticle(2) == null ){
-            $articleManager->addArticle(
-                "Tunneleffekt",
-                "Der Tunneleffekt ist ein quantenmechanisches Phänomen, bei dem Teilchen...",
-                "max.mustermann",
-                "Physik",
-                "Quantenphysik, Energie"
-            );
-        }
-        if($articleManager->getArticle(3) == null ){
-            $articleManager->addArticle(
-                "Datenschutz vs Datensicherheit",
-                "Datenschutz ist in unserer digital vernetzten Welt allgegenwärtig...",
-                "max.mustermann",
-                "Informatik",
-                "Daten, DSGVO"
-            );
-        }
-
-        return $articleManager;
-    }
-}

php/model/ArticleManagerDAO.php

@@ -1,67 +0,0 @@
-<?php
-require_once "Article.php";
-/**
- * Die Klasse beinhaltet alle Methoden für die Operation mit den Artikel-Daten.
- *
- * @author Niklas Ortmann
- */
-interface ArticleManagerDAO
-{
-    /**
-     * Ein angemeldeter Nutzer erstellt einen neuen Beitrag.
-     * @param $title string Titel des Beitrags
-     * @param $content string Inhalt des Beitrags
-     * @param $author string der Autor des des Beitrages NID
-     * @param $category string Kategorie des Beitrages
-     * @param $tags string optionale Schlagworte für eine bessere Suche
-     *
-     * Mögliche Exceptions:
-     * TODO Fehlerbeschreibung hinzufügen & tags hinzufügen
-     */
-    public function addArticle($title, $content, $author, $category, $tags);
-
-    /**
-     * Ein angemeldeter Nutzer bearbeitet einen Beitrag.
-     * $id ID des Beitrags
-     * $title Titel des Beitrags
-     * $content Der Inhalt des Beitrags
-     * $author dem Author des des Beitrags (NID oder email)
-     *
-     * Mögliche Exceptions:
-     * TODO Fehlerbeschreibung hinzufügen
-     */
-    public function updateArticle($id, $title, $content, $author);
-
-    /*
-     * Ein angemeldeter Nutzer löscht einen seiner Beiträge.
-     * $id ID des Beitrags
-     * $title Titel des Beitrags
-     * $content Der Inhalt des Beitrags
-     * $author dem Author des des Beitrags (NID oder email)
-     *
-     * Mögliche Exceptions:
-     * TODO Fehlerbeschreibung hinzufügen
-     */
-    public function deleteArticle($id);
-
-    /**
-     * Beitrag aufrufen.
-     * $id ID des Beitrags
-     *
-     * @return Article
-     * Mögliche Exceptions:
-     * TODO Fehlerbeschreibung hinzufügen
-     */
-    public function getArticle($id);
-
-    /**
-     * Alle Beiträge aufrufen.
-     *
-     * Mögliche Exceptions:
-     * TODO Fehlerbeschreibung hinzufügen
-     */
-    public function getAllArticles();
-
-
-}
-?>

php/model/LocalArticleManager.php

@@ -1,101 +0,0 @@
-<?php
-require_once 'ArticleManagerDAO.php';
-require_once 'Article.php';
-/**
- * Klasse: Eine lokale Lösung des ArticleManagerDAO.
- * Schreibt zunächst Daten lokal in das Verzeichnis und kann diese wieder auslesen.
- *
- * @author Niklas Ortmann
- */
-class LocalArticleManager implements ArticleManagerDAO {
-
-    private $file;
-    private static $instance = null;
-
-    /**
-     * Konstruktor
-     */
-    public function __construct()
-    {
-        $this->file = __DIR__ . '/../../data/articles.json';
-    }
-
-    /**
-     * Gibt die LocalArticleManager-Instanz zurück.
-     * @return LocalArticleManager
-     */
-    public static function getInstance()
-    {
-        if (self::$instance == null) {
-            self::$instance = new LocalArticleManager();
-        }
-        return self::$instance;
-    }
-
-    /**
-     * Speichert alle Artikel/Beiträge in der Datei.
-     * @param $articles
-     * @return void
-     */
-    public function saveArticle($articles)
-    {
-        file_put_contents(
-            $this->file,
-            json_encode($articles, JSON_PRETTY_PRINT)
-        );
-    }
-
-    public function addArticle($title, $content, $author, $category, $tags)
-    {
-        $articles = $this->getAllArticles();
-
-        $articles[] = [
-            "id" => count($articles)+1,
-            "title" => $title,
-            "content" => $content,
-            "author" => $author,
-            "category" => $category,
-            "tags" => $tags,
-            "creationDate" => date("Y-m-d H:i:s")
-        ];
-
-        $this->saveArticle($articles);
-    }
-
-    public function updateArticle($id, $title, $content, $author)
-    {
-        // TODO: Implement updateArticle() method.
-    }
-
-    public function deleteArticle($id)
-    {
-        // TODO: Implement deleteArticle() method.
-    }
-
-    public function getArticle($id)
-    {
-        $articles = $this->getAllArticles();
-
-        foreach ($articles as $article) {
-            if (isset($article['id']) && $article['id'] == $id) {
-                return new Article(intval($article['id']), $article['title'], $article['content'], $article['author'], $article['category'], $article['tags'], $article['creationDate']);
-            }
-        }
-
-        return null;
-    }
-
-    public function getAllArticles(): array
-    {
-        if (!file_exists($this->file)) {
-            return [];
-        }
-
-        $json = file_get_contents($this->file);
-        $articles = json_decode($json, true);
-
-        return is_array($articles) ? $articles : [];
-    }
-
-}
-?>