55 lines
1.9 KiB
Plaintext
55 lines
1.9 KiB
Plaintext
<%- include('partials/header', { title }) %>
|
|
|
|
<section class="hero pad-hero">
|
|
<div class="hero-body">
|
|
<p class="title">Find the right fit</p>
|
|
<p class="subtitle">
|
|
Browse pads, compare comfort, and share honest reviews with photos.
|
|
</p>
|
|
<% if (currentUser && currentUser.is_approved) { %>
|
|
<a class="button is-primary is-large" href="/pads/new">Add a pad</a>
|
|
<% } else if (currentUser) { %>
|
|
<p class="has-text-weight-semibold">Your account is pending approval.</p>
|
|
<% } else { %>
|
|
<a class="button is-link is-medium" href="/login">Log in to start your list</a>
|
|
<% } %>
|
|
</div>
|
|
</section>
|
|
|
|
<% if (pads.length === 0) { %>
|
|
<div class="notification is-light">
|
|
No pads yet. Be the first to add one.
|
|
</div>
|
|
<% } %>
|
|
|
|
<div class="columns is-multiline">
|
|
<% pads.forEach((pad) => { %>
|
|
<div class="column is-4">
|
|
<div class="card pad-card">
|
|
<div class="card-content">
|
|
<p class="title is-5"><%= pad.name %></p>
|
|
<p class="subtitle is-6"><%= pad.brand || 'Independent' %></p>
|
|
<p class="content"><%= pad.description || 'No description yet.' %></p>
|
|
<% if (pad.fit && pad.comfort && pad.absorbency) { %>
|
|
<% const avg = (pad.fit + pad.comfort + pad.absorbency) / 3; %>
|
|
<% const avgRounded = Math.round(avg); %>
|
|
<div class="star-display" aria-label="Average rating">
|
|
<% for (let i = 1; i <= 5; i++) { %>
|
|
<span class="star <%= i <= avgRounded ? 'is-filled' : '' %>">★</span>
|
|
<% } %>
|
|
<span class="has-text-grey ml-2"><%= avg.toFixed(1) %>/5</span>
|
|
</div>
|
|
<% } else { %>
|
|
<p class="has-text-grey">No rating yet.</p>
|
|
<% } %>
|
|
</div>
|
|
<div class="card-footer">
|
|
<a class="card-footer-item" href="/pads/<%= pad.id %>">View ratings</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% }) %>
|
|
</div>
|
|
|
|
<%- include('partials/footer') %>
|