siteweb/libreavous
7
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

v0.5.0 : bond en avant page accueil/émission/rubrique émissions

Browse Source
This commit is contained in:
chankalan 2021-07-30 00:11:35 +02:00
parent b1fd6c89f5
commit de15896b80
16 changed files with 722 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
lang/libreavous_fr.php
View File

@ -19,4 +19,25 @@ $GLOBALS[$GLOBALS['idx_lang']] = array(
'photos_de_l_emission' => 'Photos de l’émission',
'galerie_april' => 'Galerie April',
'dernieres_emissions' => 'Dernières émissions',
'derniere_emission' => 'Dernière émission',
'toutes_les_emissions' => 'Toutes les émissions',
'emissions_precedentes' => 'Émissions pécédentes',
'dernieres_chroniques' => 'Dernières chroniques',
'au_programme' => 'Au programme',
'transcription' => 'Transcription',
'personnes_participantes' => 'Personnes participantes',
'references' => 'Références',
'transcription' => 'Transcription',
'pauses_musicales' => 'Pauses musicales',
'licence' => 'Licence',
'diffusee_le' => 'Diffusée le',
'diffusee_en_direct_le' => 'Diffusée en direct le ',
'toutes_les_emissions' => 'Toutes les émissions',
'c_est_bientot' => 'C’est bientôt !',
);

2
paquet.xml
View File

@ -1,7 +1,7 @@
<paquet
prefix="libreavous"
categorie="squelette"
version="0.4.2"
version="0.5.0"
schema="0.1.4"
etat="dev"
compatibilite="[3.2.8;4.0.*]"

1
squelettes/aside/dist.html Normal file
View File

