90 lines
2.1 KiB
CSS
Executable File
90 lines
2.1 KiB
CSS
Executable File
/* Events page specific styles */
|
|
|
|
.events-page {
|
|
background: linear-gradient(135deg, var(--color-neutral-50) 0%, var(--color-neutral-100) 100%);
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.events-page .breadcrumb {
|
|
padding: var(--space-4) 0;
|
|
}
|
|
|
|
.events-page .event-card {
|
|
background: white;
|
|
border-radius: var(--radius-2xl);
|
|
overflow: hidden;
|
|
box-shadow: var(--shadow-lg);
|
|
transition: all var(--duration-slow) var(--ease-out);
|
|
border: 1px solid var(--color-neutral-200);
|
|
position: relative;
|
|
}
|
|
|
|
.events-page .event-card:hover {
|
|
transform: translateY(-8px) scale(1.02);
|
|
box-shadow: var(--shadow-2xl);
|
|
border-color: var(--color-primary-200);
|
|
}
|
|
|
|
.events-page .event-date-badge {
|
|
background: linear-gradient(135deg, var(--color-primary-100) 0%, var(--color-accent-100) 100%);
|
|
color: var(--color-primary-800);
|
|
font-weight: 700;
|
|
padding: var(--space-1) var(--space-3);
|
|
border-radius: var(--radius-full);
|
|
font-size: var(--text-xs);
|
|
}
|
|
|
|
.events-page .price-highlight {
|
|
color: var(--color-primary-600);
|
|
font-weight: 800;
|
|
}
|
|
|
|
.events-page .pagination {
|
|
margin-top: var(--space-12);
|
|
}
|
|
|
|
.events-page .pagination .page,
|
|
.events-page .pagination .next,
|
|
.events-page .pagination .last,
|
|
.events-page .pagination .prev,
|
|
.events-page .pagination .first {
|
|
padding: var(--space-2) var(--space-4);
|
|
border-radius: var(--radius-lg);
|
|
margin: 0 var(--space-1);
|
|
transition: all var(--duration-normal);
|
|
}
|
|
|
|
.events-page .pagination .page:hover,
|
|
.events-page .pagination .next:hover,
|
|
.events-page .pagination .last:hover,
|
|
.events-page .pagination .prev:hover,
|
|
.events-page .pagination .first:hover {
|
|
background: var(--color-primary-100);
|
|
color: var(--color-primary-700);
|
|
}
|
|
|
|
.events-page .pagination .current {
|
|
background: var(--color-primary-600);
|
|
color: white;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.events-page .no-events-card {
|
|
background: white;
|
|
border-radius: var(--radius-2xl);
|
|
padding: var(--space-12);
|
|
box-shadow: var(--shadow-lg);
|
|
text-align: center;
|
|
max-width: 500px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.events-page .event-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.events-page .no-events-card {
|
|
padding: var(--space-8);
|
|
}
|
|
} |