Updated template files for the core website to include tailwind styling.
parent
f7f45160d6
commit
4c9b8d6c38
File diff suppressed because it is too large
Load Diff
|
|
@ -6,9 +6,9 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{% block title %}Drulum{% endblock %}</title>
|
||||
{# <link rel="stylesheet" href="{% static 'css/base.css' %}">#}
|
||||
<link rel="stylesheet" href="{% static 'css/base.css' %}">
|
||||
</head>
|
||||
<body>
|
||||
<body class="font-serif">
|
||||
{% block page %}
|
||||
{% block header %}{% include 'header.html' %}{% endblock %}
|
||||
{% block content %}{% endblock %}
|
||||
|
|
|
|||
|
|
@ -2,42 +2,41 @@
|
|||
|
||||
{% block content %}
|
||||
<main>
|
||||
<div>
|
||||
<h1>Oh my word, this is basic!</h1>
|
||||
<p>I got bored and decided to develop this site from scratch, again. See the <a
|
||||
href="{% url 'core:about-website' %}">About This Website</a> page if you're at all interested in
|
||||
what I'm doing and why. The short version is that I'll be developing features for the website as I
|
||||
create content for it. In other words, it's going to take a long time before it's <em>pretty</em>.</p>
|
||||
<p>Longer term this site will present my own photographs and photography tuition services along with
|
||||
articles on photography, philosophy, politics, health & mental health, and whatever else I feel
|
||||
like.</p>
|
||||
<div class="max-w-3xl mx-auto my-8">
|
||||
<h1 class="text-xl sm:text-4xl lg:text-6xl my-4 text-center">Oh my word, this is basic!</h1>
|
||||
<p class="text-justify mx-8">I got bored and decided to develop this site from scratch, again. See the <a
|
||||
class="hover:text-red-400" href="{% url 'core:about-website' %}">About This Website</a> page if
|
||||
you're at all interested in what I'm doing and why. The short version is that I'll be developing
|
||||
features for the website as I create content for it. In other words, it's going to take a long time
|
||||
before it's <em>pretty</em>.</p>
|
||||
<p class="text-justify mx-8 mt-4">Longer term this site will present my own photographs and photography
|
||||
tuition services along with articles on photography, philosophy, politics, health & mental health, and
|
||||
whatever else I feel like.</p>
|
||||
</div>
|
||||
<hr>
|
||||
<hr class="mx-8">
|
||||
{% if featured_articles %}
|
||||
<h1>Featured Articles</h1>
|
||||
<hr>
|
||||
<div>
|
||||
<h1 class="text-xl sm:text-4xl lg:text-6xl my-4 text-center">Featured Articles</h1>
|
||||
<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 featured_articles %}
|
||||
<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>• {{ 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>
|
||||
• {{ article.created | date:'jS \o\f F, Y' }}
|
||||
</span>
|
||||
{# <span>{% include 'articles/includes/display_tags.html' %}</span>#}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
<footer>
|
||||
<p>All content © Calum Andrew Morrell</p>
|
||||
<footer class="bg-blue-900 p-8 text-white font-mono">
|
||||
<p class="text-center">All content © Calum Andrew Morrell</p>
|
||||
</footer>
|
||||
|
|
@ -1,19 +1,32 @@
|
|||
<header>
|
||||
<div>
|
||||
<h3><a href="{% url 'core:homepage' %}">the digital home of</a></h3>
|
||||
<h1><a href="{% url 'core:homepage' %}">Calum Andrew Morrell</a></h1>
|
||||
<header class="grid grid-cols-1 md:grid-cols-[400px_1fr] md:gap-x-4 bg-blue-900 p-8 text-white">
|
||||
<div class="row-span-3">
|
||||
<h3 class="font-sans text-sm"><a href="{% url 'core:homepage' %}">the digital home of</a></h3>
|
||||
<h1 class="text-4xl font-bold"><a href="{% url 'core:homepage' %}">Calum Andrew Morrell</a></h1>
|
||||
{# <h2 class="font-mono">Photography · Writing · Audio · Video</h2>#}
|
||||
</div>
|
||||
<div>
|
||||
<nav>
|
||||
<a href="{% url 'core:about-me' %}">about me</a>
|
||||
<a href="{% url 'core:about-website' %}">about this website</a>
|
||||
<a href="{% url 'core:contact-me' %}">contact me</a>
|
||||
<div class="font-sans md:row-span-3 md:grid md:grid-cols-1">
|
||||
<nav class="flex gap-x-4 md:justify-end">
|
||||
<a class="{% if 'about-me' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400"
|
||||
href="{% url 'core:about-me' %}">about me</a>
|
||||
<a class="{% if 'about-website' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400"
|
||||
href="{% url 'core:about-website' %}">about this website</a>
|
||||
<a class="{% if 'contact-me' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400"
|
||||
href="{% url 'core:contact-me' %}">contact me</a>
|
||||
</nav>
|
||||
<nav>
|
||||
<a href="{% url 'core:homepage' %}">Home</a>
|
||||
{# <a href="#">Photography</a>#}
|
||||
<a href="{% url 'articles:list' %}">Articles</a>
|
||||
{# <a href="{% url 'articles:categories' %}">Categories</a>#}
|
||||
<nav class="flex gap-x-4 md:row-span-2 md:items-end text-lg">
|
||||
<a class="{% if request.path == '/' %}text-cyan-400 uppercase{% endif %} hover:text-red-400"
|
||||
href="{% url 'core:homepage' %}">Home</a>
|
||||
<a class="{% if 'articles' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400"
|
||||
href="{% url 'articles:list' %}">Articles</a>
|
||||
{# <a class="{% if 'photography' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400"#}
|
||||
{# href="{% url 'showcase:project_list' %}">Photography</a>#}
|
||||
{# <a class="{% if 'bear' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400"#}
|
||||
{# href="{% url 'bear:latest' %}">A Bear Aware</a>#}
|
||||
{# <a class="{% if 'websites' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400"#}
|
||||
{# href="{% url 'links:list' %}">Websites</a>#}
|
||||
{# <a class="{% if 'categories' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400" href="{% url 'articles:categories' %}">Categories</a>#}
|
||||
{# <a class="{% if 'showcase' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400" href="#">Showcase</a>#}
|
||||
{# <a class="{% if 'locations' in request.path %}text-cyan-400 uppercase{% endif %} hover:text-red-400" href="#">Locations</a>#}
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
|
@ -1,12 +1,13 @@
|
|||
<nav>
|
||||
<hr>
|
||||
<ul>
|
||||
<ul class="flex gap-x-2 justify-center">
|
||||
{% if page_obj.has_previous %}
|
||||
<li><a href="?page=1">« first</a></li>
|
||||
<li><a href="?page={{ page_obj.previous_page_number }}">previous</a></li>
|
||||
{% endif %}
|
||||
{% for page in page_obj.paginator.page_range %}
|
||||
<li><a href="?page={{ page }}">{{ page }}</a></li>
|
||||
<li {% if page == page_obj.number %}class="font-bold text-blue-600"{% endif %}><a
|
||||
href="?page={{ page }}">{{ page }}</a></li>
|
||||
{% endfor %}
|
||||
{% if page_obj.has_next %}
|
||||
<li><a href="?page={{ page_obj.next_page_number }}">next</a></li>
|
||||
|
|
|
|||
Loading…
Reference in New Issue