@ -0,0 +1 @@
[(#REM) rien pour l'instant ]

31
squelettes/connex/article-emission.html Normal file
View File

@ -0,0 +1,31 @@
<!-- connex -->[(#REM) charger un fichier different pour chaque page ]
<div class="page_container page_connex__container">
<div class="page_connex_content flex flex2">
<BOUCLE_remissions(RUBRIQUES){composition=emissions}>
<B_emissions>
<div class="liste articles emissions">
<h2><:libreavous:dernieres_emissions:></h2>
<ul>
<BOUCLE_emissions(ARTICLES){id_rubrique}{!par date}{0,6}>
[<li><a href="#URL_ARTICLE">(#TITRE|libreavous_supp_numero)</a></li>]
</BOUCLE_emissions>
</ul>
</div>
</B_emissions>
</BOUCLE_remissions>
<B_chroniques>
<div class="liste articles chroniques">
<h2><:libreavous:dernieres_chroniques:></h2>
<ul>
<BOUCLE_chroniques(CHAPITRES){type_sujet=CH}{!par maj}{0,6}>
[<li><a href="#URL_ARTICLE">(#TITRE|libreavous_supp_numero)</a></li>]
</BOUCLE_chroniques>
</ul>
</div>
</B_chroniques>
</div>
</div>

4
squelettes/connex/article.html Normal file
View File

@ -0,0 +1,4 @@
<!-- connex -->[(#REM) charger un fichier different pour chaque page ]
<div class="page_container page_connex__container">
</div>

3
squelettes/connex/dist.html Normal file
View File

@ -0,0 +1,3 @@
<!-- connex -->[(#REM) charger un fichier different pour chaque page ]
<div class="page_container page_connex__container">
</div>

19
squelettes/content/article-emission.html
View File

@ -57,14 +57,14 @@
<BOUCLE_sl(CHAPITRES){id_article}{type_sujet=SL}>#SET{chapitres,oui}
<div class="sujet_principal">
<h2><:libreavous:sujet_principal:></h2>
<INCLURE{fond=inclure/chapitre,env,id_chapitre,h=3} />
<INCLURE{fond=inclure/chapitre,env,id_chapitre,h=3,telecharger=oui} />
</div>
</BOUCLE_sl><B_autres>#SET{chapitres,oui}
<div class="sujet_autre">
<h2><:libreavous:et_aussi:></h2>
<div>
<BOUCLE_autres(CHAPITRES){id_article}{type_sujet!=SL}>
<INCLURE{fond=inclure/chapitre,env,id_chapitre,h=3} />
<INCLURE{fond=inclure/chapitre,env,id_chapitre,h=3,telecharger=oui} />
</BOUCLE_autres>
</div>
</div>
@ -91,21 +91,20 @@
</B_photos>
<div class="fb detail_emission">
[(#PODCAST_PERSONNES|oui)<a href="#personnesparticipantes" class="btn taille70 blanc">Personnes participantes</a>]
<a href="#references" class="btn taille70 blanc">Références</a>
[(#PODCAST_TRANSCRIPTION|oui)<a href="#transcription" class="btn taille70 blanc">Transciption</a>]
[(#PODCAST_MUSIQUE|oui)<a href="#pausesmusicales" class="btn taille70 blanc">Pauses musicales</a>]
[(#CONFIG{libreavous/licence}|oui)<a href="#licence" class="btn taille70 blanc">Licence</a>]
[(#PODCAST_PERSONNES|oui)<a href="#personnesparticipantes" class="btn taille70 blanc"><:libreavous:personnes_participantes:></a>]
<a href="#references" class="btn taille70 blanc"><:libreavous:references:></a>
[(#PODCAST_TRANSCRIPTION|oui)<a href="#transcription" class="btn taille70 blanc"><:libreavous:transcription:></a>]
[(#PODCAST_MUSIQUE|oui)<a href="#pausesmusicales" class="btn taille70 blanc"><:libreavous:pauses_musicales:></a>]
[(#CONFIG{libreavous/licence}|oui)<a href="#licence" class="btn taille70 blanc"><:libreavous:licence:></a>]
[<h2 id="personnesparticipantes">Personnes participantes</h2>
<div class="#EDIT{podcast_personnes}">(#PODCAST_PERSONNES|propre)</div>]
<h2 id="references">Références</h2>
[<div class="emission-references texte #EDIT{texte}">(#PODCAST_REFERENCES)</div>]
[<div class="emission-references texte #EDIT{texte}">(#PODCAST_REFERENCES|propre)</div>]
<B_chapitres_references_chroniques>
<div class="references texte">
<BOUCLE_chapitres_references_chroniques(CHAPITRES){id_article}{type_sujet=CH}>
<BOUCLE_chapitres_references_chroniques(CHAPITRES){id_article}>
[<h3>#TITRE</h3>
(#REFERENCES_SUJET|propre)]
</BOUCLE_chapitres_references_chroniques>

26
squelettes/content/rubrique-emissions.html
View File

@ -1,3 +1,23 @@
<BOUCLE_content(RUBRIQUES){id_rubrique}>
<INCLURE{fond=content/rubrique,id_rubrique,type-page=rubrique} />
</BOUCLE_content>
<BOUCLE_principale(RUBRIQUES){id_rubrique}>
<h1 class="#EDIT{titre} page_titre">#TITRE</h1>
<div class="page_content">
[<div class="#EDIT{texte} texte surlignable">(#TEXTE|adaptive_images{#CONST{_CONTENT_WIDTH}})</div>]
</div>
<B_emissions><div class="liste articles emissions emissions_precedentes">#ANCRE_PAGINATION
<h2><:libreavous:emissions_precedentes:></h2>
<ul>
<BOUCLE_emissions(ARTICLES){id_rubrique}{!par date}{date < #ENV{date}}{1,n}{pagination 10}>
<li>
<INCLURE{fond=inclure/resume/emission,id_article} />
</li>
</BOUCLE_emissions>
</ul>
[<nav class="pagination">(#PAGINATION{page})</nav>]
</div></B_emissions>
</BOUCLE_principale>

30
squelettes/content/rubrique.html Normal file
View File

@ -0,0 +1,30 @@
<BOUCLE_principale(RUBRIQUES){id_rubrique}>
<h1 class="#EDIT{titre} page_titre">#TITRE</h1>
<div class="page_content">
[<div class="#EDIT{texte} texte surlignable">(#TEXTE|adaptive_images{#CONST{_CONTENT_WIDTH}})</div>]
<B_articles>
<div class="liste_articles">
#ANCRE_PAGINATION
<BOUCLE_articles(ARTICLES){id_rubrique} {tri_rubrique} {pagination 10}>
#INCLURE{fond=inclure/resume/article, id_article}
</BOUCLE_articles>
[<p class="pagination">(#PAGINATION{page_precedent_suivant})</p>]
</div>
</B_articles>
<BOUCLE_rubriques(RUBRIQUES) {id_parent} {par num titre, titre}>
<h2><a href="#URL_RUBRIQUE">#TITRE</a></h2>
<div class="liste_articles">
<BOUCLE_articles_rub(ARTICLES){id_rubrique} {tri_rubrique} {0,3}>
#INCLURE{fond=inclure/resume/article, id_article}
</BOUCLE_articles_rub>
</div>
<p class="liste_articles__suite"><a href="#URL_RUBRIQUE">Tous les articles &laquo;&nbsp;#TITRE&nbsp;&raquo;</a></p>
</BOUCLE_rubriques>
</div>
</BOUCLE_principale>

94
squelettes/content/sommaire.html Normal file
View File

@ -0,0 +1,94 @@
<BOUCLE_emissions(RUBRIQUES){composition=emissions}>
<BOUCLE_der(ARTICLES){id_rubrique}{!par date}{date >= #ENV{date}}{0,1}>
<article class="prochaine_emission">
<header class="cartouche">
<p class="article__infos">
<span class="num_emission #EDIT{surtitre}">#[(#SURTITRE)]</span>
[<span class="article__date"><:libreavous:diffusee_en_direct_le:> [(#DATE|nom_jour) ][(#DATE|jour) ][(#DATE|nom_mois) ](#DATE|annee)</span>]
</p>
<p class="encart">
<span class="bientot"><:libreavous:c_est_bientot:></span><br />
[<span class="btn">[(#DATE|nom_jour) ][(#DATE|jour) ](#DATE|nom_mois)</span><br />]
<:libreavous:de_15h30_a_17h:>
</p>
<h1><span class="#EDIT{titre} article__titre">[(#TITRE|libreavous_supp_numero)]</span>[
<small class="#EDIT{soustitre} soustitre">(#SOUSTITRE)</small>
]</h1>
<div class="postmeta">
#MODELE{article_traductions}
<BOUCLE_groupes(GROUPES_MOTS){par titre}>
<B_tags>
<p class="mots">
<strong>#TITRE : </strong><BOUCLE_tags(MOTS){id_article}{id_groupe}{', '}>
<a href="#URL_MOT">#TITRE</a>
</BOUCLE_tags>
</p>
</B_tags>
</BOUCLE_groupes>
</div>
</header>
<BOUCLE_sl(CHAPITRES){id_article}{type_sujet=SL}>#SET{chapitres,oui}
<div class="sujet_principal">
<h2><:libreavous:sujet_principal:></h2>
<INCLURE{fond=inclure/chapitre,env,id_chapitre,h=3} />
</div>
</BOUCLE_sl><B_autres>#SET{chapitres,oui}
<div class="sujet_autre">
<h2><:libreavous:et_aussi:></h2>
<div>
<BOUCLE_autres(CHAPITRES){id_article}{type_sujet!=SL}>
<INCLURE{fond=inclure/chapitre,env,id_chapitre,h=3} />
</BOUCLE_autres>
</div>
</div>
</B_autres>
[(#GET{chapitres}|!={oui}|oui)
[<div class="chapo #EDIT{chapo}">(#CHAPO)</div>]
]
</article>
</BOUCLE_der>
</BOUCLE_emissions>
<B_accueil>
<article class="texte_accueil">
<BOUCLE_accueil(ARTICLES){page=accueil}>
<div class="main">
[<div class="#EDIT{chapo} chapo surlignable">(#CHAPO|adaptive_images{#CONST{_CONTENT_WIDTH}})</div>]
[<div class="#EDIT{texte} texte surlignable">(#TEXTE|adaptive_images{#CONST{_CONTENT_WIDTH}})</div>]
</div>
<footer>
[<div class="#EDIT{ps} ps surlignable"><h2><:info_ps:></h2>(#PS|adaptive_images{#CONST{_CONTENT_WIDTH}})</div>]
[<div class="notes"><h2><:info_notes:></h2>(#NOTES)</div>]
</footer>
</BOUCLE_accueil>
</article>
</B_accueil>
[<div id="descriptif_site_spip" class="#EDIT{meta-descriptif_site} texte_accueil">(#DESCRIPTIF_SITE_SPIP)</div>]
[(#DESCRIPTIF_SITE_SPIP|non)<div class="texte_accueil">#NOM_SITE_SPIP</div>]
<//B_accueil>
<INCLURE{fond=inclure/derniere_emission} />
<INCLURE{fond=inclure/emissions_precedentes,nb=6} />
[(#MODELE{bouton,lienobjet=rubrique,lienidobjet=1,class=center taille130,texte=Toutes les émissions})]

11
squelettes/inclure/chapitre.html
View File

@ -7,18 +7,17 @@
</h#ENV{h,2}>
<B_article>
<BOUCLE_article(ARTICLES){si #ENV{composition}|!={emission}|oui}{id_article}>
<p>
[(#ENV{page_emission}|=={oui}|oui)<p>
<a href="#URL_ARTICLE"><:libreavous:page_de_l_emission:></a>
</p>
</p>]
[(#ENV{telecharger}|=={oui}|oui)
<ul class="telecharger">
<li><a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#PODCAST_CODE)]/libre-a-vous-[(#PODCAST_CODE)].ogg" class="btn blanc ogg podcast" title="[(#PODCAST_OGG|taille_en_octets)]"><small><:libreavous:emission_integrale:></small><br /><:libreavous:podcast:> <:libreavous:ogg:></a></li>
<li><a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#PODCAST_CODE)]/libre-a-vous-[(#PODCAST_CODE)].mp3" class="btn blanc mp3 podcast title="[(#PODCAST_MP3|taille_en_octets)]"><small><:libreavous:emission_integrale:></small><br /><:libreavous:podcast:> <:libreavous:mp3:></a></li>
</ul>
</ul>]
</BOUCLE_article>
</B_article>
[(#ENV{composition}|=={emission}|oui)[<div class="references_sujet #EDIT{references_sujet}">
[(#ENV{references}|=={oui}|oui)[<div class="references_sujet #EDIT{references_sujet}">
(#REFERENCES_SUJET|propre)
</div>]]
</div>

73
squelettes/inclure/derniere_emission.html Normal file
View File

@ -0,0 +1,73 @@
<BOUCLE_emissions(RUBRIQUES){composition=emissions}>
<BOUCLE_der(ARTICLES){id_rubrique}{!par date}{date < #ENV{date}}{0,1}>
<div class="derniere_emission">
<h2><:libreavous:derniere_emission:></h2>
<article class="flex">
<div class="texte_content">
<header class="cartouche">
<p class="article__infos">
<span class="num_emission #EDIT{surtitre}">#[(#SURTITRE)]</span>
[<span class="article__date"><:libreavous:diffusee_le:> [(#DATE|jour)/][(#DATE|mois)/](#DATE|annee)</span>]
</p>
<h1><span class="#EDIT{titre} article__titre">[(#TITRE|libreavous_supp_numero)]</span>[
<small class="#EDIT{soustitre} soustitre">(#SOUSTITRE)</small>
]</h1>
<div class="postmeta">
#MODELE{article_traductions}
<BOUCLE_groupes(GROUPES_MOTS){par titre}>
<B_tags>
<p class="mots">
<strong>#TITRE : </strong><BOUCLE_tags(MOTS){id_article}{id_groupe}{', '}>
<a href="#URL_MOT">#TITRE</a>
</BOUCLE_tags>
</p>
</B_tags>
</BOUCLE_groupes>
</div>
</header>
<B_s>
<div class="sujets">
<h2><:libreavous:au_programme:> :</h2>
<ul>
<BOUCLE_s(CHAPITRES){id_article}{par debut}>
<li>#TITRE
<small><a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#PODCAST_CODE)]/libre-a-vous-[(#PODCAST_CODE)].ogg" class="btn blanc ogg podcast" title="[(#PODCAST_OGG|taille_en_octets)]"><:libreavous:ogg:></a>
<a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#PODCAST_CODE)]/libre-a-vous-[(#PODCAST_CODE)].mp3" class="btn blanc mp3 podcast title="[(#PODCAST_MP3|taille_en_octets)]"><:libreavous:mp3:></a></small>
</li>
</BOUCLE_s>
</ul>
</div>
</B_s>
[<div class="emission-Programme #EDIT{chapo}">(#CHAPO)</div>]
<//B_s>
<p class="flex">
<a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#PODCAST_CODE)]/libre-a-vous-[(#PODCAST_CODE)].ogg" class="btn blanc ogg podcast taille130" title="[(#PODCAST_OGG|taille_en_octets)]"><small><:libreavous:emission_integrale:></small><br /><:libreavous:podcast:> <:libreavous:ogg:></a>
<a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#PODCAST_CODE)]/libre-a-vous-[(#PODCAST_CODE)].mp3" class="btn blanc mp3 podcast taille130" title="[(#PODCAST_MP3|taille_en_octets)]"><small><:libreavous:emission_integrale:></small><br /><:libreavous:podcast:> <:libreavous:mp3:></a>
<a href="#URL_ARTICLE" class="btn taille80 blanc"><:libreavous:page_de_l_emission:></a>
[<a href="(#PODCAST_TRANSCRIPTION)" class="btn taille80 blanc">Transciption</a>]
</p>
</div>
[<div class="photo">(#LOGO_ARTICLE|image_reduire{350,*})</div>]
#SET{thumbs,'data-original-title'}
<B_photos>
<div class="photo">
<BOUCLE_photos(DATA){si #LOGO_ARTICLE|non}{source file, #PODCAST_GALERIEPHOTOS}{valeur == #GET{thumbs}}{0,1}>
<figure class="photoapril">#VALEUR</figure>
</BOUCLE_photos>
[<a href="(#PODCAST_GALERIEPHOTOS)" class="galeriephotos"><:libreavous:galerie_april:></a>]
</div>
</B_photos>
</article>
</div>
</BOUCLE_der>
</BOUCLE_emissions>

12
squelettes/inclure/emissions_precedentes.html Normal file
View File

@ -0,0 +1,12 @@
<BOUCLE_emissions(RUBRIQUES){composition=emissions}>
<B_e><div class="liste articles emissions emissions_precedentes">
<h2><:libreavous:emissions_precedentes:></h2>
<ul>
<BOUCLE_e(ARTICLES){id_rubrique}{!par date}{date < #ENV{date}}{1,#ENV{nb,n}}>
<li>
<INCLURE{fond=inclure/resume/emission,id_article} />
</li>
</BOUCLE_e>
</ul>
</div></B_e>
</BOUCLE_emissions>

57
squelettes/inclure/resume/emission.html Normal file
View File

@ -0,0 +1,57 @@
<BOUCLE_e(ARTICLES){id_article}>
<article class="emission-resume article-resume">
<div class="texte_content">
<div class="cartouche">
<p class="article__infos">
<span class="num_emission #EDIT{surtitre}">#[(#SURTITRE)]</span>
[<span class="article__date"><:libreavous:diffusee_le:> [(#DATE|jour)/][(#DATE|mois)/](#DATE|annee)</span>]
[<a href="(#PODCAST_TRANSCRIPTION)" class="btn taille80 blanc">Transciption</a>]
<a href="#URL_ARTICLE" class="btn taille80 blanc"><:libreavous:page_de_l_emission:></a>
</p>
<B_sl>
<BOUCLE_sl(CHAPITRES){id_article}{type_sujet=SL}{par debut}>
<h1><span class="#EDIT{titre} article__titre">[(#TITRE)]</span>
<small><a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#CODE_PODCAST)]/libre-a-vous-[(#CODE_PODCAST)]-[(#CODE_FICHIER)].ogg" class="btn blanc ogg podcast">ogg</a>
<a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#CODE_PODCAST)]/libre-a-vous-[(#CODE_PODCAST)]-[(#CODE_FICHIER)].mp3" class="btn blanc mp3 podcast">mp3</a></small>
</h1>
</BOUCLE_sl>
</B_sl>
<div class="postmeta">
#MODELE{article_traductions}
<BOUCLE_groupes(GROUPES_MOTS){par titre}>
<B_tags>
<p class="mots">
<strong>#TITRE : </strong><BOUCLE_tags(MOTS){id_article}{id_groupe}{', '}>
<a href="#URL_MOT">#TITRE</a>
</BOUCLE_tags>
</p>
</B_tags>
</BOUCLE_groupes>
</div>
</div>
<B_s>
<div class="sujets">
<ul>
<BOUCLE_s(CHAPITRES){id_article}{type_sujet!=SL}{par debut}>
<li>#TITRE
<small><a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#CODE_PODCAST)]/libre-a-vous-[(#CODE_PODCAST)]-[(#CODE_FICHIER)].ogg" class="btn blanc ogg podcast">ogg</a>
<a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#CODE_PODCAST)]/libre-a-vous-[(#CODE_PODCAST)]-[(#CODE_FICHIER)].mp3" class="btn blanc mp3 podcast">mp3</a></small>
</li>
</BOUCLE_s>
</ul>
</div>
</B_s>
[<div class="emission-Programme #EDIT{chapo}">(#CHAPO)</div>]
<//B_s>
</div>
<ul class="telecharger">
<li><a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#PODCAST_CODE)]/libre-a-vous-[(#PODCAST_CODE)].ogg" class="btn blanc ogg podcast" title="[(#PODCAST_OGG|taille_en_octets)]"><small><:libreavous:emission_integrale:></small><br /><:libreavous:podcast:> <:libreavous:ogg:></a></li>
<li><a href="https://media.april.org/audio/radio-cause-commune/libre-a-vous/emissions/[(#PODCAST_CODE)]/libre-a-vous-[(#PODCAST_CODE)].mp3" class="btn blanc mp3 podcast" title="[(#PODCAST_MP3|taille_en_octets)]"><small><:libreavous:emission_integrale:></small><br /><:libreavous:podcast:> <:libreavous:mp3:></a></li>
</ul>
</article>
</BOUCLE_e>

375
squelettes/scss/styles/_perso.scss
View File

@ -2,7 +2,7 @@
// les différences
.page_wrapper {
background:$couleurPrincipale url('../images/egalizer.png') repeat-x center -150px;
/* background-attachment:fixed; */
background-attachment:fixed;
@media ($bp-small) {
background:$couleurPrincipale url('../images/egalizer-480.png') repeat-x center -150px;
}
@ -11,13 +11,16 @@
padding:0;
> .page_container {
background-color:$couleurSecondaire;
.nav {
padding-top:2rem;
}
.header_title {
min-width: 150px;
}
.header_menu {
flex-grow: 2;
padding:0 $spacer;
padding:$spacer;
.nav {
padding-top:0;
}
.liens {
text-align:right;
margin-top:0.7rem;
@ -40,7 +43,7 @@
float:right;
display:inline-block;
font-size:0.8rem;
margin:1.5rem 1.5rem 0 0;
margin:1.8rem 1.5rem 0 0;
.socicon {
background:none !important;
color:$blancTransparent;
@ -100,8 +103,37 @@
@include visuallyhidden;
}
.encart {
float:right;
text-align:right;
font-size:1.1rem;
margin-left:2rem;
span {
font-size:145%;
&.bientot {
display:inline-block;
color:$couleurSecondaire;
font-weight:900;
}
&.btn {
background:$couleurSecondaire;
color:white !important;
font-weight:900;
margin:0.6rem 0 0.3rem;
padding:1.3rem 2rem;
&:first-letter {
text-transform:uppercase;
}
}
}
}
.texte_accueil {
background-color:white;
.main {
padding-bottom:1rem;
}
}
@ -119,20 +151,30 @@
flex-direction: column;
}
.page_content, .page_aside {
width:100%;
/* width:100%;
margin:0 0 ($spacer*2);
padding:$spacer ($spacer*4);
background-color:white;
background-color:white;*/
}
.page_content {
}
}
.page_content, .page_aside {
.page_content > *, .page_aside > * {
margin:0 0 ($spacer*2);
padding:$spacer ($spacer*4);
background-color:white;
&.page_extra {
padding:0;
}
&.btn {
background:$couleurPrincipaleOn;
color:$couleurPrincipale !important;
&:hover {
background:$couleurSecondaire;
}
}
}
h2 {
@ -187,10 +229,13 @@ h2 {
color:$couleurPrincipale !important;
background:white;
border:1px solid rgba($couleurPrincipale,0.2);
border-radius:1em;
border-radius:0.5em;
&:hover {
background:$couleurPrincipaleOn;
}
&.bold {
border-color:$couleurPrincipale;
}
}
@ -222,7 +267,7 @@ h2 {
.article__date {
display:none; /* provisoire, par simplicite */
}
.article_emission {
.article__date {
display:inline;
font-size:1.5rem;
@ -230,11 +275,11 @@ h2 {
font-weight:700;
font-family:$typo-titre;
}
}
.lecteur {
@include flex;
align-items:center;
margin-bottom:2em;
margin-bottom:3em;
> .podlove_wrapper {
/* flex-grow:2; */
width:76%;
@ -243,7 +288,7 @@ h2 {
.telecharger {
list-style:none;
width:24%;
width:200px;
padding:0 0 0 2em;
margin:0;
li {
@ -255,30 +300,31 @@ h2 {
.btn.podcast {
width:100%;
padding-left:2.2rem;
padding-bottom:0.3rem;
font-size:1.15rem;
text-transform:none;
&:before {
left:0.8rem;
}
}
}
.btn.podcast {
padding:0 0.5em 0.3em 1rem;
padding:0 0.5em 0.1em 1rem;
position:relative;
text-align:left;
border-width:0.25em;
border-color:$couleurSecondaire;
color:$couleurSecondaire !important;
font-weight:900;
h2 &, h3 & {
font-size:50%;
&:before {
left:0.4rem;
}
}
font-size:0.6rem;
text-transform:uppercase;
&:before {
@include triangle(right, $couleurSecondaire, 0.5em);
position: absolute;
left: 0.8rem;
left: 0.4rem;
top: 50%;
margin-top:-0.5em;
margin-top:-0.45em;
}
small {
font-size:0.7em;
@ -292,8 +338,12 @@ h2 {
}
}
&:hover, &:active, &:focus {
background:none !important;
background:$couleurPrincipaleOn !important;
border-color:$couleurPrincipaleOn !important;
color:$couleurPrincipale !important;
&:before {
@include triangle(right, $couleurPrincipale, 0.5em);
}
}
}
@ -301,8 +351,8 @@ h2 {
.sujet_autre {
background:$couleurBackgroundTexte;
padding:$spacer ($spacer*4);
margin:0 -($spacer*4);
> div {
margin:($spacer*2) -($spacer*4) -($spacer*2);
.article_emission & > div {
@include flex;
@include vendor-prefix(flex-wrap, wrap);
> * {
@ -315,18 +365,64 @@ h2 {
}
}
}
// pour insertion dans le texte/chapo avant d'avoir le podcast
.chapo & {
margin-bottom: -($spacer);
clear:both;
font-size:1rem;
> * {
font-size:1.2rem;
}
}
}
/* notation */
.formulaire_jaime_jaimepas {
.note, .reponse_formulaire {
float:left;
}
}
div.star-rating, div.star-rating a {
background-image:url('img/star.png');
}
div.rating-cancel a {
background-image:url('img/delete.png');
}
/**/
.sociaux .socicon {
.sociaux {
.socicon {
display: inline-block;
}
a.spip_out {
border:0;
}
}
/* bloc connex */
.page_connex {
margin:3rem 0 1rem;
}
.page_connex_content {
color:white;
h2 {
color:white;
font-size:1rem;
}
ul {
list-style:none;
margin-left:0;
li {
margin:0 0 0.5rem;
}
}
a {
border:0;
}
}
/**/
.page_footer {
.article {
@include media($bp-small-up) {
@ -349,11 +445,113 @@ div.rating-cancel a {
}
}
/* page sommaire */
.body__sommaire .page_main {
h1 {
margin: 1em 0 0.8em;
}
}
.derniere_emission, .emissions_precedentes {
margin-top:($spacer*6);
padding-bottom:0;
> h2 {
margin-top:-($spacer*2.5);
margin-bottom:($spacer*0.7);
color:white;
}
.texte_content {
flex:1;
padding-bottom:$spacer;
h1 {
font-size:1.6rem;
}
h2 {
font-size:1.2rem;
}
p.flex {
margin-bottom:1rem;
padding-right:2rem;
align-items:center;
.podcast {
font-size:110%;
text-transform:none;
padding-left:1.6rem;
}
}
}
.article__infos {
margin-top:0;
.num_emission {
font-size:2rem;
padding:0.1rem 1rem;
width: auto;
}
.article__date {
font-size:1rem;
color:$couleurPrincipale;
font-weight:400;
}
.btn.blanc {
float:right;
margin-top:0.8rem;
margin-left:0.5rem;
font-weight:700;
}
}
.photo {
margin-right:-4rem;
background:$couleurBackgroundTexte;
.photoapril {
margin:0;
}
a {
display:inline-block;
padding:0 1rem;
font-size:0.9rem;
font-weight:500;
color:$couleurSecondaire;
}
}
}
.emissions_precedentes {
.cartouche {
margin:0;
}
> h2 {
margin-bottom:($spacer*0.6);
}
> ul {
list-style:none;
padding:0;
margin:0 -($spacer*4);
> li {
border-bottom:2px solid $couleurPrincipale;
}
}
.emission-resume.article-resume {
align-items:center;
padding: 0 1em;
margin:0;
.article__infos {
margin-left:-$spacer;
}
}
}
.prochaine_emission {
.article__date {
font-size:1rem;
color:$couleurPrincipale;
font-weight:400;
}
.chapo {
font-size:1.2rem;
}
}
.orange {
color:$couleurSecondaire;
}
/*! Plusieurs typographies sont finalement trop grosses, j'ai réduit. */
h1, .h1 {
@ -414,7 +612,7 @@ Sur le menu, je vais voir s'il est possible de faire des filets de rollover comp
line-height: 2em;
margin-left: -1em;
}
p a.spip_out, li a.spip_out {
a.spip_out {
color: #2E5281;
border-bottom: 2px solid #FDC;
}
@ -460,4 +658,121 @@ p a.spip_out, li a.spip_out {
.page_footer p {
font-size: 0.8rem;
font-weight: 200;
a, a.spip_out {
display:inline;
font-weight:400;
color:white;
border-bottom-width:1px;
}
}
@media (max-width:940px) {
.page_header > .page_container {
.nav {
padding-top:($spacer/2);
font-size:0.95rem;
z-index:7;
position:static;
> ul {
position:absolute;
background:$couleurPrincipale;
width:100%;
top:36px;
left:-100%;
padding:$spacer/2 $spacer;
text-align:center;
z-index:10;
&.ouvert{
left:0;
}
a {
color:white;
border:0;
display:block;
margin:0;
padding:0.5rem;
&:hover, &:focus, &.on {
background:$couleurSecondaire;
}
}
li {
display:block;
}
.loupe {
.fas {
color:white;
}
.formulaire_recherche.vu {
right:50%;
margin-right:-160px;
max-width:320px;
form {
padding:0.5rem;
&:before {
display:none;
}
}
}
}
}
}
}
.btn-nav {
display:block;
}
.header_initiatives {
.btn-initiatives {
display:block;
}
.nav {
position:absolute;
width:100%;
top:36px;
left:-100%;
@include vendor-prefix(transition,all 0.3s ease-in-out);
&.ouvert {
left:0;
}
ul, .initiatives {
display:inline;
}
}
}
}
@include media(min-width:941px) {
.page_header > .page_container .nav {
position:relative;
}
}
@media (max-width:804px) {
.page_header .header_menu .liens {
margin-top:0;
}
.page_header .header_menu .liens .sociaux {
margin-top:0.8rem;
}
}
@media (max-width:650px) {
.page_header .header_menu .liens .btn {
margin-top:0.5rem;
}
}
@media (max-width:580px) {
.page_header > .page_container .nav {
padding-top:0;
}
.page_header .header_menu {
padding:0.3rem 1rem;
}
.page_header .header_menu .liens .sociaux {
margin-top:0;
}
.article-resume > :last-child.telecharger {
margin-bottom:1rem;
}
}