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

radiocampus: misc adjustments

Browse Source
This commit is contained in:
Chris Tactic
2024-09-24 15:10:50 +02:00
parent 3fa038ddf9
commit efac8997f2
8 changed files with 145 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
radiocampus/static/radiocampus/radiocampus.css
View File

@ -93,6 +93,7 @@ body.yellow.home #grandlogo img {
}
body.yellow .nav .nav-item.active {
color: #738EF2 !important;
text-shadow: -3px 3px 17px rgb(0, 48, 111);
}
body.blue #grandlogo img, body.yellow #grandlogo img {
width: 120px;
@ -104,11 +105,10 @@ body.blue.home #grandlogo, body.yellow.home #grandlogo {
}
body.blue.home #grandlogo img , body.yellow.home #grandlogo img {
margin: 12px auto 0 auto;
width: 960px;
width: 100%;
opacity: 0.8;
}
.a-player-bar {
border-top: 1px solid #555;
}
@ -129,7 +129,8 @@ a.heading.title {
}
a.heading.title:hover {
color: var(--link-hv-fg);
/*color: var(--link-hv-fg); */
color: #738ef2;
}
.button, a.button, button.button {
border: 0;
@ -141,6 +142,10 @@ a.heading.title:hover {
.header.has-cover {
min-height: unset;
}
.item-section {display:flex; align-items:end}
.fifty {
width: 55%;
}
.grid.list-emissions {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-auto-flow: dense;
@ -157,7 +162,7 @@ a.heading.title:hover {
border-bottom: 1px solid black;
}
.lagrille .category {
color: grey;
color: white;
margin-left: 10px;
vertical-align: text-bottom;
font-size: 0.8rem;
@ -297,7 +302,7 @@ a.nav-item:hover {
@media screen and (min-width: 1216px) {
.container:not(.is-max-desktop):not(.is-max-widescreen) {
max-width: unset;
margin: 10px 64px;
margin: 0 64px;
}
body.home .container:not(.is-max-desktop):not(.is-max-widescreen) {
max-width: 1152px;
@ -450,17 +455,19 @@ a.nav-item:hover {
/* fred fixes */
.grid.list-emissions:not(.list-home) {display: flex !important;flex-wrap: wrap !important; gap: 20px 1rem;}
.grid.list-emissions:not(.list-home) > .list-item {width: calc(25% - 2rem) !important ;}
.grid.list-emissions:not(.list-home) > .list-item {width: calc(20% - 2rem) !important ;}
.grid.list-emissions:not(.list-home) > .list-item .preview-cover {max-width: 100% !important;
display: block;
width: 50% !important;
width: 100% !important;
min-width: auto;
aspect-ratio: 1 / 1;
height: fit-content;
background-size: contain;
background-position: center;
background-color: white;}
background-size: contain;
background-position: center;
background-color: white;
margin-bottom: 0.5rem;
}
.grid.list-emissions:not(.list-home) .media-content {margin-top: 0;}
@ -483,9 +490,10 @@ background-color: white;}
min-width: auto;
aspect-ratio: 1 / 1;
height: fit-content;
background-size: contain;
background-position: center;
background-color: white;}
background-size: contain;
background-position: center;
background-color: white;
}
.grid.list-podcasts .media-content {margin-top: 0;}
@ -502,16 +510,16 @@ background-color: white;}
}
@media screen and (max-width: 1224px) {
.grid.list-emissions > .list-item {width: calc(33% - 2rem) !important;;}
.grid.list-emissions:not(.list-home) > .list-item {width: calc(33% - 2rem) !important;;}
}
@media screen and (max-width: 924px) {
.grid.list-emissions > .list-item {width: calc(50% - 2rem) !important;}
.grid.list-emissions:not(.list-home) > .list-item {width: calc(50% - 2rem) !important;}
}
@media screen and (max-width: 690px) {
@media screen and (max-width: 1024px) {
.grid.list-emissions > .list-item {width: 100% !important;}
.program-list {flex-direction: row;}
.program-list {flex-direction: column;}
.grid.list-podcasts > .list-item {width: 100% !important ;}
}
@ -538,3 +546,16 @@ background-color: white;}
}
}
}
@media screen and (max-width: 540px) {
.media {
flex-direction: column;
}
.grid.list-podcasts .media .media-content {width:100%}
.grid.list-emissions:not(.list-home) > .list-item {
width: 100% !important;
}
}
.list-item .media-content {height:auto;}

8
radiocampus/templates/aircox/base.html
View File

@ -8,7 +8,7 @@
{% endblock %}
{% block nav %}
<div id="grandlogo"><a href="/"><img /></a></div>
<div id="grandlogo" class="container"><a href="/"><img /></a></div>
{{ block.super }}
{% endblock %}
@ -17,3 +17,9 @@
{{ block.super }}
{% endif %}
{% endblock %}
{% block header-cover %}
{% if cover and not "emissions/episodes" in request.path %}
<img src="{{ cover }}" ref="cover" class="cover">
{% endif %}
{% endblock %}

19
radiocampus/templates/aircox/episode_list.html
View File

