Skip to content

Commit

Permalink
News styling
Browse files Browse the repository at this point in the history
  • Loading branch information
Merlin Buczek committed Jun 2, 2019
1 parent 3514c2e commit 70bf6ea
Show file tree
Hide file tree
Showing 9 changed files with 134 additions and 14 deletions.
Empty file.
11 changes: 11 additions & 0 deletions mpicms/base/templatetags/url_tags.py
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
from django import template


register = template.Library()


@register.simple_tag
def url_replace(request, field, value):
dict_ = request.GET.copy()
dict_[field] = value
return dict_.urlencode()
20 changes: 20 additions & 0 deletions mpicms/news/models.py
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
from django.db import models
from django.utils.translation import gettext as _
from django.core.paginator import EmptyPage, PageNotAnInteger, Paginator

from wagtail.core.models import Page
from wagtail.core.fields import RichTextField
Expand All @@ -17,6 +18,24 @@ class NewsPage(CategoryMixin, Page):
parent_page_types = ['base.CategoryPage', 'base.HomePage']
subpage_types = ['NewsEntry']
show_in_menus_default = False
paginated_by = 2

def get_context(self, request, *args, **kwargs):
context = super().get_context(request, *args, **kwargs)

paginator = Paginator(self.news_items, self.paginated_by)

page = request.GET.get("page")
try:
posts = paginator.page(page)
except PageNotAnInteger:
posts = paginator.page(1)
except EmptyPage:
posts = paginator.page(paginator.num_pages)

context['paginator'] = paginator
context["news_items"] = posts
return context

@property
def news_items(self):
Expand All @@ -43,5 +62,6 @@ class NewsEntry(CategoryMixin, Page):
parent_page_types = ['NewsPage']

class Meta: # noqa
ordering = ['-date']
verbose_name = _("news entry")
verbose_name_plural = _("news entries")
32 changes: 26 additions & 6 deletions mpicms/static/css/custom.css
Original file line number Diff line number Diff line change
Expand Up @@ -177,13 +177,24 @@ select, input {
}

.card {
margin: 1rem;
margin: 1rem 2rem 1rem 0;
flex-grow: 1;
flex-basis: 18rem;
width: inherit;
flex-shrink: 0;
}

.is-preview {
flex-basis: 18rem;
}

.category-label {
float: right;
font-size: 90%;
font-weight: bold;
text-transform: uppercase;
color: grey;
}

