fix(frontend): long page size on admin view and z-index issue on voting page

This commit is contained in:
2026-06-26 01:31:17 +02:00
parent 6a363a7f1a
commit dc192e8511
5 changed files with 35 additions and 11 deletions
+5 -1
View File
@@ -33,7 +33,7 @@
transform: rotate(180deg); transform: rotate(180deg);
} }
.select-dropdown { .search-select .select-dropdown.panel {
position: absolute; position: absolute;
top: calc(100% + 0.5rem); top: calc(100% + 0.5rem);
left: 0; left: 0;
@@ -44,6 +44,10 @@
max-height: 300px; max-height: 300px;
overflow: hidden; overflow: hidden;
padding: 0; padding: 0;
background: rgba(8, 14, 20, 0.88) !important;
backdrop-filter: blur(24px) !important;
-webkit-backdrop-filter: blur(24px) !important;
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.6);
} }
.search-box { .search-box {
-6
View File
@@ -100,12 +100,6 @@ a {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 1.5rem; gap: 1.5rem;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.category-card:hover {
transform: translateY(-2px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
} }
.category-title { .category-title {
+25 -1
View File
@@ -183,6 +183,26 @@
color: var(--teal); color: var(--teal);
} }
.admin-table-container {
height: 350px;
overflow-y: auto;
}
/* Custom Scrollbar for the table */
.admin-table-container::-webkit-scrollbar {
width: 8px;
}
.admin-table-container::-webkit-scrollbar-track {
background: rgba(0, 0, 0, 0.2);
}
.admin-table-container::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.1);
border-radius: 4px;
}
.admin-table-container::-webkit-scrollbar-thumb:hover {
background: rgba(255, 255, 255, 0.2);
}
.admin-table { .admin-table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
@@ -196,9 +216,13 @@
} }
.admin-table th { .admin-table th {
background: rgba(255, 255, 255, 0.02); background: rgba(20, 26, 33, 0.95);
color: var(--text-muted); color: var(--text-muted);
font-weight: 500; font-weight: 500;
position: sticky;
top: 0;
z-index: 10;
backdrop-filter: blur(8px);
} }
.admin-table tr:hover td { .admin-table tr:hover td {
+2
View File
@@ -294,6 +294,7 @@ export default function AdminPage() {
</button> </button>
</div> </div>
</div> </div>
<div className="admin-table-container">
<table className="admin-table"> <table className="admin-table">
<thead> <thead>
<tr> <tr>
@@ -362,6 +363,7 @@ export default function AdminPage() {
</tbody> </tbody>
</table> </table>
</div> </div>
</div>
); );
})} })}
</div> </div>
+2 -2
View File
@@ -123,7 +123,7 @@ export default function VotingPage() {
<p className="page-subtitle">Wähle deinen Favoriten in jeder Kategorie.</p> <p className="page-subtitle">Wähle deinen Favoriten in jeder Kategorie.</p>
<div className="categories-grid"> <div className="categories-grid">
{categories.map(cat => { {categories.map((cat, index) => {
const catOptions = options const catOptions = options
.filter(o => o.Category === cat) .filter(o => o.Category === cat)
.map(o => ({ value: o.ID, label: o.Name })); .map(o => ({ value: o.ID, label: o.Name }));
@@ -131,7 +131,7 @@ export default function VotingPage() {
const isSubmitted = submitted[cat]; const isSubmitted = submitted[cat];
return ( return (
<div key={cat} className="category-card panel"> <div key={cat} className="category-card panel" style={{ position: 'relative', zIndex: categories.length - index }}>
<h3 className="category-title">{cat}</h3> <h3 className="category-title">{cat}</h3>
<div className="category-content"> <div className="category-content">