amelioration mise en page groupes

This commit is contained in:
Pierre 2020-02-11 13:06:03 +01:00
parent be5548f2ae
commit 74f67926c6
10 changed files with 112 additions and 111 deletions

View file

@ -4,7 +4,7 @@
if (isset($GLOBALS['visiteur_session']['id_auteur']) AND $GLOBALS['visiteur_session']['id_auteur']) {
?>
<div class="colonne-blanche">
<div class="cadre-blanc">
<h1>Forum</h1>
<BOUCLE_sujet(ARTICLES){id_article=#ENV{id_article}}>

View file

@ -1,6 +1,6 @@
<section class="section-top section-bottom container">
<div class="colonne-blanche">
<div class="cadre-blanc">
<h1>Forum</h1>

View file

@ -1,70 +0,0 @@
[(#REM) On affiche tous les groupes appartenant à la même Ville]
#SET{ville,#INFO_SURTITRE{article,#ENV{id_article}}}
[(#REM) On récupère les id de tous les groupes de la ville pour les actualités]
[(#SET{groupes,#ARRAY})]
<section class="section-top section-bottom container">
<INCLURE{fond=breadcrumb/groupe,env,ville=#GET{ville}} />
<h1 class="#EDIT{titre} mt-4 mb-4">Groupes de #GET{ville}</h1>
<BOUCLE_groupe(ARTICLES){surtitre = #GET{ville}}{id_secteur=#CONFIG{balint/id_rub_groupes}}>
[(#SET{groupes,#GET{groupes}|push{#ID_ARTICLE}})]
<div class="bloc-groupe mt-4 mt-lg-0">
[<h2 class="h3-like #EDIT{titre}">(#TITRE)</h2>]
[(#AUTORISER{modifier, article, #ID_ARTICLE})
<a class="btn" href="#URL_PAGE{editer_groupe,id_article=#ID_ARTICLE }"><i class="fas fa-edit"></i> Mettre à jour le groupe</a>
]
<div class="row">
<div class="col-md-8">
<div class="texte #EDIT{soustitre}"><strong>Adresse :</strong> #SOUSTITRE</div>
<div class="texte #EDIT{descriptif}"><strong>Fréquence :</strong> [(#DESCRIPTIF|textebrut)]</div>
<div class="texte #EDIT{texte}">#TEXTE</div>
</div>
<div class="col-md-4">
<strong>Responsables</strong>
<BOUCLE_auteurs(AUTEURS){id_article=#ID_ARTICLE}>
<div class="row">
<div>#NOM</div>
[(#EMAIL|ou{#TELEPHONE}|oui)
<div>
<a href="[(#URL_PAGE{contacter_auteur}|parametre_url{id_auteur,#ID_AUTEUR})]" class="mediabox">&nbsp; (contact)</a>
</div>]
</div>
</BOUCLE_auteurs>
</div>
<BOUCLE_images(DOCUMENTS){id_article=#ID_ARTICLE}{extension==jpg|png|gif}{!par credits}{1,n}>
<a href="#FICHIER" class='mediabox' rel='galerie_#ID_ARTICLE'>
[(#FICHIER|image_recadre{350:200,-,focus}|image_reduire{350, 200})]
</a>
</BOUCLE_images>
</div>
</div>
</BOUCLE_groupe>
<h3 class="mt-4 mb-3">Dernières nouvelles</h3>
<B_a_la_une>
#ANCRE_PAGINATION
<div class="pagination pagination_top">#PAGINATION{page_precedent_suivant}</div>
<div class="row liste-articles">
<BOUCLE_a_la_une(ARTICLES){id_rubrique=#CONFIG{balint/id_rub_articles}}{id_groupe IN #GET{groupes}}{! par date}{pagination 2}>
<div class="col-md-6 col-lg-4 mt-4 mt-lg-0">
<INCLURE{fond=inclure/bloc_article, env, id_article}/>
</div>
</BOUCLE_a_la_une>
<div class="container">Il n'y a pas encore d'article dans ce pays.</div>
<//B_a_la_une>
</div>
<div class="pagination">#PAGINATION{page_precedent_suivant}</div>
</B_a_la_une>
</section>

View file

@ -7,7 +7,7 @@
<section id="groupes" class="section-top section-bottom container">
<div>
<div class="cadre-blanc">
<h1 class="mb-4">Les groupes</h1>
<INCLURE{fond=inclure/groupes_contenu,env,ajax}>
</div>

View file

@ -91,7 +91,7 @@ body{
padding-bottom: 3rem;
}
.colonne-blanche{
.cadre-blanc{
padding: 1.5rem;
background: white;
border-radius: 0.5rem;
@ -211,6 +211,7 @@ body{
#agenda, .dernieres-nouvelles{
background: $fond-transparent;
border-left: solid 1px $couleur-liens;
border-radius: 0.2rem;
display: flex;
flex-direction: column;
@ -500,15 +501,42 @@ body{
}
}
.page-groupes{
align-items: flex-start;
}
.bloc-groupe{
background: $fond-transparent;
border: solid 1px $gris-clair;
background: $light;
padding: 1.5rem;
border-radius: 0.5rem;
margin: 2rem 0;
}
.banniere-ville{
position: relative;
}
.ville-titre{
position: absolute;
top: 0;
width: 100%;
height: 100%;
padding: 1rem;
background: rgba(255,255,255,0.8);
display: flex;
flex-direction: column;
justify-content: center;
}
@include media-breakpoint-up(md) {
.ville-titre{
width: 30%;
}
}
/**********************************************************************/
/**************** TOUS LES FORMULAIRES DE CONNEXION *******************/
/**********************************************************************/

View file

@ -11967,7 +11967,7 @@ body {
padding-bottom: 3rem;
}
.colonne-blanche {
.cadre-blanc {
padding: 1.5rem;
background: white;
border-radius: 0.5rem;
@ -12100,6 +12100,7 @@ body {
#agenda, .dernieres-nouvelles {
background: rgba(255, 255, 255, 0.92);
border-left: solid 1px #f67638;
border-radius: 0.2rem;
display: -webkit-box;
display: flex;
@ -12444,13 +12445,45 @@ body {
}
}
.page-groupes {
-webkit-box-align: start;
align-items: flex-start;
}
.bloc-groupe {
background: rgba(255, 255, 255, 0.92);
border: solid 1px #f2f2f2;
background: #f8f9fa;
padding: 1.5rem;
border-radius: 0.5rem;
margin: 2rem 0;
}
.banniere-ville {
position: relative;
}
.ville-titre {
position: absolute;
top: 0;
width: 100%;
height: 100%;
padding: 1rem;
background: rgba(255, 255, 255, 0.8);
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
-webkit-box-pack: center;
justify-content: center;
}
@media (min-width: 768px) {
.ville-titre {
width: 30%;
}
}
/**********************************************************************/
/**************** TOUS LES FORMULAIRES DE CONNEXION *******************/
/**********************************************************************/

View file

@ -2,11 +2,11 @@
<BOUCLE_art(ARTICLES){id_article = #ENV{id_article}}>
<div class="bloc-article bloc-ville">
<div class="bloc-contenu">
<a href="[(#URL_PAGE{groupe}|parametre_url{id_article,#ID_ARTICLE}|parametre_url{id_rubrique,#ENV{id_rubrique}})]" class="ajax nocache nohistory">
<a href="[(#URL_PAGE{groupes}|parametre_url{id_article,#ID_ARTICLE}|parametre_url{id_rubrique,#ENV{id_rubrique}})]" class="ajax nocache">
<INCLURE{fond=inclure/photo_article,env,id_article=#ENV{id_article},ajax=recharger_photo,groupe=oui}>
</a>
<div class="bloc-textes">
<a href="[(#URL_PAGE{groupe}|parametre_url{id_article,#ID_ARTICLE}|parametre_url{id_rubrique,#ENV{id_rubrique}})]" class="ajax nocache nohistory">
<a href="[(#URL_PAGE{groupes}|parametre_url{id_article,#ID_ARTICLE}|parametre_url{id_rubrique,#ENV{id_rubrique}})]" class="ajax nocache">
<h4>#SURTITRE <i class="fas fa-globe"></i></h4>
#SET{nb_articles,0}

11
inclure/choix_ville.html Normal file
View file

@ -0,0 +1,11 @@
<div class="row liste-articles">
<BOUCLE_villes(ARTICLES){id_rubrique=#ENV{id_rubrique}}{fusion surtitre}>
<div class="col col-md-6 col-lg-4 mt-4 mt-lg-0">
<INCLURE{fond=inclure/bloc_groupe,env,id_article=#ID_ARTICLE}>
</div>
</BOUCLE_villes>
<div class="col">Il n'y a pas encore de groupe dans ce pays.</div>
<//B_villes>
</div>

View file

@ -2,17 +2,29 @@
#SET{ville,#INFO_SURTITRE{article,#ENV{id_article}}}
[(#REM) On récupère les id de tous les groupes de la ville pour les actualités]
[(#REM) On récupère les id de tous les groupes de la ville pour les actualités et les images]
[(#SET{groupes,#ARRAY})]
<BOUCLE_groupes(ARTICLES){surtitre = #GET{ville}}{id_secteur=#CONFIG{balint/id_rub_groupes}}>
[(#SET{groupes,#GET{groupes}|push{#ID_ARTICLE}})]
</BOUCLE_groupes>
[<h2 class="#EDIT{titre} mt-4 mb-4">Groupes de (#GET{ville})</h2>]
<a href="[(#URL_PAGE{groupes,id_rubrique=#ENV{id_rubrique}})]" class="ajax"><i class="fas fa-arrow-circle-left"></i> Retour</a>
<div class="banniere-ville mt-4 mb-4">
<BOUCLE_banniere(DOCUMENTS){id_article IN #GET{groupes}}{extension==jpg|png|gif}{!par date}{0,1}>
[(#FICHIER|image_recadre{650:250,-,focus}|image_reduire{650, 250})]
</BOUCLE_banniere>
[(#CHEMIN{img/ville.png}|image_recadre{900:350,-,focus}|image_reduire{900, 350})]
<//B_banniere>
<div class="ville-titre">
<h2 class="#EDIT{titre}">Groupes de #GET{ville}</h2>
</div>
</div>
<BOUCLE_groupe(ARTICLES){surtitre = #GET{ville}}{id_secteur=#CONFIG{balint/id_rub_groupes}}>
[(#SET{groupes,#GET{groupes}|push{#ID_ARTICLE}})]
<div class="bloc-groupe mt-4 mt-lg-0">
[<h3 class="#EDIT{titre}">(#TITRE)</h3>]
[<h3 class="h4 #EDIT{titre}">(#TITRE)</h3>]
[(#AUTORISER{modifier, article, #ID_ARTICLE})
<a class="btn" href="#URL_PAGE{editer_groupe,id_article=#ID_ARTICLE }"><i class="fas fa-edit"></i> Mettre à jour le groupe</a>
]
@ -26,21 +38,13 @@
<div class="col-md-4">
<strong>Responsables</strong>
<BOUCLE_auteurs(AUTEURS){id_article=#ID_ARTICLE}>
<div class="row">
<div>#NOM</div>
<div>#NOM
[(#EMAIL|ou{#TELEPHONE}|oui)
<div>
<a href="[(#URL_PAGE{contacter_auteur}|parametre_url{id_auteur,#ID_AUTEUR})]" class="mediabox">&nbsp; (contact)</a>
</div>]
]
</div>
</BOUCLE_auteurs>
</div>
<BOUCLE_images(DOCUMENTS){id_article=#ID_ARTICLE}{extension==jpg|png|gif}{!par credits}{1,n}>
<a href="#FICHIER" class='mediabox' rel='galerie_#ID_ARTICLE'>
[(#FICHIER|image_recadre{350:200,-,focus}|image_reduire{350, 200})]
</a>
</BOUCLE_images>
</div>
</div>

View file

@ -1,20 +1,15 @@
<div class="row">
<div class="col-100 col-lg-9">
<div class="page-groupes row">
<div class="col w-100 col-lg-9">
<INCLURE{fond=inclure/menu-groupes,env}>
<div class="row liste-articles">
<BOUCLE_villes(ARTICLES){id_rubrique=#ENV{id_rubrique}}{fusion surtitre}>
<div class="col col-md-6 col-lg-4 mt-4 mt-lg-0">
[(#ENV{id_article}|non)
<INCLURE{fond=inclure/choix_ville,env} />
]
<INCLURE{fond=inclure/bloc_groupe,env,id_article=#ID_ARTICLE}>
</div>
</BOUCLE_villes>
<div class="col">Il n'y a pas encore de groupe dans ce pays.</div>
<//B_villes>
</div>
<INCLURE{fond=inclure/groupe-detail,env} />
[(#ENV{id_article}|oui)
<INCLURE{fond=inclure/groupe-detail,env} />
]
</div>
<aside class="col col-lg-3 d-none d-lg-block dernieres-nouvelles">
@ -23,13 +18,13 @@
[(#REM) On récupère les id de tous les groupes du pays]
[(#SET{groupes,#ARRAY})]
[(#SET{groupes_pays,#ARRAY})]
<BOUCLE_villes2(ARTICLES){id_rubrique=#ENV{id_rubrique}}{tout}>
[(#SET{groupes,#GET{groupes}|push{#ID_ARTICLE}})]
[(#SET{groupes_pays,#GET{groupes_pays}|push{#ID_ARTICLE}})]
</BOUCLE_villes2>
<div class="liste-articles">
<BOUCLE_a_la_une(ARTICLES){id_rubrique=#CONFIG{balint/id_rub_articles}}{id_groupe IN #GET{groupes}}{0,6}{! par date}>
<BOUCLE_a_la_une(ARTICLES){id_rubrique=#CONFIG{balint/id_rub_articles}}{id_groupe IN #GET{groupes_pays}}{0,6}{! par date}>
<div class="mt-4 mt-lg-0 mb-3">
<div class="infos-article">
[(#DATE|affdate) :]