mirror of
https://github.com/boostorg/website-v2.git
synced 2026-01-19 04:42:17 +00:00
🚧 cleaning up news list
* Added templatetag for can edit conditional * Adding edit icons * Rearranged top text area so title matches alignment of other sections of the site.
This commit is contained in:
Greg Newman
0
news/templatetags/__init__.py
Normal file
0
news/templatetags/__init__.py
Normal file
9
news/templatetags/news_tags.py
Normal file
9
news/templatetags/news_tags.py
Normal file
@@ -0,0 +1,9 @@
|
||||
from django import template
|
||||
|
||||
register = template.Library()
|
||||
|
||||
|
||||
@register.simple_tag(takes_context=True)
|
||||
def can_edit(context, news_item, *args, **kwargs):
|
||||
request = context.get("request")
|
||||
return news_item.can_edit(request.user)
|
||||
@@ -1510,6 +1510,22 @@ code,
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.-mt-3 {
|
||||
margin-top: -0.75rem;
|
||||
}
|
||||
|
||||
.-mt-4 {
|
||||
margin-top: -1rem;
|
||||
}
|
||||
|
||||
.-mr-3 {
|
||||
margin-right: -0.75rem;
|
||||
}
|
||||
|
||||
.-mt-5 {
|
||||
margin-top: -1.25rem;
|
||||
}
|
||||
|
||||
.block {
|
||||
display: block;
|
||||
}
|
||||
@@ -3557,6 +3573,12 @@ code,
|
||||
margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.md\:space-x-11 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(2.75rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(2.75rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.md\:space-x-3 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(0.75rem * var(--tw-space-x-reverse));
|
||||
|
||||
@@ -1,81 +1,79 @@
|
||||
{% extends "base.html" %}
|
||||
{% load i18n %}
|
||||
{% load static %}
|
||||
{% load news_tags %}
|
||||
|
||||
{% block title %}{% trans "News" %}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="py-0 px-3 mb-3 md:py-6 md:px-0">
|
||||
<div class="py-0 px-3 md:px-0 mt-0 mb-0 w-full md:mb-2">
|
||||
<div class="md:w-full">
|
||||
<h1 class="text-4xl text-center">Latest Stories</h1>
|
||||
<h1 class="text-4xl">Latest Stories</h1>
|
||||
|
||||
<div class="mx-auto w-auto sm:w-[550px]">
|
||||
<p class="mt-0 text-justify">
|
||||
Stay up to date with Boost and the C++ ecosystem with the latest news, videos, resources, polls, and user-created content.
|
||||
{% if user.is_authenticated %}
|
||||
Or, <a href="{% url 'news-create' %}" class="whitespace-nowrap text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange">Create a Post</a> to include in the feed (posts are reviewed before publication).
|
||||
{% else %}
|
||||
Signed-in users may submit items to include in the feed (posts are reviewed before publication).
|
||||
{% endif %}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- General filters, by news type -->
|
||||
<div class="mx-auto w-full sm:w-fit">
|
||||
<div class="grid grid-cols-3 justify-center place-items-center space-y-1 space-x-1 sm:grid-cols-6 sm:space-y-0">
|
||||
|
||||
{% url 'news' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">All</h6>
|
||||
<i class="fa fa-globe"></i>
|
||||
</a>
|
||||
|
||||
{% url 'news-news-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">News</h6>
|
||||
<i class="fa fa-newspaper"></i>
|
||||
</a>
|
||||
|
||||
{% url 'news-blogpost-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Blogs</h6>
|
||||
<i class="fa fa-comment"></i>
|
||||
</a>
|
||||
|
||||
{% url 'news-link-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Links</h6>
|
||||
<i class="fas fa-link"></i>
|
||||
</a>
|
||||
|
||||
{% comment %}
|
||||
<!-- turning off polls for now -->
|
||||
{% url 'news-poll-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Polls</h6>
|
||||
<i class="fa fa-poll"></i>
|
||||
</a>
|
||||
{% endcomment %}
|
||||
|
||||
{% url 'news-video-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Videos</h6>
|
||||
<i class="fa fa-video"></i>
|
||||
</a>
|
||||
|
||||
{% if is_moderator %}
|
||||
<a href="{% url "news-moderate" %}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Moderate</h6>
|
||||
<i class="fa fa-thumbs-up"></i>
|
||||
</a>
|
||||
{% endif %}
|
||||
<div class="md:flex md:space-x-11">
|
||||
<div class="md:w-1/2 w-full">
|
||||
<p class="mt-0 text-justify">
|
||||
Stay up to date with Boost and the C++ ecosystem with the latest news, videos, resources, polls, and user-created content.
|
||||
{% if user.is_authenticated %}
|
||||
Or, <a href="{% url 'news-create' %}" class="whitespace-nowrap text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange">Create a Post</a> to include in the feed (posts are reviewed before publication).
|
||||
{% else %}
|
||||
Signed-in users may submit items to include in the feed (posts are reviewed before publication).
|
||||
{% endif %}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- General filters, by news type -->
|
||||
<div class="md:w-1/2 w-full pt-6">
|
||||
<div class="grid grid-cols-3 justify-center place-items-center space-y-1 space-x-1 sm:grid-cols-6 sm:space-y-0">
|
||||
|
||||
{% url 'news' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">All</h6>
|
||||
<i class="fa fa-globe"></i>
|
||||
</a>
|
||||
|
||||
{% url 'news-news-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">News</h6>
|
||||
<i class="fa fa-newspaper"></i>
|
||||
</a>
|
||||
|
||||
{% url 'news-blogpost-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Blogs</h6>
|
||||
<i class="fa fa-comment"></i>
|
||||
</a>
|
||||
|
||||
{% url 'news-link-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Links</h6>
|
||||
<i class="fas fa-link"></i>
|
||||
</a>
|
||||
|
||||
{% comment %}
|
||||
<!-- turning off polls for now -->
|
||||
{% url 'news-poll-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Polls</h6>
|
||||
<i class="fa fa-poll"></i>
|
||||
</a>
|
||||
{% endcomment %}
|
||||
|
||||
{% url 'news-video-list' as target_url %}
|
||||
<a href="{{ target_url }}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Videos</h6>
|
||||
<i class="fa fa-video"></i>
|
||||
</a>
|
||||
|
||||
{% if is_moderator %}
|
||||
<a href="{% url "news-moderate" %}" class="w-20 p-1 text-center rounded-lg cursor-pointer hover:bg-gray-100 group dark:hover:bg-slate text-sky-600 dark:text-sky-300 hover:text-orange dark:hover:text-orange{% if request.path == target_url %} bg-gray-100 dark:bg-slate text-orange dark:text-orange{% endif %}">
|
||||
<h6 class="pb-1 text-base">Moderate</h6>
|
||||
<i class="fa fa-thumbs-up"></i>
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="my-5">
|
||||
<div class="mx-auto w-full">
|
||||
@@ -126,6 +124,12 @@
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="block p-6 mb-10 w-full bg-white rounded-lg md:ml-6 dark:bg-charcoal">
|
||||
{% can_edit news_item=entry as editable %}
|
||||
{% if editable %}
|
||||
<a href="{% url 'news-update' entry.slug %}" class="float-right dark:text-white/50 hover:text-orange dark:hover:text-orange -mt-5 -mr-3 text-sm">
|
||||
<i class="fas fa-edit"></i>
|
||||
</a>
|
||||
{% endif %}
|
||||
<h2 class="py-0 my-0 text-xl font-semibold"><a class="text-orange hover:text-info-600 focus:text-info-600 active:text-info-700" {% if entry.tag == "link" %}target="_blank"{% endif %} href="{% if entry.tag == "link" %}{{ entry.external_url }}{% else %}{{ entry.get_absolute_url }}{% endif %}">
|
||||
{{ entry.title }}
|
||||
</a></h2>
|
||||
|
||||
Reference in New Issue
Block a user