pacnpal/thrillwiki_django_no_react
1
1
Fork 0
mirror of https://github.com/pacnpal/thrillwiki_django_no_react.git synced 2025-12-20 03:51:09 -05:00
Code Issues Packages Projects Releases Wiki Activity

Improve park detail page layout and ride display

Browse Source 
Adds responsive grid column classes to Tailwind CSS and updates the park detail template to use a new custom component for displaying rides, removing direct links for property owner names.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 0bdea3fb-49ea-4863-b501-fa6f5af0cbf0
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
This commit is contained in:
pac7
2025-09-22 14:40:47 +00:00
parent 0ee6e8c820
commit 30997cb615
3 changed files with 24 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.replit
View File

@@ -54,6 +54,10 @@ outputType = "webview"
localPort = 5000
externalPort = 80
[[ports]]
localPort = 35687
externalPort = 3002
[[ports]]
localPort = 41923
externalPort = 3000

15
static/css/tailwind.css
View File

@@ -3228,6 +3228,11 @@
flex: 1;
}
}
.sm\:grid-cols-1 {
@media (width >= 40rem) {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
}
.sm\:grid-cols-2 {
@media (width >= 40rem) {
grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -3474,6 +3479,11 @@
max-width: var(--container-2xl);
}
}
.lg\:grid-cols-1 {
@media (width >= 64rem) {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
}
.lg\:grid-cols-2 {
@media (width >= 64rem) {
grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -3610,6 +3620,11 @@
max-height: calc(100vh - 2rem);
}
}
.xl\:grid-cols-2 {
@media (width >= 80rem) {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.xl\:grid-cols-3 {
@media (width >= 80rem) {
grid-template-columns: repeat(3, minmax(0, 1fr));

23
templates/parks/park_detail.html
View File

@@ -1,6 +1,7 @@
{% extends "base/base.html" %}
{% load static %}
{% load park_tags %}
{% load cotton %}
{% block title %}{{ park.name }} - ThrillWiki{% endblock %}
@@ -77,10 +78,9 @@
<div class="text-center">
<dt class="text-sm font-semibold text-gray-900 dark:text-white">Property Owner</dt>
<dd class="mt-1">
<a href="{% url 'property_owners:property_owner_detail' park.property_owner.slug %}"
class="text-sm font-bold text-sky-900 dark:text-sky-400 hover:text-sky-800 dark:hover:text-sky-300">
<span class="text-sm font-bold text-sky-900 dark:text-sky-400">
{{ park.property_owner.name }}
</a>
</span>
</dd>
</div>
</div>
@@ -169,22 +169,9 @@
</a>
</div>
{% if park.rides.exists %}
<div class="grid gap-4 md:grid-cols-2">
<div class="grid gap-6 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-1 xl:grid-cols-2">
{% for ride in park.rides.all|slice:":6" %}
<div class="p-4 transition-colors rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700">
<a href="{% url 'parks:rides:ride_detail' park.slug ride.slug %}" class="block">
<h3 class="mb-1 font-semibold text-gray-900 dark:text-white">{{ ride.name }}</h3>
<span class="text-blue-800 bg-blue-100 status-badge dark:bg-blue-700 dark:text-blue-50">
{{ ride.get_category_display }}
</span>
{% if ride.average_rating %}
<span class="flex items-center text-yellow-800 bg-yellow-100 status-badge dark:bg-yellow-600 dark:text-yellow-50">
<span class="mr-1 text-yellow-500 dark:text-yellow-200">★</span>
{{ ride.average_rating|floatformat:1 }}/10
</span>
{% endif %}
</a>
</div>
<c-ride_card ride=ride url_variant="park" />
{% endfor %}
</div>
{% else %}