From f05e47af1c29f6a43f1cb2bd29bb2f52eab732da Mon Sep 17 00:00:00 2001 From: bkfox Date: Fri, 1 Dec 2023 20:43:12 +0100 Subject: [PATCH] page headers --- aircox/models/log.py | 6 +- aircox/static/aircox/css/chunk-common.css | 58 ++++++++++++----- aircox/templates/aircox/base.html | 28 ++++++++- aircox/templates/aircox/diffusion_list.html | 6 +- aircox/templates/aircox/episode_detail.html | 5 -- aircox/templates/aircox/log_list.html | 6 -- aircox/templates/aircox/program_detail.html | 8 ++- .../aircox/widgets/dated_list_header.html | 7 --- .../aircox/widgets/episode_header.html | 10 --- aircox/templates/aircox/widgets/header.html | 20 ------ aircox/views/home.py | 2 +- assets/src/assets/styles.scss | 63 +++++++++++++------ 12 files changed, 122 insertions(+), 97 deletions(-) delete mode 100644 aircox/templates/aircox/widgets/dated_list_header.html delete mode 100644 aircox/templates/aircox/widgets/episode_header.html delete mode 100644 aircox/templates/aircox/widgets/header.html diff --git a/aircox/models/log.py b/aircox/models/log.py index ae8e36d..c72f6bb 100644 --- a/aircox/models/log.py +++ b/aircox/models/log.py @@ -163,13 +163,11 @@ class Log(Renderable, models.Model): object_list += [cls(obj) for obj in items] @classmethod - def merge_diffusions(cls, logs, diffs, count=None, diff_count=None): + def merge_diffusions(cls, logs, diffs, count=None, diff_count=None, log_slice=None): """Merge logs and diffusions together. `logs` can either be a queryset or a list ordered by `Log.date`. """ - # TODO: limit count - # FIXME: log may be iterable (in stats view) if isinstance(logs, models.QuerySet): logs = list(logs.order_by("-date")) diffs = diffs.on_air().before().order_by("-start") @@ -211,6 +209,8 @@ class Log(Renderable, models.Model): ) if index is not None and index > 0: logs = logs[index:] + if log_slice: + logs = logs[:log_slice] # - add diff object_list.append(diff) diff --git a/aircox/static/aircox/css/chunk-common.css b/aircox/static/aircox/css/chunk-common.css index 402e0a3..54a5fcf 100644 --- a/aircox/static/aircox/css/chunk-common.css +++ b/aircox/static/aircox/css/chunk-common.css @@ -8049,6 +8049,19 @@ body { background-color: hsl(0deg, 0%, 96%); } +@media screen and (max-width: 1280px) { + body { + font-size: 1.2em; + } +} +@media screen and (max-width: 1024px) { + body { + font-size: 1em; + } + :root { + --header-height: 20rem; + } +} section > .toolbar { background-color: rgba(0, 0, 0, 0.05); padding: 1em; @@ -8229,10 +8242,13 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle { } .schedules { - margin-top: -0.6rem !important; + margin: 0; padding-top: 0; } +.schedule { + margin-bottom: 0.4rem; +} .schedule .day { font-weight: 700; margin-right: 0.6rem; @@ -8527,7 +8543,7 @@ nav li a, nav li .button { .preview .headings { background-size: cover; } -.preview .headings * { +.preview .headings > * { margin: 0em; } .preview .headings .column { @@ -8537,6 +8553,11 @@ nav li a, nav li .button { color: var(--text-color); } +@media screen and (max-width: 600px) { + .preview .content { + display: none; + } +} .preview-cover { background-size: cover; background-color: transparent !important; @@ -8616,6 +8637,9 @@ nav li a, nav li .button { .preview-wide { height: var(--preview-cover-size); } +.preview-wide .headings { + height: var(--preview-cover-size); +} .preview-wide:not(.header) .headings { box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.2); } @@ -8626,7 +8650,7 @@ nav li a, nav li .button { margin-right: 1.2rem; } .preview-wide .content { - font-size: 2rem; + font-size: 1.6rem; flex-grow: 1; } @@ -8659,11 +8683,20 @@ preview-header:not(.no-cover) .preview-card-headings .heading { margin-bottom: 0.6rem; } -.header { - background-size: cover; +.header.preview-header { + display: flex; + align-items: start; + gap: 0.6rem; + min-height: unset; + padding-top: 0.6rem !important; } -.header .preview-card { - max-width: unset; +.header.preview-header .headings { + flex-grow: 1; + padding-top: 0 !important; +} +.header img { + height: var(--preview-cover-size); + max-width: calc(var(--preview-cover-size) * 2); } .header .title { font-size: 40px; @@ -8671,15 +8704,6 @@ preview-header:not(.no-cover) .preview-card-headings .heading { .header .subtitle { font-size: 32px; } -.header .content { - display: inline !important; - font-size: 1.4rem; - font-weight: 500; - text-align: right; -} -.header .content p { - margin-bottom: 0.6rem; -} .card-grid { display: grid; @@ -8705,7 +8729,7 @@ preview-header:not(.no-cover) .preview-card-headings .heading { position: absolute; display: flex; flex-direction: column; - top: calc(var(--preview-cover-size) - 1.4rem); + top: 50%; } .a-carousel-button-container button.prev, .a-carousel-button-container .button.prev { left: -0.6em; diff --git a/aircox/templates/aircox/base.html b/aircox/templates/aircox/base.html index 82b8e91..9253f4f 100644 --- a/aircox/templates/aircox/base.html +++ b/aircox/templates/aircox/base.html @@ -76,9 +76,33 @@ Usefull context: {% block main-container %}
{% block main %} -
+
{% block header %} - {% include header_template_name|default:"./widgets/header.html" %} +
+ {% block headings %} +
+

{% block title %}{{ title|default:"" }}{% endblock %}

+
+
+ + {% block subtitle %} + {% if subtitle %} + {{ subtitle }} + {% elif parent and parent.is_published %} + + + + + {{ parent.title }} + + {% endif %} + + {% endblock %} + +
+ {% endblock %} +
+ {% endblock %}
diff --git a/aircox/templates/aircox/diffusion_list.html b/aircox/templates/aircox/diffusion_list.html index b08872c..5982713 100644 --- a/aircox/templates/aircox/diffusion_list.html +++ b/aircox/templates/aircox/diffusion_list.html @@ -12,11 +12,7 @@ {% endif %} {% endblock %} -{% block header %} -{% with "./widgets/dated_list_header.html" as header_template_name %} - {{ block.super }} -{% endwith %} -{% endblock %} +{% block subtitle %}{{ date|date:"l d F Y" }}{% endblock %} {% block secondary-nav %}