ctactic/aircox-radiocampus
1
0
Fork 0
forked from rc/aircox
Code Issues 10 Pull Requests Activity

radiocampus: fred css reshape

Browse Source
This commit is contained in:
Chris Tactic 2024-09-19 11:18:53 +02:00
parent 29b4dc2de5
commit acfd5c49b7
4 changed files with 111 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
radiocampus/static/radiocampus/radiocampus.css
View File

@ -141,19 +141,19 @@ a.heading.title:hover {
.header.has-cover {
min-height: unset;
}
.grid.listfive {
.grid.list-emissions {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-auto-flow: dense;
gap: 0.2rem;
}
.grid.listfive .media-content {
.grid.list-emissions .media-content {
font-size: 0.84rem;
}
.today {
color: yellow;
font-size: 1.4em !important;
}
.lagrille:not(.homedisplay) article {
.list-grille article {
border-bottom: 1px solid black;
}
.lagrille .category {
@ -188,35 +188,35 @@ a.nav-item:hover {
flex-direction: column;
}
.radiocampus-grid {
.list-home {
display: block;
}
.radiocampus-grid article div.media {
.list-home article div.media {
line-height: 1;
padding: 0;
}
.radiocampus-grid article.active div.media div.media-content a, .radiocampus-grid article.active div.media div.media-content span {
.list-home article.active div.media div.media-content a, .list-home article.active div.media div.media-content span {
color: yellow;
}
.radiocampus-grid article.active div.media a:before {
.list-home article.active div.media a:before {
content: "\2192";
margin-right: 6px;
}
.radiocampus-grid article div.media a.preview-cover {
.list-home article div.media a.preview-cover {
display: none;
}
.radiocampus-grid article div.media div.media-content.flex-column {
.list-home article div.media div.media-content.flex-column {
display: unset;
}
.radiocampus-grid article div.media div.media-content section.content {
.list-home article div.media div.media-content section.content {
display: none;
}
.radiocampus-grid article div.media div.media-content div.episode-date {
.list-home article div.media div.media-content div.episode-date {
display: none;
}
.radiocampus-grid article div.media div.media-content span.heading.subtitle {
.list-home article div.media div.media-content span.heading.subtitle {
float: right;
}
.schedule {
@ -263,7 +263,7 @@ a.nav-item:hover {
.dropdown.is-right .dropdown-menu {
left: 0;
}
.grid.listfive {
.grid.list-emissions {
grid-template-columns: 1fr 1fr 1fr;
}
#grandlogo {
@ -306,7 +306,7 @@ a.nav-item:hover {
}
@media screen and (max-width: 900px) {
.grid.listfive {
.grid.list-emissions {
grid-template-columns: 1fr 1fr;
}
}
@ -444,3 +444,97 @@ 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 .preview-cover {max-width: 100% !important;
display: block;
width: 50% !important;
min-width: auto;
aspect-ratio: 1 / 1;
height: fit-content;
background-size: contain;
background-position: center;
background-color: white;}
.grid.list-emissions:not(.list-home) .media-content {margin-top: 0;}
.grid.list-emissions:not(.list-home) > .list-item .media .media-content > br, .grid.listfive > .list-item .media .media-content .episode-date > br {display: none;}
.grid.list-emissions:not(.list-home) .list-item .subtitle {text-align: left !important;font-size: 0.8rem !important;}
.grid.list-emissions:not(.list-home) .preview.active .heading:not(:empty) {
color: #738EF2 !important;
}
.grid.list-podcasts {display: flex !important;flex-wrap: wrap !important; gap: 20px 1rem;}
.grid.list-podcasts > .list-item {width: calc(50% - 2rem) !important ;}
.grid.list-podcasts > .list-item .preview-cover {max-width: 100% !important;
display: block;
width: 50% !important;
min-width: auto;
aspect-ratio: 1 / 1;
height: fit-content;
background-size: contain;
background-position: center;
background-color: white;}
.grid.list-podcasts .media-content {margin-top: 0;}
.grid.list-podcasts .media .media-left {width: 25% !important;}
.grid.list-podcasts .media .media-content {width: 75%;}
.grid.list-podcasts > .list-item .media .media-content > br, .grid.list-emissions > .list-item .media .media-content .episode-date > br {display: none;}
.grid.list-podcasts .list-item .subtitle {text-align: left !important;font-size: 0.8rem !important;}
.grid.list-podcasts .preview.active .heading:not(:empty) {
color: #738EF2 !important;
}
@media screen and (max-width: 1224px) {
.grid.list-emissions > .list-item {width: calc(33% - 2rem) !important;;}
}
@media screen and (max-width: 924px) {
.grid.list-emissions > .list-item {width: calc(50% - 2rem) !important;}
}
@media screen and (max-width: 690px) {
.grid.list-emissions > .list-item {width: 100% !important;}
.program-list {flex-direction: row;}
.grid.list-podcasts > .list-item {width: 100% !important ;}
}
.list-item .subtitle:not(:empty) {
min-width: auto !important;
}
@media screen and (max-width: 924px) {
.a-player-bar-content {overflow: hidden;}
.a-player-bar-content .title {
display: inline-block;
padding-right: 2em;
padding-left: 100%;
white-space: nowrap;
animation: defilement-rtl 55s infinite linear;
overflow: visible;}
@keyframes defilement-rtl {
0% {
transform: translate3d(0,0,0); /* position initiale à droite */
}
100% {
transform: translate3d(-100%,0,0); /* position finale à gauche */
}
}
}

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

@ -55,7 +55,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>

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

@ -65,7 +65,7 @@
{% endblock %}
{% block list-container %}
<section class="container clear-both list grid {{ list_class|default:"" }} listfive" role="list">
<section class="container clear-both list grid {{ list_class|default:"" }} list-emissions" role="list">
{% block list %}
{% with has_headline=True %}
{% for object in object_list %}

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

@ -36,7 +36,7 @@
{% block list-container %}
{% with list_class="grid" %}
<section class="container clear-both list grid radiocampus-grid listfive" role="list">
<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 style="max-width:600px;">
{% block list %}