calum
/
drulum
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

Updated templates for articles app to include tailwind styling.

pull/1/head
Calum Andrew Morrell 2025-05-05 19:44:42 +01:00
parent b50d44530d
commit 651d0de029
6 changed files with 48 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
articles/templates/articles/article_detail.html
View File

@ -1,33 +1,28 @@
{% extends 'base.html' %}
{% block content %}
<article>
<h3>{{ article.title }}</h3>
<article class="max-w-5xl mx-auto my-4 px-8">
<h3 class="text-6xl font-extrabold">{{ article.title }}</h3>
{% if article.subtitle %}
<h5>{{ article.subtitle }}</h5>
<h5 class="text-4xl italic font-medium">{{ article.subtitle }}</h5>
{% endif %}
<p>Added on the {{ article.created|date:'jS \o\f F, Y' }}
<p class="text-sm">Added on the {{ article.created | date:'jS \o\f F, Y' }}
{% if article.created.date != article.updated.date %}
and updated on the {{ article.updated|date:'jS \o\f F, Y' }}
and updated on the {{ article.updated | date:'jS \o\f F, Y' }}
{% endif %}
</p>
<hr>
<hr class="my-2">
{% if article.introduction %}
<p>{{ article.introduction|linebreaksbr }}</p>
<hr>
<p class="text-justify italic">{{ article.introduction|linebreaksbr }}</p>
<hr class="my-2">
{% endif %}
<div>
<div class="prose md:prose-lg lg:prose-xl max-w-none prose-img:rounded-2xl">
{{ article.body_as_markdown|safe }}
</div>
<hr>
<div>
<span>Posted in the <a
href="{% url 'articles:list_category' category=article.category.slug %}">{{ article.category }}</a> category</span>
<span>
{% for tag in article.tags.all %}
<a href="{{ tag.get_absolute_url }}">{{ tag }}</a>{% if tag != article.tags.last %},{% endif %}
{% endfor %}
</span>
<hr class="my-2">
<div class="flex justify-between text-neutral-400">
<span>Posted in the <a class="hover:text-red-400" href="{% url 'articles:list_category' category=article.category.slug %}">{{ article.category }}</a> category</span>
{# <span>{% include 'articles/includes/display_tags.html' %}</span>#}
</div>
</article>
{% endblock %}

48
articles/templates/articles/article_list.html
View File

@ -4,51 +4,45 @@
<main>
{% if object_list %}
{% if category %}
<h3>{{ category }} Articles</h3>
<h3 class="text-xl sm:text-4xl lg:text-6xl my-4 text-center">{{ category }} Articles</h3>
{% if category.introduction %}
<div>
<p>{{ category.introduction }}</p>
<div class="flex justify-center mb-4">
<p class="sm:w-1/2 lg:w-1/3 mx-8 text-justify">{{ category.introduction }}</p>
</div>
{% endif %}
{% elif tag %}
<h3>Articles for tag: {{ tag }}</h3>
<h3 class="text-xl sm:text-4xl lg:text-6xl my-4 text-center">Articles for tag: {{ tag }}</h3>
{% else %}
<h3>Recent Articles</h3>
<h3 class="text-xl sm:text-4xl lg:text-6xl my-4 text-center">Recent Articles</h3>
{% endif %}
<hr>
<div>
<hr class="mx-8">
<div class="grid gap-12 grid-cols-1 md:grid-cols-2 lg:grid-cols-3 m-8">
{% for article in object_list %}
<div>
<a href="{{ article.get_absolute_url }}">{{ article.title }}</a>
<div class="pb-8 break-inside-avoid-column">
<a class="text-3xl font-semibold hover:text-red-400" href="{{ article.get_absolute_url }}">{{ article.title }}</a>
{% if article.subtitle %}
<h5>{{ article.subtitle }}</h5>
<h5 class="text-xl italic font-medium">{{ article.subtitle }}</h5>
{% endif %}
{% if article.introduction %}
<hr>
<p>{{ article.introduction|linebreaksbr }}</p>
<hr class="my-2">
<p class="text-justify">{{ article.introduction|linebreaksbr }}</p>
{% endif %}
<hr>
<div>
<hr class="my-2">
<div class="flex justify-between text-neutral-400">
<span>
<a href="{% url 'articles:list_category' category=article.category.slug %}">{{ article.category }} </a>
&bull; {{ article.created|date:'jS \o\f F, Y' }}
</span>
<span>
{% for tag in article.tags.all %}
<a href="{{ tag.get_absolute_url }}">{{ tag }}</a>{% if tag != article.tags.last %},
{% endif %}
{% endfor %}
<a class="hover:text-red-400" href="{% url 'articles:list_category' category=article.category.slug %}">{{ article.category }} </a>
&bull; {{ article.created | date:'jS \o\f F, Y' }}
</span>
<span>{% include 'articles/includes/display_tags.html' %}</span>
</div>
</div>
{% endfor %}
</div>
{% else %}
<div>
<h3>Oops!</h3>
<h5>It looks like there are no articles for that {% if category %}category{% elif tag %} tag{% endif %}
yet.</h5>
<p>(sorry not sorry)</p>
<div class="text-center m-8">
<h3 class="text-4xl mb-4">Oops!</h3>
<h5 class="text-lg">It looks like there are no articles for that {% if category %}category{% elif tag %}tag{% endif %} yet.</h5>
<p class="text-neutral-400">(sorry not sorry)</p>
</div>
{% endif %}
{% if page_obj.has_previous or page_obj.has_next %}

12
articles/templates/articles/category_list.html
View File

@ -3,15 +3,15 @@
{% block content %}
<main>
{% if object_list %}
<h3>Category List</h3>
<hr>
<ul>
<h3 class="text-6xl my-4 text-center">Category List</h3>
<hr class="mx-8">
<ul class="grid gap-12 grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 m-8">
{% for category in object_list %}
<li>
<a href="{{ category.get_absolute_url }}">{{ category.title }}</a>
<a class="text-2xl font-semibold hover:text-red-400" href="{{ category.get_absolute_url }}">{{ category.title }}</a>
{% if category.introduction %}
<hr>
<p>{{ category.introduction }}</p>
<hr class="my-2">
<p class="text-justify">{{ category.introduction }}</p>
{% endif %}
</li>
{% endfor %}

3
articles/templates/articles/includes/display_tags.html Normal file
View File

@ -0,0 +1,3 @@
{% for tag in article.tags.all %}
<a href="{{ tag.get_absolute_url }}">{{ tag }}</a>{% if tag != article.tags.last %},{% endif %}
{% endfor %}

8
articles/templates/articles/tag_list.html
View File

@ -3,12 +3,12 @@
{% block content %}
<main>
{% if object_list %}
<h3>List of Tags</h3>
<hr>
<ul>
<h3 class="text-6xl my-4 text-center">List of Tags</h3>
<hr class="mx-8">
<ul class="grid gap-12 grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 m-8">
{% for tag in object_list %}
<li>
<a href="{{ tag.get_absolute_url }}">{{ tag }}</a>
<a class="text-2xl font-semibold hover:text-red-400" href="{{ tag.get_absolute_url }}">{{ tag }}</a>
</li>
{% endfor %}
</ul>

2
core/templates/core/homepage.html
View File

@ -36,7 +36,7 @@
href="{% url 'articles:list_category' category=article.category.slug %}">{{ article.category }} </a>
&bull; {{ article.created | date:'jS \o\f F, Y' }}
</span>
{# <span>{% include 'articles/includes/display_tags.html' %}</span>#}
<span>{% include 'articles/includes/display_tags.html' %}</span>
</div>
</div>
{% endfor %}