clean-up css; related publications; pagination
This commit is contained in:
bkfox
parent
d075fecbce
commit
bc697bd4bd
File diff suppressed because it is too large
Load Diff
|
|
@ -285,7 +285,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|||
\************************************************************************************************************************************************************************************************************************************************************************/
|
||||
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ render: function() { return /* binding */ render; }\n/* harmony export */ });\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm-bundler.js\");\n\nconst _hoisted_1 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"icon mr-3\"\n}, [/*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"i\", {\n class: \"fa fa-play\"\n})], -1 /* HOISTED */);\nconst _hoisted_2 = {\n class: \"button-group actions\"\n};\nconst _hoisted_3 = [\"href\"];\nconst _hoisted_4 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"icon is-small\"\n}, [/*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"i\", {\n class: \"fa fa-external-link\"\n})], -1 /* HOISTED */);\nconst _hoisted_5 = [_hoisted_4];\nconst _hoisted_6 = [\"href\"];\nconst _hoisted_7 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"icon is-small\"\n}, [/*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"fa fa-download\"\n})], -1 /* HOISTED */);\nconst _hoisted_8 = [_hoisted_7];\nconst _hoisted_9 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"icon is-small\"\n}, [/*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"fa fa-star\"\n})], -1 /* HOISTED */);\nconst _hoisted_10 = [_hoisted_9];\nfunction render(_ctx, _cache, $props, $setup, $data, $options) {\n return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"div\", {\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)(['a-sound-item m-0 button-group', $options.playing && 'playing' || ''])\n }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"title\", {\n player: $props.player,\n item: $options.item,\n loaded: $options.loaded\n }, () => [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)(['title is-flex-grow-1', $options.playing && 'blink' || '']),\n onClick: _cache[0] || (_cache[0] = (0,vue__WEBPACK_IMPORTED_MODULE_0__.withModifiers)($event => _ctx.$emit('togglePlay'), [\"stop\"]))\n }, [_hoisted_1, (0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)(\" \" + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($props.name || $options.item.name), 1 /* TEXT */)], 2 /* CLASS */)]), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"div\", _hoisted_2, [$options.hasAction('page') ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"a\", {\n key: 0,\n class: \"button\",\n href: $options.item.data.page_url\n }, _hoisted_5, 8 /* PROPS */, _hoisted_3)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true), $options.item.data.is_downloadable ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"a\", {\n key: 1,\n class: \"button\",\n href: $options.item.data.url,\n target: \"_blank\"\n }, _hoisted_8, 8 /* PROPS */, _hoisted_6)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true), $props.player && $props.player.sets.pin != _ctx.$parent.set ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"button\", {\n key: 2,\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)(['button', $options.pinned ? 'selected' : 'not-selected']),\n onClick: _cache[1] || (_cache[1] = (0,vue__WEBPACK_IMPORTED_MODULE_0__.withModifiers)($event => $props.player.togglePin($options.item), [\"stop\"]))\n }, _hoisted_10, 2 /* CLASS */)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true), (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"actions\", {\n player: $props.player,\n item: $options.item,\n loaded: $options.loaded\n })]), (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"extra-right\", {\n player: $props.player,\n item: $options.item,\n loaded: $options.loaded\n })], 2 /* CLASS */);\n}\n\n//# sourceURL=webpack://aircox-assets/./src/components/ASoundItem.vue?./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use%5B0%5D!./node_modules/vue-loader/dist/templateLoader.js??ruleSet%5B1%5D.rules%5B3%5D!./node_modules/vue-loader/dist/index.js??ruleSet%5B0%5D.use%5B0%5D");
|
||||
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ render: function() { return /* binding */ render; }\n/* harmony export */ });\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm-bundler.js\");\n\nconst _hoisted_1 = {\n class: \"button-group actions\"\n};\nconst _hoisted_2 = [\"href\"];\nconst _hoisted_3 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"icon is-small\"\n}, [/*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"i\", {\n class: \"fa fa-external-link\"\n})], -1 /* HOISTED */);\nconst _hoisted_4 = [_hoisted_3];\nconst _hoisted_5 = [\"href\"];\nconst _hoisted_6 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"icon is-small\"\n}, [/*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"fa fa-download\"\n})], -1 /* HOISTED */);\nconst _hoisted_7 = [_hoisted_6];\nconst _hoisted_8 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"icon is-small\"\n}, [/*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: \"fa fa-star\"\n})], -1 /* HOISTED */);\nconst _hoisted_9 = [_hoisted_8];\nfunction render(_ctx, _cache, $props, $setup, $data, $options) {\n return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"div\", {\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)(['a-sound-item m-0 button-group', $options.playing && 'playing' || ''])\n }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"title\", {\n player: $props.player,\n item: $options.item,\n loaded: $options.loaded\n }, () => [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"span\", {\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)(['title is-flex-grow-1 align-left', $options.playing && 'blink' || '']),\n onClick: _cache[0] || (_cache[0] = (0,vue__WEBPACK_IMPORTED_MODULE_0__.withModifiers)($event => _ctx.$emit('togglePlay'), [\"stop\"]))\n }, (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($props.name || $options.item.name), 3 /* TEXT, CLASS */)]), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)(\"div\", _hoisted_1, [$options.hasAction('page') ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"a\", {\n key: 0,\n class: \"button action\",\n href: $options.item.data.page_url\n }, _hoisted_4, 8 /* PROPS */, _hoisted_2)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true), $options.item.data.is_downloadable ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"a\", {\n key: 1,\n class: \"button action\",\n href: $options.item.data.url,\n target: \"_blank\"\n }, _hoisted_7, 8 /* PROPS */, _hoisted_5)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true), $props.player && $props.player.sets.pin != _ctx.$parent.set ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)(\"button\", {\n key: 2,\n class: (0,vue__WEBPACK_IMPORTED_MODULE_0__.normalizeClass)(['button action', $options.pinned ? 'selected' : 'not-selected']),\n onClick: _cache[1] || (_cache[1] = (0,vue__WEBPACK_IMPORTED_MODULE_0__.withModifiers)($event => $props.player.togglePin($options.item), [\"stop\"]))\n }, _hoisted_9, 2 /* CLASS */)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(\"v-if\", true), (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"actions\", {\n player: $props.player,\n item: $options.item,\n loaded: $options.loaded\n })]), (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderSlot)(_ctx.$slots, \"extra-right\", {\n player: $props.player,\n item: $options.item,\n loaded: $options.loaded\n })], 2 /* CLASS */);\n}\n\n//# sourceURL=webpack://aircox-assets/./src/components/ASoundItem.vue?./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use%5B0%5D!./node_modules/vue-loader/dist/templateLoader.js??ruleSet%5B1%5D.rules%5B3%5D!./node_modules/vue-loader/dist/index.js??ruleSet%5B0%5D.use%5B0%5D");
|
||||
|
||||
/***/ }),
|
||||
|
||||
|
|
|
|||
|
|
@ -48,41 +48,30 @@
|
|||
<hr/>
|
||||
{% update_query request.GET.copy page=None as GET %}
|
||||
{% with GET.urlencode as GET %}
|
||||
<nav class="pagination is-centered" role="pagination" aria-label="{% translate "pagination" %}">
|
||||
<nav class="nav-urls is-centered" role="pagination" aria-label="{% translate "pagination" %}">
|
||||
{% block pagination %}
|
||||
{% if page_obj.has_previous %}
|
||||
<a href="?{{ GET }}&page={{ page_obj.previous_page_number }}" class="pagination-previous">
|
||||
{% else %}
|
||||
<a class="pagination-previous" disabled>
|
||||
{% endif %}
|
||||
<a href="?{{ GET }}&page={{ page_obj.previous_page_number }}" class="left button">
|
||||
{% comment %}Translators: Bottom of the list, "previous page"{% endcomment %}
|
||||
{% translate "Previous" %}</a>
|
||||
|
||||
{% if page_obj.has_next %}
|
||||
<a href="?{{ GET }}&page={{ page_obj.next_page_number }}" class="pagination-next">
|
||||
{% else %}
|
||||
<a class="pagination-next" disabled>
|
||||
{% endif %}
|
||||
{% comment %}Translators: Bottom of the list, "Nextpage"{% endcomment %}
|
||||
{% translate "Next" %}</a>
|
||||
|
||||
<ul class="pagination-list">
|
||||
<ul class="urls">
|
||||
{% for i in paginator.page_range %}
|
||||
<li>
|
||||
{% comment %}
|
||||
<form action="?{{ GET }}">
|
||||
{% for get in GET %}
|
||||
<input type="hidden" name="{{ get.0 }}" value="{{ get.1 }}" />
|
||||
{% endfor %}
|
||||
<input type="number" name="page" value="{{ page_obj.number }}" />
|
||||
</form>
|
||||
{% endcomment %}
|
||||
<a class="pagination-link {% if page_obj.number == i %}is-current{% endif %}"
|
||||
<a class="button {% if page_obj.number == i %}active{% endif %}"
|
||||
href="?{{ GET }}&page={{ i }}">{{ i }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endblock %}
|
||||
|
||||
{% if page_obj.has_next %}
|
||||
<a href="?{{ GET }}&page={{ page_obj.next_page_number }}" class="right button">
|
||||
{% comment %}Translators: Bottom of the list, "Nextpage"{% endcomment %}
|
||||
{% translate "Next" %}</a>
|
||||
{% endif %}
|
||||
|
||||
</nav>
|
||||
{% endwith %}
|
||||
{% endif %}
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
{% include "./widgets/log.html" with widget="item" %}
|
||||
{% endfor %}
|
||||
|
||||
<nav class="list-urls">
|
||||
<nav class="nav-urls">
|
||||
<a href="{% url "diffusion-list" %}"
|
||||
aria-label="{% translate "Show all program's for today" %}">
|
||||
{% translate "Today" %}
|
||||
|
|
@ -58,7 +58,7 @@
|
|||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<nav class="list-urls">
|
||||
<nav class="nav-urls">
|
||||
<a href="{% url "page-list" %}"
|
||||
aria-label="{% translate "Show all publications" %}">
|
||||
{% translate "All publications" %}
|
||||
|
|
|
|||
|
|
@ -6,6 +6,8 @@ Base template used to display a Page
|
|||
Context:
|
||||
- page: page
|
||||
- parent: parent page
|
||||
- related_objects: list of object to display as related publications
|
||||
- related_url: url to the full list of related_objects
|
||||
{% endcomment %}
|
||||
|
||||
{% block header_crumbs %}
|
||||
|
|
@ -31,6 +33,29 @@ Context:
|
|||
{% block main %}
|
||||
{{ block.super }}
|
||||
|
||||
{% block related %}
|
||||
{% if related_objects %}
|
||||
<section class="container">
|
||||
{% with models=object|verbose_name:True %}
|
||||
<h3 class="title is-3">{% blocktranslate %}Related {{models}}{% endblocktranslate %}</h3>
|
||||
{% endwith %}
|
||||
|
||||
<section class="card-grid">
|
||||
{% for object in related_objects %}
|
||||
{% page_widget "card" object %}
|
||||
{% endfor %}
|
||||
</section>
|
||||
|
||||
{% if related_url %}
|
||||
<nav class="nav-urls">
|
||||
<a href="{{ related_url }}">
|
||||
{% translate "See more" %}
|
||||
</a>
|
||||
</nav>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block comments %}
|
||||
{% if comments %}
|
||||
<section class="container">
|
||||
|
|
@ -46,8 +71,8 @@ Context:
|
|||
|
||||
{% if comment_form %}
|
||||
<section class="container">
|
||||
<h2 class="title">{% translate "Post a comment" %}</h2>
|
||||
<form method="POST">
|
||||
<h2 class="title">{% translate "Post a comment" %}</h2>
|
||||
{% csrf_token %}
|
||||
{% render_honeypot_field "website" %}
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
{% block secondary-nav %}
|
||||
<form class="nav secondary">
|
||||
{% for id, title in view.categories.items %}
|
||||
<a class="nav-item{% if category_id == id %} active{% endif %}"
|
||||
<a class="nav-item{% if category_id == id or parent and parent.category_id == id %} active{% endif %}"
|
||||
href="?category__id={{ id }}">{{ title }}</a>
|
||||
{% endfor %}
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -16,9 +16,9 @@
|
|||
{% endfor %}
|
||||
</section>
|
||||
|
||||
<nav class="list-urls">
|
||||
<nav class="nav-urls">
|
||||
<a href="{% url "episode-list" parent_slug=program.slug %}">
|
||||
{% translate "All episodes" %}
|
||||
{% translate "See more" %}
|
||||
</a>
|
||||
</nav>
|
||||
</section>
|
||||
|
|
@ -35,10 +35,10 @@
|
|||
{% endfor %}
|
||||
</section>
|
||||
|
||||
<nav class="list-urls">
|
||||
<nav class="nav-urls">
|
||||
<a href="{% url "article-list" parent_slug=program.slug %}"
|
||||
aria-label="{% translate "Show all program's articles" %}">
|
||||
{% translate "All articles" %}
|
||||
{% translate "See more" %}
|
||||
</a>
|
||||
</nav>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ Context variables:
|
|||
|
||||
<div class="actions">
|
||||
{% block actions %}
|
||||
<a class="button btn-hg float-right" href="{{ object.get_absolute_url|escape }}">
|
||||
<a class="button float-right" href="{{ object.get_absolute_url|escape }}">
|
||||
<span class="icon">
|
||||
<i class="fas fa-external-link"></i>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -90,7 +90,10 @@ def do_nav_items(context, menu, **kwargs):
|
|||
|
||||
@register.simple_tag(name="update_query")
|
||||
def do_update_query(obj, **kwargs):
|
||||
"""Replace provided querydict's values with **kwargs."""
|
||||
"""Replace provided querydict's values with **kwargs.
|
||||
|
||||
Values set to ``None`` will be dropped.
|
||||
"""
|
||||
for k, v in kwargs.items():
|
||||
if v is not None:
|
||||
obj[k] = list(v) if hasattr(v, "__iter__") else [v]
|
||||
|
|
@ -103,4 +106,6 @@ def do_update_query(obj, **kwargs):
|
|||
def do_verbose_name(obj, plural=False):
|
||||
"""Return model's verbose name (singular or plural) or `obj` if it is a
|
||||
string (can act for default values)."""
|
||||
return obj if isinstance(obj, str) else obj._meta.verbose_name_plural if plural else obj._meta.verbose_name
|
||||
if isinstance(obj, str):
|
||||
return obj
|
||||
return obj._meta.verbose_name_plural if plural else obj._meta.verbose_name
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
from django.shortcuts import reverse
|
||||
|
||||
from ..filters import EpisodeFilters
|
||||
from ..models import Episode, Program, StaticPage
|
||||
from .page import PageListView
|
||||
|
|
@ -17,6 +19,14 @@ class EpisodeDetailView(ProgramPageDetailView):
|
|||
kwargs["tracks"] = self.object.track_set.order_by("position")
|
||||
return super().get_context_data(**kwargs)
|
||||
|
||||
def get_related_queryset(self):
|
||||
return (
|
||||
self.get_queryset().parent(self.object.parent).exclude(pk=self.object.pk).published().order_by("-pub_date")
|
||||
)
|
||||
|
||||
def get_related_url(self):
|
||||
return reverse("episode-list", kwargs={"parent_slug": self.object.parent.slug})
|
||||
|
||||
|
||||
class EpisodeListView(PageListView):
|
||||
model = Episode
|
||||
|
|
|
|||
|
|
@ -119,7 +119,12 @@ class PageListView(FiltersMixin, BasePageListView):
|
|||
if cat_id:
|
||||
cat_id = int(cat_id)
|
||||
kwargs["category_id"] = cat_id
|
||||
return super().get_context_data(**kwargs)
|
||||
|
||||
context = super().get_context_data(**kwargs)
|
||||
if context.get("parent") and not cat_id:
|
||||
kwargs["category_id"] = context["parent"].category_id
|
||||
|
||||
return context
|
||||
|
||||
|
||||
class PageDetailView(BasePageDetailView):
|
||||
|
|
@ -128,6 +133,16 @@ class PageDetailView(BasePageDetailView):
|
|||
template_name = None
|
||||
context_object_name = "page"
|
||||
|
||||
related_count = 3
|
||||
|
||||
def get_related_queryset(self):
|
||||
"""Return a queryset of related pages or None."""
|
||||
return None
|
||||
|
||||
def get_related_url(self):
|
||||
"""Return an url to the list of related pages."""
|
||||
return None
|
||||
|
||||
def get_template_names(self):
|
||||
return super().get_template_names() + ["aircox/page_detail.html"]
|
||||
|
||||
|
|
@ -138,8 +153,16 @@ class PageDetailView(BasePageDetailView):
|
|||
if self.object.allow_comments and "comment_form" not in kwargs:
|
||||
kwargs["comment_form"] = CommentForm()
|
||||
kwargs["comments"] = Comment.objects.filter(page=self.object).order_by("-date")
|
||||
|
||||
if self.object.parent_subclass:
|
||||
kwargs["parent"] = self.object.parent_subclass
|
||||
|
||||
if "related_objects" not in kwargs:
|
||||
related = self.get_related_queryset()
|
||||
if related:
|
||||
related = related[: self.related_count]
|
||||
kwargs["related_objects"] = related
|
||||
kwargs["related_url"] = self.get_related_url()
|
||||
return super().get_context_data(**kwargs)
|
||||
|
||||
@classmethod
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import random
|
||||
|
||||
from django.urls import reverse
|
||||
|
||||
from ..models import Article, Page, Program, StaticPage, Episode
|
||||
|
|
@ -23,6 +25,19 @@ class BaseProgramMixin:
|
|||
class ProgramDetailView(BaseProgramMixin, PageDetailView):
|
||||
model = Program
|
||||
|
||||
def get_related_queryset(self):
|
||||
queryset = (
|
||||
self.get_queryset()
|
||||
.filter(category_id=self.object.category_id)
|
||||
.exclude(pk=self.object.pk)
|
||||
.published()
|
||||
.order_by("-pub_date")[:50]
|
||||
)
|
||||
return random.sample(list(queryset), self.related_count)
|
||||
|
||||
def get_related_url(self):
|
||||
return reverse("program-list") + f"?category__id={self.object.category_id}"
|
||||
|
||||
def get_context_data(self, **kwargs):
|
||||
episodes = Episode.objects.program(self.object).published().order_by("-pub_date")
|
||||
articles = Article.objects.parent(self.object).published().order_by("-pub_date")
|
||||
|
|
|
|||
|
|
@ -5,21 +5,33 @@ $font-special-url: url("assets/Bagnard.otf");
|
|||
|
||||
$black: #000;
|
||||
$white: #fff;
|
||||
$red: #e00;
|
||||
$red-dark: #b00;
|
||||
$green: #0e0;
|
||||
$green-dark: #0b0;
|
||||
|
||||
$mp-1: 0.2em;
|
||||
$mp-2: 0.4em;
|
||||
$mp-3: 0.8em;
|
||||
$mp-4: 1.2em;
|
||||
$mp-5: 1.6em;
|
||||
$mp-6: 2em;
|
||||
$mp-7: 4em;
|
||||
$mp-1: 0.2rem;
|
||||
$mp-1e: 0.2em;
|
||||
$mp-2: 0.4rem;
|
||||
$mp-2e: 0.4em;
|
||||
$mp-3: 0.6rem;
|
||||
$mp-3e: 0.6em;
|
||||
$mp-4: 1.2rem;
|
||||
$mp-4e: 1.2em;
|
||||
$mp-5: 1.6rem;
|
||||
$mp-5e: 1.6em;
|
||||
$mp-6: 2rem;
|
||||
$mp-6e: 2em;
|
||||
$mp-7: 4rem;
|
||||
$mp-7e: 4em;
|
||||
|
||||
$text-size-small: 0.6em;
|
||||
$text-size-smaller: 0.8em;
|
||||
$text-size: 1em;
|
||||
$text-size-medium: 1.4em;
|
||||
$text-size-bigger: 1.6em;
|
||||
$text-size-big: 2em;
|
||||
$text-size-small: 0.6rem;
|
||||
$text-size-smaller: 0.8rem;
|
||||
$text-size: 1rem;
|
||||
$text-size-2: 1.2rem;
|
||||
$text-size-medium: 1.4rem;
|
||||
$text-size-bigger: 1.6rem;
|
||||
$text-size-big: 2rem;
|
||||
|
||||
$h1-size: 40px;
|
||||
$h2-size: 32px;
|
||||
|
|
@ -152,10 +164,15 @@ a.navbar-item.is-active {
|
|||
//-- general
|
||||
:root {
|
||||
--text-color: black;
|
||||
--disabled-color: #aaa;
|
||||
--disabled-bg: #eee;
|
||||
|
||||
--highlight-color: rgba(255, 255, 0, 1);
|
||||
--highlight-color-alpha: rgba(255, 255, 0, 0.7);
|
||||
--highlight-color-grey: rgba(230, 230, 60, 1);
|
||||
--highlight-color-2: rgb(0, 0, 254);
|
||||
--highlight-color-2-alpha: rgb(0, 0, 254, 0.7);
|
||||
--highlight-color-2-grey: rgba(50, 200, 200, 1);
|
||||
|
||||
--header-height: 30em;
|
||||
|
||||
|
|
@ -165,10 +182,7 @@ a.navbar-item.is-active {
|
|||
--heading-bg-highlight-color: var(--highlight-color-2);
|
||||
--heading-font-family: default;
|
||||
|
||||
--preview-media-height: 10em;
|
||||
--preview-media-cover-size: 10em;
|
||||
|
||||
--preview-cover-size: 24em;
|
||||
--preview-cover-size: 18em;
|
||||
--preview-cover-small-size: 10em;
|
||||
|
||||
--player-panel-bg: var(--highlight-color);
|
||||
|
|
@ -182,6 +196,7 @@ a.navbar-item.is-active {
|
|||
|
||||
|
||||
body {
|
||||
font-size: 1.4em;
|
||||
background-color: $body-background-color;
|
||||
}
|
||||
|
||||
|
|
@ -192,13 +207,14 @@ section > .toolbar {
|
|||
}
|
||||
|
||||
|
||||
// ---- main theme & layout
|
||||
h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
||||
font-family: var(--heading-font-family);
|
||||
}
|
||||
|
||||
|
||||
// ---- main theme & layout
|
||||
.page {
|
||||
padding-bottom: 5em;
|
||||
padding-bottom: 5rem;
|
||||
|
||||
a {
|
||||
background-color: var(--highlight-color-alpha);
|
||||
|
|
@ -207,10 +223,6 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
padding: $mp-2;
|
||||
}
|
||||
|
||||
.content {
|
||||
font-size: $text-size-big;
|
||||
}
|
||||
|
||||
section.container {
|
||||
padding-top: $mp-6;
|
||||
|
||||
|
|
@ -229,6 +241,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
|
||||
|
||||
// ---- helpers
|
||||
// -- layout
|
||||
.d-inline { display: inline; }
|
||||
.d-block { display: block; }
|
||||
.d-inline-block { display: inline-block; }
|
||||
|
|
@ -239,6 +252,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
.p-sticky { position: sticky }
|
||||
.p-static { position: static }
|
||||
|
||||
.align-left { text-align: left; justify-content: left; }
|
||||
.align-right { text-align: right; justify-content: right; }
|
||||
|
||||
.height-full { height: 100%; }
|
||||
|
|
@ -247,34 +261,82 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
|
||||
.no-border { border: 0px !important; }
|
||||
|
||||
.is-clickable { cursor: pointer; }
|
||||
|
||||
|
||||
// ---- components
|
||||
.btn-hg, .btn-outline-hg {
|
||||
border: 0.1em var(--highlight-color) solid;
|
||||
background-color: var(--highlight-color-alpha) !important;
|
||||
border-radius: 0.2em;
|
||||
// -- colors
|
||||
.is-success {
|
||||
background-color: $green !important;
|
||||
border-color: $green-dark !important;
|
||||
}
|
||||
.is-danger {
|
||||
background-color: $red !important;
|
||||
border-color: $red-dark !important;
|
||||
}
|
||||
|
||||
.button {
|
||||
border-radius: 0px;
|
||||
border-color: var(--highlight-color-2-alpha);
|
||||
// ---- components
|
||||
.dropdown-item {
|
||||
font-size: unset !important
|
||||
}
|
||||
|
||||
.vc-weekday-1, .vc-weekday-7 {
|
||||
color: var(--highlight-color-2) !important;
|
||||
}
|
||||
|
||||
|
||||
// -- buttons, forms
|
||||
.button, a.button, button.button, .nav-urls a {
|
||||
display: inline-block;
|
||||
padding: $mp-3e;
|
||||
border-radius: 4px;
|
||||
border: 1px var(--highlight-color-2-alpha) solid;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
font-size: $text-size-medium;
|
||||
|
||||
background-color: var(--highlight-color);
|
||||
|
||||
.icon {
|
||||
vertical-align: middle;
|
||||
&:first-child { margin-right: $mp-3; }
|
||||
&:last-child { margin-left: $mp-3 }
|
||||
}
|
||||
|
||||
|
||||
&:hover {
|
||||
border-color: var(--highlight-color-2) !important;
|
||||
color: var(--highlight-color-2) !important;
|
||||
border-color: var(--highlight-color-2);
|
||||
color: var(--highlight-color-2);
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border-color: var(--highlight-color-alpha);
|
||||
background-color: var(--highlight-color-2);
|
||||
color: var(--highlight-color);
|
||||
|
||||
&:hover {
|
||||
border-color: var(--highlight-color);
|
||||
background-color: var(--highlight-color-2-alpha);
|
||||
opacity: 1 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&:not([disabled]), &:not(.disabled) {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&[disabled], &.disabled {
|
||||
background-color: var(--highlight-color-grey);
|
||||
color: var(--highlight-color-2);
|
||||
border-color: var(--highlight-color-2-alpha);
|
||||
}
|
||||
|
||||
.actions &, &.action {
|
||||
background-color: var(--highlight-color);
|
||||
justify-content: center;
|
||||
padding: $mp-2 !important;
|
||||
min-width: 2em;
|
||||
min-width: 2rem;
|
||||
|
||||
.not-selected { opacity: 0.6; }
|
||||
|
||||
|
||||
.icon { margin: 0em !important; }
|
||||
.not-selected { opacity: 0.6; }
|
||||
|
||||
label {
|
||||
margin-left: $mp-2;
|
||||
|
|
@ -298,9 +360,8 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
border-bottom: 0px;
|
||||
height: 100%;
|
||||
|
||||
&:last-child {
|
||||
border-right: 0px;
|
||||
}
|
||||
&:not(:first-child) { border-left: 0px; }
|
||||
&:last-child { border-right: 0px; }
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -311,6 +372,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
}
|
||||
|
||||
|
||||
// -- headings
|
||||
.title {
|
||||
text-transform: uppercase;
|
||||
|
||||
|
|
@ -339,25 +401,6 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
}
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
font-size: unset !important
|
||||
}
|
||||
|
||||
.list-urls {
|
||||
margin-top: $mp-3;
|
||||
text-align: right;
|
||||
font-size: $text-size-medium;
|
||||
|
||||
a:not(:last-child) {
|
||||
margin-right: $mp-3;
|
||||
}
|
||||
}
|
||||
|
||||
.vc-weekday-1, .vc-weekday-7 {
|
||||
color: var(--highlight-color-2) !important;
|
||||
}
|
||||
|
||||
|
||||
// ---- main navigation
|
||||
.nav {
|
||||
display: flex;
|
||||
|
|
@ -385,7 +428,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
padding: $mp-3;
|
||||
|
||||
img {
|
||||
width: 14em !important;
|
||||
width: 12rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -395,7 +438,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
}
|
||||
|
||||
.nav-item {
|
||||
font-size: $text-size-medium;
|
||||
font-size: $text-size-2;
|
||||
font-weight: $weight-bold;
|
||||
}
|
||||
}
|
||||
|
|
@ -404,7 +447,7 @@ h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
|
|||
justify-content: right;
|
||||
|
||||
.nav-item {
|
||||
font-size: 1.2em;
|
||||
font-size: $text-size;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -418,6 +461,46 @@ nav li {
|
|||
}
|
||||
|
||||
|
||||
.nav-urls {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
margin-top: $mp-3;
|
||||
text-align: right;
|
||||
font-size: $text-size-medium;
|
||||
|
||||
> a:only-child {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.urls {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: $mp-3;
|
||||
justify-content: center;
|
||||
|
||||
a:not(:last-child) {
|
||||
margin-right: $mp-3;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.left {
|
||||
flex-grow: 0;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.right {
|
||||
flex-grow: 0;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
// ---- ---- detail
|
||||
.page-content {
|
||||
margin-top: $mp-6;
|
||||
|
|
@ -641,8 +724,6 @@ nav li {
|
|||
|
||||
|
||||
// -- program grid
|
||||
|
||||
|
||||
.card-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
|
|
@ -729,7 +810,7 @@ nav li {
|
|||
align-items: center;
|
||||
flex-direction: row;
|
||||
|
||||
height: 3em;
|
||||
height: 3rem;
|
||||
background-color: var(--highlight-color-alpha);
|
||||
|
||||
&.playing, &.playing .title {
|
||||
|
|
@ -738,21 +819,35 @@ nav li {
|
|||
|
||||
&:hover {
|
||||
background-color: var(--highlight-color);
|
||||
|
||||
.title {
|
||||
color: var(--highlight-color-2) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.title:hover::before, &.playing .title::before {
|
||||
content: "\f04b";
|
||||
font-family: "Font Awesome 6 Free";
|
||||
margin-right: $mp-3e;
|
||||
}
|
||||
&.playing .title:hover::before {
|
||||
content: '';
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
.headings > * {
|
||||
}
|
||||
|
||||
.title {
|
||||
cursor: pointer;
|
||||
|
||||
.icon {
|
||||
padding: 0em $mp-3;
|
||||
}
|
||||
|
||||
margin: 0em;
|
||||
padding: 0em;
|
||||
padding: $mp-3e;
|
||||
font-size: $text-size-medium;
|
||||
}
|
||||
.button {
|
||||
|
|
@ -826,20 +921,12 @@ nav li {
|
|||
font-size: $text-size-bigger;
|
||||
height: 100%;
|
||||
padding: auto 0.2em !important;
|
||||
min-width: 2.5em;
|
||||
min-width: 3em;
|
||||
border-radius: 0px;
|
||||
transition: background-color 0.5s;
|
||||
|
||||
&:hover {
|
||||
color: var(--highlight-color-2) !important;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: var(--highlight-color-2);
|
||||
}
|
||||
|
||||
&.open {
|
||||
background-color: var(--highlight-color-2);
|
||||
background-color: var(--highlight-color-2-alpha);
|
||||
color: var(--highlight-color);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,14 +12,14 @@ $menu-item-active-background-color: #d2d2d2;
|
|||
@import "~bulma/sass/components/media";
|
||||
@import "~bulma/sass/components/message";
|
||||
@import "~bulma/sass/components/modal";
|
||||
@import "~bulma/sass/components/pagination";
|
||||
//@import "~bulma/sass/components/pagination";
|
||||
|
||||
@import "~bulma/sass/form/_all";
|
||||
@import "~bulma/sass/grid/_all";
|
||||
@import "~bulma/sass/helpers/_all";
|
||||
@import "~bulma/sass/layout/_all";
|
||||
@import "~bulma/sass/elements/box";
|
||||
@import "~bulma/sass/elements/button";
|
||||
// @import "~bulma/sass/elements/button";
|
||||
@import "~bulma/sass/elements/container";
|
||||
@import "~bulma/sass/elements/content";
|
||||
@import "~bulma/sass/elements/icon";
|
||||
|
|
|
|||
|
|
@ -1,27 +1,24 @@
|
|||
<template>
|
||||
<div :class="['a-sound-item m-0 button-group', playing && 'playing' || '']">
|
||||
<slot name="title" :player="player" :item="item" :loaded="loaded">
|
||||
<span :class="['title is-flex-grow-1', playing && 'blink' || '']" @click.stop="$emit('togglePlay')">
|
||||
<span class="icon mr-3">
|
||||
<i class="fa fa-play"></i>
|
||||
</span>
|
||||
<span :class="['title is-flex-grow-1 align-left', playing && 'blink' || '']" @click.stop="$emit('togglePlay')">
|
||||
{{ name || item.name }}
|
||||
</span>
|
||||
</slot>
|
||||
<div class="button-group actions">
|
||||
<a class="button" v-if="hasAction('page')"
|
||||
<a class="button action" v-if="hasAction('page')"
|
||||
:href="item.data.page_url">
|
||||
<span class="icon is-small">
|
||||
<i class="fa fa-external-link"></i>
|
||||
</span>
|
||||
</a>
|
||||
<a class="button" v-if="item.data.is_downloadable"
|
||||
<a class="button action" v-if="item.data.is_downloadable"
|
||||
:href="item.data.url" target="_blank">
|
||||
<span class="icon is-small">
|
||||
<span class="fa fa-download"></span>
|
||||
</span>
|
||||
</a>
|
||||
<button :class="['button', pinned ? 'selected' : 'not-selected']" v-if="player && player.sets.pin != $parent.set" @click.stop="player.togglePin(item)">
|
||||
<button :class="['button action', pinned ? 'selected' : 'not-selected']" v-if="player && player.sets.pin != $parent.set" @click.stop="player.togglePin(item)">
|
||||
<span class="icon is-small">
|
||||
<span class="fa fa-star"></span>
|
||||
</span>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user