@ -21,3 +21,22 @@
{{ block.super }}
{% endwith %}
{% endblock %}
{% block secondary-nav %}
{% if not parent and categories %}
<nav class="nav secondary">
<div class="nav-menu nav-categories">
{% for cat in categories %}
<a class="nav-item{% if cat == category %} active{% endif %}"
href="{% url request.resolver_match.url_name category_slug=cat.slug %}">
{{ cat.title }}
</a>
{% endfor %}
</div>
<a-switch class="button burger"
el=".nav-categories" group="nav" icon="fas fa-tags"
aria-label="{% translate "Categories" %}">
</a-switch>
</nav>
{% endif %}
{% endblock %}

10
radiocampus/templates/aircox/home.html
View File

@ -30,10 +30,14 @@ function display(id) {
if (id == "homedisplay") {
for(var i = 0; i < h.length; i++) { h[i].setAttribute('style', 'display:inline !important'); }
for(var i = 0; i < h.length; i++) { r[i].setAttribute('style', 'display:none !important'); }
for(var i = 0; i < r.length; i++) { r[i].setAttribute('style', 'display:none !important'); }
document.getElementById('recent-link').classList.remove('active');
document.getElementById('home-link').classList.add('active');
} else {
for(var i = 0; i < h.length; i++) { h[i].setAttribute('style', 'display:none !important'); }
for(var i = 0; i < h.length; i++) { r[i].setAttribute('style', 'display:inline !important'); }
for(var i = 0; i < r.length; i++) { r[i].setAttribute('style', 'display:inline !important'); }
document.getElementById('recent-link').classList.add('active');
document.getElementById('home-link').classList.remove('active');
}
@ -69,7 +73,7 @@ function display(id) {
<!-- <a href="{% url "timetable-list" date=date %}">{{ date|date:"l d F Y" }}</a> -->
<section class="clear-both list grid radiocampus-grid" role="list">
</section>
{% with list_class="radiocampus-grid" %}
{% with list_class="list-home" %}
{{ block.super }}
{% endwith %}
</div>

3
radiocampus/templates/aircox/public.html
View File

@ -19,8 +19,7 @@ content.
{% block header %}{% if page %}{{ block.super }}{% endif %}{% endblock %}
{% block secondary-nav %}
{% if not parent and categories %}
{% else %}
{% if '/pages/' in request.path %}
<nav class="nav secondary">
<div class="nav-menu nav-categories">
{% nav_items "secondary" css_class="nav-item" active_class="active" as items %}

2
radiocampus/templates/aircox/timetable_list.html
View File

@ -28,7 +28,7 @@
{% with list_class="grid" %}
<section class="container clear-both list grid list-grille list-home list-emissions" role="list">
<section class="container" style="display:flex;justify-content:flex-end;min-height:600px">
<div>
<div class="fifty">
{% block list %}
{% with object_list=object_list timetable=True %}
{% with widget|default:"item" as widget %}

2
radiocampus/templates/aircox/widgets/item.html
View File

@ -32,7 +32,7 @@
</span>
</br>
<section class="content flex-grow-1">
<section class="content flex-grow-1 item-section">
{% block content %}{{ block.super }}{% endblock %}
</section>
{% block actions-container %}{{ block.super }}{% endblock %}

71
radiocampus/templates/aircox/widgets/preview.html Normal file
View File

@ -0,0 +1,71 @@
{% load i18n %}
{% comment %}
Content related context:
- object: object to display
- cover: cover
- title: title
- subtitle: subtitle
- content: content to display
Components:
- no_cover: don't show cover
- no_content: don't show content
Styling related context:
- is_active: add "active" css class
- is_small: add "small" css class
- is_tiny: add "tiny" css class
- tag
- tag_class: css class to set to main tag
- tag_extra: extra tag attributes
{% endcomment %}
{% load aircox %}
{% block outer %}
<{{ tag|default:"article" }} id="{{ object|object_id }}" class="preview {% if not cover %}no-cover {% endif %}{% if is_active %}active {% endif %}{% if is_tiny %}tiny{% elif is_small %}small{% endif %}{% block tag-class %}{{ tag_class|default:"" }} {% endblock %}" {% block tag-extra %}{% endblock %}>
{% block inner %}
{% block headings-container %}
<header class="headings{% block headings-class %}{% endblock %}"{% block headings-tag-extra %}{% endblock %}>
{% block headings %}
{% block title-container %}
<a href="{{ url|escape }}" class="heading title {% block title-class %}{% endblock %}"{% if title %} title="{{ title|escape }}"{% endif %}>
{% block title %}{{ title|default:"" }}{% endblock %}
</a>
{% endblock %}
{% block subtitle-container %}
<span class="heading subtitle {% block subtitle-class %}{% endblock %}">
{% block subtitle %}{{ subtitle|default:"" }}{% endblock %}
</span>
{% endblock %}
{% endblock %}
</header>
{% endblock %}
{% block content-container %}
<section class="content headings-container">
{% block content %}
{% if content and not no_content %}
{% autoescape off %}
{{ content|striptags|linebreaks }}
{% endautoescape %}
{% endif %}
{% spaceless %}
<div class="actions">
{% block actions %}
{% if admin and object.edit_url_name %}
<a href="{% url object.edit_url_name pk=object.pk %}">{% translate "Edit" %}</a>
{% endif %}
{% endblock %}
</div>
{% endspaceless %}
{% endblock %}
</section>
{% endblock %}
{% endblock %}
</{{ tag|default:"article" }}>
{% endblock %}