.flex-align {
display: flex !important;
flex-wrap: nowrap;
Expand Down Expand Up @@ -235,15 +246,24 @@ select, input {
background: #eeeeee;
}

.fa-chevron-right {
padding-left: 0.8rem;
}

.select:not(.is-multiple):not(.is-loading)::after {
border-color: #006c66;
}

/* Full Calendar */
.fc-button {
border-radius: 0 !important;
}

/* Pagination */
.is-current {
background-color: transparent !important;
border-color: #006c66 !important;
/* font-weight: bold; */
}

.pagination-link, .pagination-next, .pagination-previous {
border-radius: 0 !important;
color: black !important;
/* box-shadow: 1px 1px 0px 0px #eeeeee; */
}
61 changes: 61 additions & 0 deletions mpicms/templates/base/components/pagination.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
{% load url_tags %}

{% firstof items.number '1' as current %}

<nav class="pagination is-centered" role="navigation" aria-label="pagination">
<a class="pagination-previous"><i class="fas fa-chevron-left"></i></a>
<ul class="pagination-list">
{% if current|add:0 >= 3 %}
<li>
<a class="pagination-link" href="?{% url_replace request 'page' 1 %}">1</a>
</li>
{% if current|add:0 >= 4 %}
<li>
<span class="pagination-ellipsis">&hellip;</span>
</li>
{% endif %}
{% endif %}

{% if current|add:0 >= 2 %}
<li>
<a class="pagination-link" href="?{% url_replace request 'page' current|add:'-1' %}">{{ current|add:'-1' }}</a>
</li>
{% endif %}

<li>
<a class="pagination-link is-current" aria-current="page">{{ current }}</a>
</li>

{% if current|add:0 <= paginator.num_pages|add:'-1' %}
<li>
<a class="pagination-link" href="?{% url_replace request 'page' current|add:'1' %}">{{ current|add:'1' }}</a>
</li>
{% endif %}

{% if current|add:2 <= paginator.num_pages %}
{% if current|add:3 <= paginator.num_pages %}
<li>
<span class="pagination-ellipsis">&hellip;</span>
</li>
{% endif %}
<li>
<a class="pagination-link" href="?{% url_replace request 'page' paginator.num_pages %}">{{ paginator.num_pages }}</a>
</li>
{% endif %}
</ul>
<a class="pagination-next"><i class="fas fa-chevron-right"></i></a>
</nav>

<!-- <nav class="pagination is-centered" role="navigation" aria-label="pagination">
<a class="pagination-previous">Previous</a>
<a class="pagination-next">Next page</a>
<ul class="pagination-list">
<li><a class="pagination-link" aria-label="Goto page 1">1</a></li>
<li><span class="pagination-ellipsis">&hellip;</span></li>
<li><a class="pagination-link" aria-label="Goto page 45">45</a></li>
<li><a class="pagination-link is-current" aria-label="Page 46" aria-current="page">46</a></li>
<li><a class="pagination-link" aria-label="Goto page 47">47</a></li>
<li><span class="pagination-ellipsis">&hellip;</span></li>
<li><a class="pagination-link" aria-label="Goto page 86">86</a></li>
</ul>
</nav> -->
2 changes: 1 addition & 1 deletion mpicms/templates/news/components/cards.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

<div class="flex-base">
{% for item in items|slice:3 %}
<div class="card">
<div class="card is-preview">
<div class="card-content">
<a href="{% pageurl item %}" class="title is-4">{{ item.title }}</a>
<time datetime="{{ item.specific.date }}">{{ item.specific.date }}</time>
Expand Down
2 changes: 1 addition & 1 deletion mpicms/templates/news/components/news_list.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
{% load wagtailcore_tags %}

{% for news_page in news %}
{% with news_page.get_children.live as news_entries %}
{% with news_page.specific.news_items as news_entries %}
{% if news_entries %}
<h4>{{ news_page.title }}</h4>
<ul class="menu-list">
Expand Down
2 changes: 1 addition & 1 deletion mpicms/templates/news/components/news_preview.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<h3 class="title is-3">{{ news_page.title }}</h3>
{% include 'news/components/cards.html' with items=news_entries %}
<div class="section-button">
<a href="{% pageurl news_page %}"><button class="button">{% trans 'All news' %}<i class="fas fa-chevron-right"></i></button></a>
<a href="{% pageurl news_page %}"><button class="button">{% trans 'All news' %}&nbsp&nbsp<i class="fas fa-chevron-right"></i></button></a>
</div>
{% endif %}
{% endwith %}
Expand Down
18 changes: 13 additions & 5 deletions mpicms/templates/news/news_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,20 +6,28 @@

<section class="section">
<h1 class="title">{{ page.title }}</h1>
{% for child in page.news_items %}
<a href="{% pageurl child %}">
<div class="flex-base">
{% for child in news_items %}
<!-- <a href="{% pageurl child %}"> -->
<div class="card">
<div class="card-content">
<time datetime="{{ child.specific.date }}">{{ child.specific.date }}</time>
<p class="title">{{ child.title }}</p>
{% if page.show_all and child.category %}
<a href="{% pageurl child.category %}" class="category-label">{{ child.category }}</a>
{% endif %}
<a href="{% pageurl child %}" class="title is-4">{{ child.title }}</a>
<div class="content">
{{ child.specific.preview }}
<a href="{% pageurl child %}" class="card-footer-item card-link"><i class="fas fa-chevron-right"></i></a>
</div>
</div>
</div>
</a>
<!-- </a> -->
{% endfor %}

</div>
</section>
<div class="section">
{% include 'base/components/pagination.html' with items=news_items %}
</div>

{% endblock %}

0 comments on commit 70bf6ea

Please sign in to comment.