Uni/dps-webshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Minor chnages

Browse Source
This commit is contained in:
FlorianSpeicher
2025-05-21 22:25:48 +02:00
parent cc493b29ac
commit 18ccd78dcc
2 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
01-frontend/src/pages/Home.tsx
View File

@@ -155,12 +155,12 @@ export default function Home() {
// Dynamische Berechnung der Anzahl der Items pro Seite basierend auf der Fensterbreite // Dynamische Berechnung der Anzahl der Items pro Seite basierend auf der Fensterbreite
const calculateItemsPerPage = () => { const calculateItemsPerPage = () => {
const cardHeight = 250; // Höhe einer Karte (inkl. Margin/Padding) const cardHeight = 220; // Höhe einer Karte (inkl. Margin/Padding)
const paginationHeight = 50; // Höhe der Pagination const paginationHeight = 60; // Höhe der Pagination
const availableHeight = window.innerHeight - paginationHeight - 60; // Verfügbare Höhe (inkl. Padding) const availableHeight = window.innerHeight - paginationHeight - 60; // Verfügbare Höhe (inkl. Padding)
const itemsPerRow = Math.floor(window.innerWidth / 220); // Karten pro Zeile (220px Breite inkl. Margin) const itemsPerRow = Math.floor(window.innerWidth / 220); // Karten pro Zeile (220px Breite inkl. Margin)
const rows = Math.floor(availableHeight / cardHeight); // Maximale Anzahl an vollständigen Reihen const rows = Math.floor(availableHeight / cardHeight); // Maximale Anzahl an vollständigen Reihen
return itemsPerRow * rows; return itemsPerRow * rows;
}; };
return ( return (

2
01-frontend/src/pages/pages.css
View File

@@ -49,7 +49,7 @@
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* Dynamische Spalten */ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* Dynamische Spalten */
padding: 16px; padding: 16px;
margin: 0 auto; margin: 0 auto;
max-height: calc(100vh - 300px); /* Dynamische Höhe, abhängig von der Pagination */ max-height: calc(100vh - 100px); /* Dynamische Höhe, abhängig von der Pagination */
box-sizing: border-box; /* Stellt sicher, dass Padding in die Breite einbezogen wird */ box-sizing: border-box; /* Stellt sicher, dass Padding in die Breite einbezogen wird */
} }