rc/aircox
13
1
Fork 1
Code Issues 15 Pull Requests Projects Releases Wiki Activity

#132 | #121: backoffice / dev-1.0-121 #131

Merged
thomas merged 151 commits from dev-1.0-121 into develop-1.0 2024-04-28 20:02:14 +00:00
Conversation 2 Commits 151 Files Changed 348 +183 -204
14 changed files with 183 additions and 204 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 6a21a9d094 - Show all commits

2
aircox/filters.py
View File

@ -10,7 +10,7 @@ class PageFilters(filters.FilterSet):
class Meta: class Meta:
model = Page model = Page
fields = { fields = {
"category__id": ["in"], "category__id": ["in", "exact"],
"pub_date": ["exact", "gte", "lte"], "pub_date": ["exact", "gte", "lte"],
} }

10
aircox/models/episode.py
View File

@ -17,7 +17,11 @@ class Episode(Page):
@property @property
def program(self): def program(self):
return getattr(self.parent, "program", None) return self.parent_subclass
@program.setter
def program(self, value):
self.parent = value
@cached_property @cached_property
def podcasts(self): def podcasts(self):
@ -40,10 +44,6 @@ class Episode(Page):
podcasts[index]["page_title"] = self.title podcasts[index]["page_title"] = self.title
return podcasts return podcasts
@program.setter
def program(self, value):
self.parent = value
class Meta: class Meta:
verbose_name = _("Episode") verbose_name = _("Episode")
verbose_name_plural = _("Episodes") verbose_name_plural = _("Episodes")

8
aircox/models/page.py
View File

@ -221,6 +221,12 @@ class Page(BasePage):
objects = PageQuerySet.as_manager() objects = PageQuerySet.as_manager()
@cached_property
def parent_subclass(self):
if self.parent_id:
return Page.objects.get_subclass(id=self.parent_id)
return None
class Meta: class Meta:
verbose_name = _("Publication") verbose_name = _("Publication")
verbose_name_plural = _("Publications") verbose_name_plural = _("Publications")
@ -300,7 +306,7 @@ class Comment(Renderable, models.Model):
return Page.objects.select_subclasses().filter(id=self.page_id).first() return Page.objects.select_subclasses().filter(id=self.page_id).first()
def get_absolute_url(self): def get_absolute_url(self):
return self.parent.get_absolute_url() return self.parent.get_absolute_url() + f"#comment-{self.pk}"
class Meta: class Meta:
verbose_name = _("Comment") verbose_name = _("Comment")

123
aircox/static/aircox/css/chunk-common.css
View File

