Add skeleton listing page

This commit is contained in:
Jake Howard 2022-06-19 13:23:41 +01:00
parent 3b51546fce
commit 39a59b88db
Signed by: jake
GPG key ID: 57AFB45680EDD477
9 changed files with 134 additions and 5 deletions

View file

@ -1,3 +1,3 @@
.content { section.content {
font-size: 1.25rem; font-size: 1.25rem;
} }

View file

@ -0,0 +1,31 @@
.listing-item {
border-top: none !important;
.image-column {
display: flex;
align-items: center;
}
.media img {
object-fit: cover;
width: 100%;
height: 175px;
}
.media {
max-height: 175px;
}
.subtitle {
margin-bottom: 0.25rem !important;
}
.media-content .content {
overflow: hidden;
}
.media-content {
padding-left: 0;
padding-right: 0;
}
}

View file

@ -7,6 +7,7 @@
@import "footer"; @import "footer";
@import "hero"; @import "hero";
@import "content"; @import "content";
@import "listing";
html, html,
body { body {

View file

@ -0,0 +1,46 @@
# Generated by Django 4.0.5 on 2022-06-19 10:42
import django.db.models.deletion
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
("wagtailcore", "0069_log_entry_jsonfield"),
("wagtailimages", "0024_index_image_file_hash"),
("common", "0003_alter_contentpage_hero_image"),
]
operations = [
migrations.CreateModel(
name="ListingPage",
fields=[
(
"page_ptr",
models.OneToOneField(
auto_created=True,
on_delete=django.db.models.deletion.CASCADE,
parent_link=True,
primary_key=True,
serialize=False,
to="wagtailcore.page",
),
),
("subtitle", models.CharField(blank=True, max_length=255)),
(
"hero_image",
models.ForeignKey(
blank=True,
null=True,
on_delete=django.db.models.deletion.SET_NULL,
to="wagtailimages.image",
),
),
],
options={
"abstract": False,
},
bases=("wagtailcore.page",),
),
]

View file

@ -1,3 +1,5 @@
from typing import Any
from django.db import models from django.db import models
from django.utils.functional import classproperty from django.utils.functional import classproperty
from wagtail.admin.panels import FieldPanel from wagtail.admin.panels import FieldPanel
@ -18,13 +20,25 @@ class BasePage(Page):
return "page-" + cls._meta.db_table.replace("_", "-") return "page-" + cls._meta.db_table.replace("_", "-")
class ContentPage(BasePage): class BaseContentMixin(models.Model):
subtitle = models.CharField(max_length=255, blank=True) subtitle = models.CharField(max_length=255, blank=True)
hero_image = models.ForeignKey( hero_image = models.ForeignKey(
get_image_model_string(), null=True, blank=True, on_delete=models.SET_NULL get_image_model_string(), null=True, blank=True, on_delete=models.SET_NULL
) )
content_panels = BasePage.content_panels + [ content_panels = [
FieldPanel("subtitle"), FieldPanel("subtitle"),
FieldPanel("hero_image"), FieldPanel("hero_image"),
] ]
class Meta:
abstract = True
class ContentPage(BasePage, BaseContentMixin): # type: ignore[misc]
subpage_types: list[Any] = []
content_panels = BasePage.content_panels + BaseContentMixin.content_panels
class ListingPage(BasePage, BaseContentMixin): # type: ignore[misc]
content_panels = BasePage.content_panels + BaseContentMixin.content_panels

View file

@ -4,8 +4,8 @@
{% include "common/hero.html" %} {% include "common/hero.html" %}
<div class="container content"> <section class="container content">
{% lorem 10 p %} {% lorem 10 p %}
</div> </section>
{% endblock content %} {% endblock content %}

View file

@ -0,0 +1,16 @@
<article class="container media listing-item">
<div class="columns">
<figure class="media-left column is-3 image-column">
<p class="image">
<img src="https://placekitten.com/g/600/300">
</p>
</figure>
<div class="media-content column">
<div>
<h2 class="title is-3"><a href="#">Title</a></h2>
<h3 class="subtitle is-6">2022-04-15 4 minutes <a>#programming</a> <a href="#security">#security</a> <a>#website</a></h3>
{% lorem 1 p %}
</div>
</div>
</div>
</article>

View file

@ -0,0 +1,13 @@
{% extends "wagtail_base.html" %}
{% load util_tags %}
{% block content %}
{% include "common/hero.html" %}
{% for i in 3|range %}
{% include "common/listing-item.html" %}
{% endfor %}
{% endblock content %}

View file

@ -0,0 +1,8 @@
from django.template import Library
register = Library()
@register.filter(name="range")
def do_range(stop: int) -> range:
return range(stop)