kbe/aperonight
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity
Files
30f3ecc6ad6166415d7a4042c6e87d1d6367a036
aperonight/app/views/pages/events.html.erb
Kevin BATAILLE 30f3ecc6ad refactor(events): replace parties concept with events throughout the application 
Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>

This commit refactors the entire application to replace the 'parties' concept with 'events'. All controllers, models, views, and related files have been updated to reflect this change. The parties table has been replaced with an events table, and all related functionality has been updated accordingly.
2025-08-28 13:20:51 +02:00

217 lines
12 KiB
Plaintext
Executable File
Raw Blame History

<% content_for :title, "All Events - Aperonight" %>
<div class="section">
<div class="container">
<div class="section-header">
<h1 class="section-title">All Events</h1>
<p class="section-description">Discover all our upcoming afterwork events tailored to your interests.</p>
</div>
<div class="events-filter-bar" style="display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-8); flex-wrap: wrap; gap: var(--space-4);">
<div class="search-box" style="flex: 1; max-width: 400px;">
<input type="text" class="form-input search-input" placeholder="Search events...">
<i data-lucide="search" class="search-icon"></i>
</div>
<div style="display: flex; gap: var(--space-3);">
<select class="form-select" style="min-width: 150px;">
<option>All Categories</option>
<option>Networking</option>
<option>Tech & Innovation</option>
<option>Creative & Design</option>
<option>Business</option>
<option>Wine & Tasting</option>
</select>
<select class="form-select" style="min-width: 120px;">
<option>Any Price</option>
<option>Free</option>
<option>Under €30</option>
<option>€30 - €60</option>
<option>Over €60</option>
</select>
</div>
</div>
<div class="events-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--space-6);">
<!-- Event 1 -->
<div class="event-card hover-glow">
<img src="https://images.unsplash.com/photo-1540039155733-5bb30b53aa14?w=400&h=200&fit=crop" alt="Tech Networking Night" style="width: 100%; height: 200px; object-fit: cover;">
<div style="padding: var(--space-5);">
<div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-3);">
<h3 style="font-family: var(--font-display); font-size: var(--text-lg); font-weight: 700; margin: 0;">Tech & Innovation Networking Night</h3>
<span class="badge badge-featured">★ Featured</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="calendar" style="width: 16px; height: 16px;"></i>
<span>Thu, Mar 15 • 18:30</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="map-pin" style="width: 16px; height: 16px;"></i>
<span>Le Perchoir Marais, Paris</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center;">
<span class="price-tag price-tag-md">€35</span>
<button class="btn btn-sm btn-primary">Reserve Spot</button>
</div>
</div>
</div>
<!-- Event 2 -->
<div class="event-card hover-glow">
<img src="https://images.unsplash.com/photo-1574391884720-bbc3740c59d1?w=400&h=200&fit=crop" alt="Creative Afterwork" style="width: 100%; height: 200px; object-fit: cover;">
<div style="padding: var(--space-5);">
<div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-3);">
<h3 style="font-family: var(--font-display); font-size: var(--text-lg); font-weight: 700; margin: 0;">Creative Directors Exclusive Meetup</h3>
<span class="badge badge-vip">VIP</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="calendar" style="width: 16px; height: 16px;"></i>
<span>Fri, Mar 16 • 19:00</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="map-pin" style="width: 16px; height: 16px;"></i>
<span>Atelier Des Lumières, Paris</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center;">
<span class="price-tag price-tag-md">€65</span>
<button class="btn btn-sm btn-primary">Join VIP</button>
</div>
</div>
</div>
<!-- Event 3 -->
<div class="event-card hover-glow">
<img src="https://images.unsplash.com/photo-1569949381669-ecf31ae8e613?w=400&h=200&fit=crop" alt="Wine Tasting" style="width: 100%; height: 200px; object-fit: cover;">
<div style="padding: var(--space-5);">
<div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-3);">
<h3 style="font-family: var(--font-display); font-size: var(--text-lg); font-weight: 700; margin: 0;">Wine & Business Premium Tasting</h3>
<span class="badge badge-available">Available</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="calendar" style="width: 16px; height: 16px;"></i>
<span>Sat, Mar 18 • 17:00</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="map-pin" style="width: 16px; height: 16px;"></i>
<span>Cave Legrand, Paris</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center;">
<span class="price-tag price-tag-md">€55</span>
<button class="btn btn-sm btn-secondary">Book Now</button>
</div>
</div>
</div>
<!-- Event 4 -->
<div class="event-card hover-glow">
<img src="https://images.unsplash.com/photo-1511795409834-ef04bbd61622?w=400&h=200&fit=crop" alt="Startup Pitch Night" style="width: 100%; height: 200px; object-fit: cover;">
<div style="padding: var(--space-5);">
<div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-3);">
<h3 style="font-family: var(--font-display); font-size: var(--text-lg); font-weight: 700; margin: 0;">Startup Pitch Night</h3>
<span class="badge badge-limited">Limited</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="calendar" style="width: 16px; height: 16px;"></i>
<span>Mon, Mar 20 • 18:00</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="map-pin" style="width: 16px; height: 16px;"></i>
<span>Station F, Paris</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center;">
<span class="price-tag price-tag-md">€25</span>
<button class="btn btn-sm btn-primary">Reserve Spot</button>
</div>
</div>
</div>
<!-- Event 5 -->
<div class="event-card hover-glow">
<img src="https://images.unsplash.com/photo-1470225620780-dba8ba36b745?w=400&h=200&fit=crop" alt="Jazz & Cocktails" style="width: 100%; height: 200px; object-fit: cover;">
<div style="padding: var(--space-5);">
<div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-3);">
<h3 style="font-family: var(--font-display); font-size: var(--text-lg); font-weight: 700; margin: 0;">Jazz & Cocktails Evening</h3>
<span class="badge badge-available">Available</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="calendar" style="width: 16px; height: 16px;"></i>
<span>Wed, Mar 22 • 20:00</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="map-pin" style="width: 16px; height: 16px;"></i>
<span>Blue Note, Paris</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center;">
<span class="price-tag price-tag-md">€40</span>
<button class="btn btn-sm btn-secondary">Book Now</button>
</div>
</div>
</div>
<!-- Event 6 -->
<div class="event-card hover-glow">
<img src="https://images.unsplash.com/photo-1511795409834-ef04bbd61622?w=400&h=200&fit=crop" alt="Art & Wine" style="width: 100%; height: 200px; object-fit: cover;">
<div style="padding: var(--space-5);">
<div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-3);">
<h3 style="font-family: var(--font-display); font-size: var(--text-lg); font-weight: 700; margin: 0;">Art & Wine Gallery Night</h3>
<span class="badge badge-featured">★ Featured</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="calendar" style="width: 16px; height: 16px;"></i>
<span>Fri, Mar 24 • 19:30</span>
</div>
<div style="display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); color: var(--color-neutral-600); font-size: var(--text-sm);">
<i data-lucide="map-pin" style="width: 16px; height: 16px;"></i>
<span>Gallery Lafayette, Paris</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center;">
<span class="price-tag price-tag-md">€30</span>
<button class="btn btn-sm btn-primary">Reserve Spot</button>
</div>
</div>
</div>
</div>
<div style="display: flex; justify-content: center; margin-top: var(--space-8);">
<nav style="display: flex; gap: var(--space-2);">
<a href="#" class="btn btn-outline" style="padding: var(--space-2) var(--space-4);">Previous</a>
<a href="#" class="btn btn-primary" style="padding: var(--space-2) var(--space-4);">1</a>
<a href="#" class="btn btn-outline" style="padding: var(--space-2) var(--space-4);">2</a>
<a href="#" class="btn btn-outline" style="padding: var(--space-2) var(--space-4);">3</a>
<a href="#" class="btn btn-outline" style="padding: var(--space-2) var(--space-4);">Next</a>
</nav>
</div>
</div>
</div>
<style>
.events-filter-bar .search-input {
padding-left: var(--space-12);
}
.events-filter-bar .search-icon {
position: absolute;
left: var(--space-4);
top: 50%;
transform: translateY(-50%);
color: var(--color-neutral-400);
}
.events-filter-bar {
position: relative;
}
@media (max-width: 768px) {
.events-filter-bar {
flex-direction: column;
align-items: stretch;
}
.events-filter-bar .search-box {
max-width: none;
}
.events-filter-bar > div {
width: 100%;
}
}
</style>
Reference in New Issue View Git Blame Copy Permalink