tonyassi's picture
Update templates/home.html
84782e7 verified
<!DOCTYPE html>
<html>
<head>
<title>Fashion Library</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<style>
body { text-align: center; margin: 60px auto; font-family: Arial; }
h1 { font-size: 36px; margin-bottom: 20px; }
form { margin-bottom: 20px; }
input[type="text"] {
padding: 10px;
width: 300px;
font-size: 16px;
border-radius: 6px;
border: 1px solid #ccc;
}
button {
padding: 10px 20px;
font-size: 16px;
border: none;
background-color: black;
color: white;
border-radius: 6px;
cursor: pointer;
margin-left: 10px;
}
.suggestions { margin-top: 20px; }
.suggestions p { font-size: 18px; }
.suggestions ul { list-style: none; padding: 0; }
.suggestions li { margin: 5px 0; }
</style>
</head>
<body>
<h1>Fashion Library</h1>
<p style="font-style: italic; color: #666;">1,749 Designers | 25,876 Collections | 934,735 Images</p>
<form method="GET">
<input type="text" name="designer" placeholder="Search for a designer..." value="{{ query }}">
<button type="submit">Search</button>
</form>
{% if suggestions %}
<div class="suggestions">
<p>No exact match. Did you mean:</p>
<ul>
{% for name in suggestions %}
<li><a href="/{{ name | replace(' ', '-') }}">{{ name }}</a></li>
{% endfor %}
</ul>
</div>
{% endif %}
<div class="button-row">
<a href="/all-designers" class="nav-button">All Designers</a>
<a href="/random-designers" class="nav-button">Explore Random Designers</a>
<a href="/random-shows" class="nav-button">Explore Random Shows</a>
</div>
<div class="grid" style="padding: 0 20px; margin-bottom: 40px;">
{% for d in designer_cards %}
<div class="card" onclick="window.location.href='/{{ d.slug }}'" style="cursor:pointer; text-align:center;">
<img src="{{ d.image_url }}" style="width:100%; border-radius:8px;">
<div style="margin-top: 8px; font-weight: 500;">{{ d.name }}</div>
</div>
{% endfor %}
</div>
<div class="grid" style="padding: 0 20px;">
{% for show in show_cards %}
<div class="card" onclick="window.location.href='{{ show.link }}'" style="cursor:pointer; text-align:center;">
<img src="{{ show.image_url }}" style="width:100%; border-radius:8px;">
<div style="margin-top: 8px; font-weight: 500;">{{ show.designer }}<br><span style="font-weight: 400;">{{ show.show }}</span></div>
</div>
{% endfor %}
</div>
</body>
</html>