Anzeigebreite auf schmalen Bildschirmen angepasst

2024-11-19 14:52:39 +01:00
parent bd173d296d
commit 2a0f3b46d4
4 changed files with 5 additions and 19 deletions
--- a/webseite/assets/css/subject.css
+++ b/webseite/assets/css/subject.css
@@ -203,7 +203,6 @@ body {
    justify-content: center;
    gap: 0.5rem;
    transform: translateY(0);  /* Set initial transform state */
-    transition: all 0.2s ease;
 }

 .download-btn:hover {
@@ -323,22 +322,6 @@ body {
    flex-wrap: wrap;
 }

-.download-btn {
-    color: white;
-    padding: 0.75rem 1.25rem;
-    border-radius: 10px;
-    text-decoration: none;
-    font-size: 0.9rem;
-    transition: all 0.2s ease;
-    backdrop-filter: blur(5px);
-    flex: 1;
-    min-width: 120px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: 0.5rem;
-}
-
 .download-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
--- a/webseite/assets/css/topic.css
+++ b/webseite/assets/css/topic.css
@@ -174,6 +174,7 @@ body {

    .main-content {
        margin-left: 0;
+        padding: 1rem;
    }
 }

--- a/webseite/subject.php
+++ b/webseite/subject.php
@@ -53,8 +53,8 @@ $topics = $subjectData->topics;
           oninput="handleSearch()">
 </div>

-<div class="main-content max-w-7xl">
-    <div class="container">
+<div class="main-content">
+    <div class="max-w-7xl mx-auto px-4 py-12 grid grid-cols-1 md:grid-cols-2 2xl:grid-cols-3 gap-8 mb-8">

        <?php

--- a/webseite/topic.php
+++ b/webseite/topic.php
@@ -34,9 +34,11 @@ if (!isset($topicData)) {
    <script src="assets/js/sidebar.js"></script>
 </head>
 <body>
+
 <button class="menu-toggle fixed top-4 left-4 z-50 bg-white h-12 w-12 border-2 p-1 hover:border-[<?php echo($subjectData->color); ?>]">
    <i class="fas fa-bars"></i>
 </button>
+
 <!-- Left Sidebar -->
 <nav class="sidebar bg-[<?php echo($subjectData->color); ?>]">
    <div class="sidebar-header">