@ -9567,34 +9567,6 @@ a.navbar-item.is-active {
font-weight: 100; font-weight: 100;
} }
/*
.page {
& > .cover {
float: right;
max-width: 45%;
}
.header {
margin-bottom: 1.5em;
}
.headline {
font-size: 1.4em;
padding: 0.2em 0em;
}
p { padding: 0.4em 0em; }
hr { background-color: $grey-light; }
.page-content {
h1 { font-size: $size-1; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h2 { font-size: $size-3; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h3 { font-size: $size-4; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h4 { font-size: $size-5; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h5 { font-size: $size-6; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h6 { font-size: $size-6; margin-top:0.4em; margin-bottom:0.2em; }
}
}*/
.player { .player {
z-index: 10000; z-index: 10000;
box-shadow: 0em 1.5em 2.5em rgba(0, 0, 0, 0.6); box-shadow: 0em 1.5em 2.5em rgba(0, 0, 0, 0.6);
@ -9649,12 +9621,22 @@ a.navbar-item.is-active {
margin: 0em; margin: 0em;
} }
.media .subtitle { :root {
margin-bottom: 0.4em; --text-color: black;
} --highlight-color: rgba(255, 255, 0, 1);
.media .media-content .headline { --highlight-color-alpha: rgba(255, 255, 0, 0.6);
font-size: 1em; --highlight-color-2: rgb(0, 0, 254);
font-weight: 400; --highlight-color-2-alpha: rgb(0, 0, 254, 0.6);
--header-height: 30em;
--heading-height: 30em;
--heading-title-bg-color: rgba(255, 255, 0, 1);
--heading-bg-color: var(--highlight-color);
--heading-bg-highlight-color: var(--highlight-color-2);
--preview-media-height: 10em;
--preview-media-cover-size: 10em;
--preview-cover-size: 24em;
--preview-cover-small-size: 10em;
--heading-font-family: default;
} }
body { body {
@ -9696,24 +9678,6 @@ aside .media .subtitle {
display: inline-block; display: inline-block;
} }
:root {
--text-color: black;
--highlight-color: rgba(255, 255, 0, 1);
--highlight-color-alpha: rgba(255, 255, 0, 0.6);
--highlight-color-2: rgb(0, 0, 254);
--highlight-color-2-alpha: rgb(0, 0, 254, 0.6);
--header-height: 30em;
--heading-height: 30em;
--heading-title-bg-color: rgba(255, 255, 0, 1);
--heading-bg-color: var(--highlight-color);
--heading-bg-highlight-color: var(--highlight-color-2);
--preview-media-height: 10em;
--preview-media-cover-size: 10em;
--preview-cover-size: 24em;
--preview-cover-small-size: 10em;
--heading-font-family: default;
}
h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle { h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
font-family: var(--heading-font-family); font-family: var(--heading-font-family);
} }
@ -9726,6 +9690,21 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
color: var(--highlight-color-2); color: var(--highlight-color-2);
text-decoration: none; text-decoration: none;
} }
.page .content {
font-size: 2em;
}
.page section.container {
padding-top: 2em;
}
.page section.container > .title {
margin-top: unset;
padding-top: unset !important;
margin-bottom: 1.2em;
}
.page section.container:not(:first-child) {
margin-top: 2em;
border-top: 1px solid black;
}
.d-inline { .d-inline {
display: inline; display: inline;
@ -9813,24 +9792,20 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
margin-top: 0.8em; margin-top: 0.8em;
} }
.content { .heading {
font-size: 1.4em;
}
.heading, .headings-container > * {
display: inline-block; display: inline-block;
} }
.heading:not(:empty), .headings-container > *:not(:empty) { .heading:not(:empty) {
background-color: var(--heading-bg-color); background-color: var(--heading-bg-color);
padding: 0.4em; padding: 0.4em;
margin-top: 0em !important; margin-top: 0em !important;
vertical-align: top; vertical-align: top;
} }
.heading:not(:empty).highlight, .headings-container > *:not(:empty).highlight { .heading:not(:empty).highlight {
background-color: var(--heading-bg-highlight-color); background-color: var(--heading-bg-highlight-color);
color: var(--highlight-color); color: var(--highlight-color);
} }
.heading.title, .headings-container > *.title { .heading.title {
background-color: var(--heading-title-bg-color); background-color: var(--heading-title-bg-color);
} }
@ -9862,15 +9837,15 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
background-color: var(--highlight-color-2); background-color: var(--highlight-color-2);
color: var(--highlight-color); color: var(--highlight-color);
} }
.nav.primary .navbar-brand { .nav.primary .nav-brand {
display: inline-block; display: inline-block;
margin-right: 0.8em; margin-right: 0.8em;
padding: 0.8em; padding: 0.8em;
} }
.nav.primary .navbar-brand img { .nav.primary .nav-brand img {
width: 14em !important; width: 14em !important;
} }
.nav.primary .navbar-menu { .nav.primary .nav-menu {
display: flex; display: flex;
flex-grow: 1; flex-grow: 1;
} }
@ -9892,10 +9867,15 @@ nav li a, nav li .button {
font-size: 1.4em; font-size: 1.4em;
} }
.page-content {
margin-top: 2em;
margin-bottom: 2em;
}
.preview { .preview {
position: relative; position: relative;
background-size: cover; background-size: cover;
margin-bottom: 0.8em; margin-bottom: 1.2em !important;
} }
.preview.preview-card:not(.wide) { .preview.preview-card:not(.wide) {
max-width: 30em; max-width: 30em;
@ -9904,7 +9884,8 @@ nav li a, nav li .button {
width: 100%; width: 100%;
} }
.preview.columns, .preview .headings.columns { .preview.columns, .preview .headings.columns {
margin: 0em; margin-left: 0em;
margin-right: 0em;
} }
.preview.columns .column, .preview .headings.columns .column { .preview.columns .column, .preview .headings.columns .column {
padding: 0em; padding: 0em;
@ -9945,7 +9926,7 @@ nav li a, nav li .button {
} }
.list-item .headings { .list-item .headings {
padding-top: 0em; padding-top: 0em;
margin-bottom: 0.8em !important; margin-bottom: 1.2em !important;
background-color: var(--heading-bg-color); background-color: var(--heading-bg-color);
} }
.list-item .subtitle { .list-item .subtitle {
@ -9954,16 +9935,16 @@ nav li a, nav li .button {
.list-item .media-content { .list-item .media-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} min-height: var(--preview-cover-small-size);
.list-item:not(.no-cover) .list-item .media-content {
height: var(--preview-cover-small-size);
} }
.list-item .media-content .content { .list-item .media-content .content {
flex-grow: 1; flex-grow: 1;
margin-bottom: auto;
} }
.list-item .media-content .actions { .list-item .media-content .actions {
flex-grow: 0; flex-grow: unset;
text-align: right; text-align: right;
margin-top: auto;
} }
.preview-wide { .preview-wide {
@ -9975,7 +9956,7 @@ nav li a, nav li .button {
.preview-wide .headings { .preview-wide .headings {
width: var(--preview-cover-size); width: var(--preview-cover-size);
flex-grow: 0; flex-grow: 0;
margin-right: 0.8em; margin-right: 1.2em;
} }
.preview-wide .content { .preview-wide .content {
font-size: 2em; font-size: 2em;

6
aircox/templates/aircox/base.html
View File

@ -52,10 +52,10 @@ Usefull context:
{% block nav %} {% block nav %}
<nav class="nav primary" role="navigation" aria-label="main navigation"> <nav class="nav primary" role="navigation" aria-label="main navigation">
{% block nav-primary %} {% block nav-primary %}
<a class="navbar-brand" href="{% url "home" %}"> <a class="nav-brand" href="{% url "home" %}">
<img src="{{ station.logo.url }}"> <img src="{{ station.logo.url }}">
</a> </a>
<div class="navbar-menu"> <div class="nav-menu">
{% block nav-primary-menu %} {% block nav-primary-menu %}
{% nav_items "top" css_class="nav-item" active_class="active" as items %} {% nav_items "top" css_class="nav-item" active_class="active" as items %}
{% for item, render in items %} {% for item, render in items %}
@ -82,7 +82,7 @@ Usefull context:
<div class="container content"> <div class="container content">
{% block content %} {% block content %}
{% if page and page.content %} {% if page and page.content %}
<section class="page-content mb-2">{{ page.content|safe }}</section> <section class="page-content">{{ page.content|safe }}</section>
{% endif %} {% endif %}
{% endblock %} {% endblock %}
</div> </div>

20
aircox/templates/aircox/home.html
View File

@ -32,19 +32,25 @@
</section> </section>
{% endif %} {% endif %}
{% if logs %}
{% if object_list %}
<section class="container"> <section class="container">
<h2 class="title is-3 p-2"> <h2 class="title is-3 p-2">{% translate "It just happened" %}</h2>
</h2> {% for object in logs %}
{% include "./widgets/log.html" with widget="item" %}
{% endfor %}
</section>
{% endif %}
{% if last_publications %}
<section class="container">
<h2 class="title is-3 p-2">{% translate "Last publications" %}</h2>
<div role="list"> <div role="list">
{% for object in object_list %} {% for object in last_publications %}
{% page_widget "item" object.episode diffusion=object timetable=True open=True %} {% page_widget "item" object open=True %}
{% endfor %} {% endfor %}
</div> </div>
</section> </section>
{% endif %} {% endif %}
{% endblock %} {% endblock %}

15
aircox/templates/aircox/page_detail.html
View File

@ -36,18 +36,9 @@ Context:
<section class="container"> <section class="container">
<h2 class="title">{% translate "Comments" %}</h2> <h2 class="title">{% translate "Comments" %}</h2>
{% for comment in comments %} {% for object in comments %}
<div class="media box"> <div id="comment-{{ object.pk }}">
<div class="media-content"> {% page_widget "item" object %}
<p>
<strong class="mr-2">{{ comment.nickname }}</strong>
<time datetime="{{ comment.date }}" title="{{ comment.date }}">
<small>{{ comment.date|naturaltime }}</small>
</time>
<br>
{{ comment.content }}
</p>
</div>
</div> </div>
{% endfor %} {% endfor %}
</section> </section>

9
aircox/templates/aircox/page_list.html
View File

@ -2,6 +2,15 @@
{% comment %}Display a list of Pages{% endcomment %} {% comment %}Display a list of Pages{% endcomment %}
{% load i18n aircox %} {% load i18n aircox %}
{% block secondary-nav %}
<form class="nav secondary">
{% for id, title in view.categories.items %}
<a class="nav-item{% if category_id == id %} active{% endif %}"
href="?category__id={{ id }}">{{ title }}</a>
{% endfor %}
</form>
{% endblock %}
{% block header %} {% block header %}
{% if page and not object %} {% if page and not object %}
{% with page as object %} {% with page as object %}

9
aircox/templates/aircox/program_detail.html
View File

@ -5,10 +5,10 @@
{% include "aircox/program_sidebar.html" %} {% include "aircox/program_sidebar.html" %}
{% block content %} {% block content-container %}
{{ block.super }} {{ block.super }}
{% if episodes %} {% if episodes %}
<section> <section class="container">
<h4 class="title is-3">{% translate "Last Episodes" %}</h4> <h4 class="title is-3">{% translate "Last Episodes" %}</h4>
<section class="card-grid"> <section class="card-grid">
{% for object in episodes|slice:":3" %} {% for object in episodes|slice:":3" %}
@ -19,8 +19,7 @@
<nav class="has-text-right"> <nav class="has-text-right">
<li class="nav-item"> <li class="nav-item">
<a href="{% url "episode-list" parent_slug=program.slug %}" <a href="{% url "episode-list" parent_slug=program.slug %}"
class="button action" class="button action">
aria-label="{% translate "Show all program's articles" %}">
{% translate "All episodes" %} {% translate "All episodes" %}
</a> </a>
</li> </li>
@ -30,7 +29,7 @@
{% if articles %} {% if articles %}
<section> <section class="container">
<h4 class="title is-4">{% translate "Last Articles" %}</h4> <h4 class="title is-4">{% translate "Last Articles" %}</h4>
<section class="card-grid"> <section class="card-grid">

17
aircox/templates/aircox/widgets/header.html
View File

@ -5,15 +5,16 @@
{% block headings %} {% block headings %}
<div class="columns">
<div class="column">
{{ block.super }} {{ block.super }}
{% spaceless %} {% if parent and parent.is_published %}
<section class="heading content"> <div>
{% block content %}{{ block.content }}{% endblock %} <a href="{{ parent.get_absolute_url|escape }}" class="heading subtitle">
</section> <span class="icon">
{% endspaceless %} <i class="fa fa-angles-right"></i>
</div> </span>
{{ parent.title }}
</a>
</div> </div>
{% endif %}
{% endblock %} {% endblock %}

5
aircox/templates/aircox/widgets/log.html
View File

@ -1,4 +1,3 @@
{% extends "./page.html" %}
{% load i18n aircox %} {% load i18n aircox %}
{% comment %} {% comment %}
List item for a log, either for a logged track or diffusion (as diffusion). List item for a log, either for a logged track or diffusion (as diffusion).
@ -14,8 +13,8 @@ for design review.
{% block outer %} {% block outer %}
{% if object|is_diffusion %} {% if object|is_diffusion %}
{% include "./diffusion.html" with object=diffusion.episode %} {% page_widget widget object.episode diffusion=object %}
{% else %} {% else %}
{% include "aircox/widgets/track_item.html" with object=object.track log=object %} {% include "./track_item.html" with object=object.track log=object %}
{% endif %} {% endif %}
{% endblock %} {% endblock %}

4
aircox/views/home.py
View File

@ -14,7 +14,7 @@ class HomeView(AttachedToMixin, BaseView, ListView):
model = Diffusion model = Diffusion
queryset = Diffusion.objects.on_air().select_related("episode") queryset = Diffusion.objects.on_air().select_related("episode")
logs_count = 5 logs_count = 5
publications_count = 5 publications_count = 7
def get_queryset(self): def get_queryset(self):
return super().get_queryset().date(date.today()) return super().get_queryset().date(date.today())
@ -62,7 +62,7 @@ class HomeView(AttachedToMixin, BaseView, ListView):
"diffusion": current_diff, "diffusion": current_diff,
"logs": self.get_logs(self.object_list), "logs": self.get_logs(self.object_list),
"next_diffs": next_diffs, "next_diffs": next_diffs,
"last_publications": self.get_last_publications()[:5], "last_publications": self.get_last_publications(),
} }
) )
return super().get_context_data(**kwargs) return super().get_context_data(**kwargs)

13
aircox/views/page.py
View File

@ -123,12 +123,17 @@ class PageListView(FiltersMixin, BasePageListView):
return qs return qs
def get_context_data(self, **kwargs): def get_context_data(self, **kwargs):
kwargs["categories"] = ( self.categories = {
self.model.objects.published() id: title
for title, id in self.model.objects.published()
.filter(category__isnull=False) .filter(category__isnull=False)
.values_list("category__title", "category__id") .values_list("category__title", "category__id")
.distinct() .distinct()
) }
cat_id = self.request.GET.get("category__id")
if cat_id:
cat_id = int(cat_id)
kwargs["category_id"] = cat_id
return super().get_context_data(**kwargs) return super().get_context_data(**kwargs)
@ -150,6 +155,8 @@ class PageDetailView(BasePageDetailView):
kwargs["comments"] = Comment.objects.filter(page=self.object).order_by( kwargs["comments"] = Comment.objects.filter(page=self.object).order_by(
"-date" "-date"
) )
if self.object.parent_subclass:
kwargs["parent"] = self.object.parent_subclass
return super().get_context_data(**kwargs) return super().get_context_data(**kwargs)
@classmethod @classmethod

144
assets/src/assets/styles.scss
View File

@ -149,36 +149,6 @@ a.navbar-item.is-active {
} }
} }
//-- page
/*
.page {
& > .cover {
float: right;
max-width: 45%;
}
.header {
margin-bottom: 1.5em;
}
.headline {
font-size: 1.4em;
padding: 0.2em 0em;
}
p { padding: 0.4em 0em; }
hr { background-color: $grey-light; }
.page-content {
h1 { font-size: $size-1; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h2 { font-size: $size-3; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h3 { font-size: $size-4; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h4 { font-size: $size-5; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h5 { font-size: $size-6; font-weight: bolder; margin-top:0.4em; margin-bottom:0.2em; }
h6 { font-size: $size-6; margin-top:0.4em; margin-bottom:0.2em; }
}
}*/
//-- player //-- player
.player { .player {
@ -247,18 +217,31 @@ a.navbar-item.is-active {
} }
//-- media //-- general
.media { :root {
.subtitle { --text-color: black;
margin-bottom: 0.4em; --highlight-color: rgba(255, 255, 0, 1);
} --highlight-color-alpha: rgba(255, 255, 0, 0.6);
.media-content .headline { --highlight-color-2: rgb(0, 0, 254);
font-size: 1em; --highlight-color-2-alpha: rgb(0, 0, 254, 0.6);
font-weight: 400;
} --header-height: 30em;
--heading-height: 30em;
--heading-title-bg-color: rgba(255, 255, 0, 1);
--heading-bg-color: var(--highlight-color);
--heading-bg-highlight-color: var(--highlight-color-2);
--preview-media-height: 10em;
--preview-media-cover-size: 10em;
--preview-cover-size: 24em;
--preview-cover-small-size: 10em;
--heading-font-family: default;
} }
//-- general
body { body {
background-color: $body-background-color; background-color: $body-background-color;
} }
@ -295,31 +278,6 @@ aside {
} }
// -- layout
:root {
--text-color: black;
--highlight-color: rgba(255, 255, 0, 1);
--highlight-color-alpha: rgba(255, 255, 0, 0.6);
--highlight-color-2: rgb(0, 0, 254);
--highlight-color-2-alpha: rgb(0, 0, 254, 0.6);
--header-height: 30em;
--heading-height: 30em;
--heading-title-bg-color: rgba(255, 255, 0, 1);
--heading-bg-color: var(--highlight-color);
--heading-bg-highlight-color: var(--highlight-color-2);
--preview-media-height: 10em;
--preview-media-cover-size: 10em;
--preview-cover-size: 24em;
--preview-cover-small-size: 10em;
--heading-font-family: default;
}
// ---- main theme & layout // ---- main theme & layout
h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle { h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
font-family: var(--heading-font-family); font-family: var(--heading-font-family);
@ -333,6 +291,25 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
color: var(--highlight-color-2); color: var(--highlight-color-2);
text-decoration: none; text-decoration: none;
} }
.content {
font-size: $text-size-big;
}
section.container {
padding-top: $mp-6;
> .title {
margin-top: unset;
padding-top: unset !important;
margin-bottom: $mp-4;
}
&:not(:first-child) {
margin-top: $mp-6;
border-top: 1px solid black;
}
}
} }
@ -396,12 +373,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
} }
} }
.content { .heading {
font-size: $text-size-medium;
}
.heading, .headings-container > * {
display: inline-block; display: inline-block;
&:not(:empty) { &:not(:empty) {
@ -458,7 +430,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
} }
&.primary { &.primary {
.navbar-brand { .nav-brand {
display: inline-block; display: inline-block;
margin-right: $mp-3; margin-right: $mp-3;
padding: $mp-3; padding: $mp-3;
@ -468,7 +440,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
} }
} }
.navbar-menu { .nav-menu {
display: flex; display: flex;
flex-grow: 1; flex-grow: 1;
} }
@ -497,11 +469,17 @@ nav li {
} }
// ---- ---- detail
.page-content {
margin-top: $mp-6;
margin-bottom: $mp-6;
}
// ---- ---- previews & page items // ---- ---- previews & page items
.preview { .preview {
position: relative; position: relative;
background-size: cover; background-size: cover;
margin-bottom: calc($mp-3); margin-bottom: $mp-4 !important;
&.preview-card { &.preview-card {
&:not(.wide) { &:not(.wide) {
@ -514,7 +492,8 @@ nav li {
} }
&.columns, .headings.columns { &.columns, .headings.columns {
margin: 0em; margin-left: 0em;
margin-right: 0em;
.column { padding: 0em; } .column { padding: 0em; }
} }
@ -557,7 +536,7 @@ nav li {
.headings { .headings {
padding-top: 0em; padding-top: 0em;
margin-bottom: $mp-3 !important; margin-bottom: $mp-4 !important;
background-color: var(--heading-bg-color); background-color: var(--heading-bg-color);
} }
@ -568,16 +547,17 @@ nav li {
.media-content { .media-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: var(--preview-cover-small-size);
.list-item:not(.no-cover) & { .content {
height: var(--preview-cover-small-size); flex-grow: 1;
margin-bottom: auto;
} }
.content { flex-grow: 1; }
.actions { .actions {
flex-grow: 0; flex-grow: unset;
text-align: right; text-align: right;
margin-top: auto;
} }
} }
} }
@ -594,7 +574,7 @@ nav li {
& .headings { & .headings {
width: var(--preview-cover-size); width: var(--preview-cover-size);
flex-grow: 0; flex-grow: 0;
margin-right: $mp-3; margin-right: $mp-4;
} }
& .content { & .content {