On teste les formus en reprenant ceux de forums

gestion_archives
Matthieu Marcillaud 5 years ago
parent a9a1c408f6
commit 8a7cad306f

@ -33,14 +33,14 @@
<div class="js-tabs tabs__standard">
<ul class="js-tablist tabs__standard_ul tabs__list" data-hx="h2">
<li class="js-tablist__item tabs__standard__li tabs__item">
<a href="#article__documentation" id="label_article__documentation" class="js-tablist__link tabs__link tabs__standard__a"><:galactic_contrib:article_documentation:></a>
<a href="#documentation" id="tab_documentation" class="js-tablist__link tabs__link tabs__standard__a"><:galactic_contrib:article_documentation:></a>
</li>
<li class="js-tablist__item tabs__standard__li tabs__item">
<a href="#article__forum" id="label_article__forum" class="js-tablist__link tabs__link tabs__standard__a"><:galactic_contrib:article_forum:></a>
<a href="#discussions" id="tab_discussions" class="js-tablist__link tabs__link tabs__standard__a"><:galactic_contrib:article_forum:></a>
</li>
</ul>
]
<div class="js-tabcontent tabs__standard__tabcontent tabs__content" id="article__documentation">
<div class="js-tabcontent tabs__standard__tabcontent tabs__content" id="documentation">
<div class="surlignable">
[<div class="#EDIT{descriptif} descriptif">(#DESCRIPTIF|PtoBR)</div>]
[<div class="#EDIT{chapo} chapo" itemprop="description">(#CHAPO|image_reduire{#CONFIG{documentation/taille_redimensionnement_image,440}, 0})</div>]
@ -64,17 +64,31 @@
</abbr>
})</p>]
</div>
[(#SET{repondre_url,repondre_url=#PARAMETRES_FORUM|url_reponse_forum})]
[(#PARAMETRES_FORUM|oui)
<div class="js-tabcontent tabs__standard__tabcontent tabs__content" id="article__forum">
<div class="js-tabcontent tabs__standard__tabcontent tabs__content" id="discussions">
<div class="article__forum">
<INCLURE{fond=inclure/forum}{id_article} />
#FORMULAIRE_FORUM{#SELF}
<INCLURE{fond=inclure/forum,
id_article,
repondre_url=#GET{repondre_url},
repondre_titre=<:repondre_article:>,
env} />
</div>
</div>]
[(#PARAMETRES_FORUM|oui)
</div>
<script type="application/javascript">
(function($){
$(function(){
var hash = window.location.hash.substr(1);
if (hash == 'discussions') {
$('#tab_discussions').click();
}
});
})(jQuery);
</script>
]
</article>

2337
css/font-awesome.css vendored

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

Binary file not shown.

Binary file not shown.

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 434 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

@ -0,0 +1,28 @@
<div class="formulaire_spip formulaire_recherche formulaire_recherche_ajax[ (#ENV{class})]">
<form action="[(#ENV{action})]" method="get">
[(#ENV{action}|form_hidden)]
[<input type="hidden" name="lang" value="(#ENV{lang})"/>]
<label for="#ENV{_id_champ}" class="visuallyhidden">
<:info_rechercher_02:>
</label>
[(#SET{titre,#ENV{placeholder,<:info_rechercher:>}})]
[(#CHEMIN{images/icone-loupe.svg}|file_get_contents|replace{'<svg ','<svg height="16" '})]
<div class="search">
<input type="search" placeholder="[(#GET{titre}|attribut_html)]" name="recherche" id="#ENV{_id_champ}" [ value="(#ENV{recherche})" ] accesskey="4" autocapitalize="off" autocorrect="off"/>
</div>
<a class="close ajax" href="[(#ENV{action}|parametre_url{'recherche',''})]" title="Annuler la recherche">
<span class="fa fa-close"></span>
</a>
<div class="submit">
<input type="submit" value="&gt;&gt;" title="[(#GET{titre}|attribut_html)]" onclick="return recherche_submit_#ENV{_id_champ}.apply(this);" />
<a class="none visuallyhidden refresh[ (#ENV{class})]" href="[(#ENV{action}|parametre_url{'recherche',''})]">[(#GET{titre})]</a>
</div>
</form>
</div>
<script type="text/javascript">/*<![CDATA[*/
function recherche_submit_#ENV{_id_champ}() {
var a = $(this).siblings('a.refresh');
var href = parametre_url(a.attr('href'), 'recherche', $(this).parents('form').find('input[type=search]').val());
a.attr('href', href).followLink();
return false;
}/*]]>*/</script>

@ -0,0 +1,45 @@
<?php
/***************************************************************************\
* SPIP, Systeme de publication pour l'internet *
* *
* Copyright (c) 2001-2016 *
* Arnaud Martin, Antoine Pitrou, Philippe Riviere, Emmanuel Saint-James *
* *
* Ce programme est un logiciel libre distribue sous licence GNU/GPL. *
* Pour plus de details voir le fichier COPYING.txt ou l'aide en ligne. *
\***************************************************************************/
if (!defined('_ECRIRE_INC_VERSION')) {
return;
}
/**
* chargement des valeurs par defaut des champs du `#FORMULAIRE_RECHERCHE_AJAX{#SELF}`
*
* on peut lui passer l'url de destination en premier argument
* on peut passer une deuxième chaine qui va différencier le formulaire pour pouvoir en utiliser plusieurs sur une même page
*
* @param string $lien URL où amène le formulaire validé
* @param string $placeholder Pour indiquer un titre spécifique au placeholder
* @return array
*/
function formulaires_recherche_ajax_charger_dist($lien = '', $placeholder = '') {
if ($GLOBALS['spip_lang'] != $GLOBALS['meta']['langue_site']) {
$lang = $GLOBALS['spip_lang'];
} else {
$lang = '';
}
$class = 'ajax';
$action = ($lien ? $lien : generer_url_public('recherche')); # action specifique, ne passe pas par Verifier, ni Traiter
return
array(
'action' => $action,
'recherche' => _request('recherche'),
'lang' => $lang,
'class' => $class,
'placeholder' => $placeholder,
'_id_champ' => $class ? substr(md5($action . $class), 0, 4) : 'recherche'
);
}

@ -1,10 +1,59 @@
<?php
// Retire les liens en syntaxe Trac: [URL titre] ---> titre
function tracbrut($texte)
{
if (preg_match_all('/[[][^ ]* *([^]]*)]/', $texte, $m, PREG_SET_ORDER))
foreach($m as $r)
function tracbrut($texte) {
if (preg_match_all('/[[][^ ]* *([^]]*)]/', $texte, $m, PREG_SET_ORDER)) {
foreach ($m as $r) {
$texte = str_replace($r[0], $r[1], $texte);
}
}
return $texte ? $texte : 'Log';
}
}
/**
* Pluriels, singulier ou zéro...
*
* Les items sont à indiquer comme pour la fonction _T() sous la forme :
* "module:chaine"
*
* Cherchera chaine_zero, chaine_un, chaine_nb en fonction de $nb.
*
* @example
* ```
* [(#NB|contrib_pluraliser{forum:sujets})]
* [(#NB|contrib_pluraliser{#LISTE{forum:sujets_zero,forum:sujets_un,forum:sujets_nb}})]
* ```
*
* @param int $nb : le nombre
* @param string|array $chaine
* - string : radical de l'item de langue, sera complété par _zero, _un, _nb
* - array : couples {0 => module:chaine_zero, 1 => module:chaine_un, 2 => module:chaine_nb}
*
* @param array $vars : Les autres variables nécessaires aux chaines de langues (facultatif)
* @return string : la chaine de langue finale en utilisant la fonction _T()
*/
function contrib_pluraliser($nb, $chaine, $vars = array()) {
$nb = intval($nb);
if (!is_array($vars)) {
$vars = array();
}
if (!is_array($chaine)) {
$chaine = array(
$chaine . '_zero',
$chaine . '_un',
$chaine . '_nb',
);
}
$vars['nb'] = $nb;
if ($nb > 1) {
return _T($chaine[2], $vars);
} elseif ($nb == 1) {
return _T($chaine[1], $vars);
} else {
return _T($chaine[0], $vars);
}
}

@ -0,0 +1,12 @@
<div class="comments">
<a href="#comments" id="comments"></a>
<a href="#forum" id="forum"></a>
[<script type="text/javascript">/*<!\[CDATA\[*/(#INCLURE{javascript/thread-move.js}|compacte{js})/*\]\]>*/</script>]
<INCLURE{fond=inclure/forums/bloc-discussions, env, ajax}>
[(#ENV{repondre_url}|oui)
[<div class="comment-form">
[<h2 class="h2">(#ENV*{repondre_titre,<:repondre_article:>}|trim)</h2>]
(#FORMULAIRE_FORUM{#SELF,#ENV{objet},#ENV{id_objet}})
</div>]
[(#PARAMETRES_FORUM|oui)<INCLURE{fond=comments-feed,env} />]
]</div>

@ -0,0 +1,53 @@
[(#REM)
On présente différents onglets daffichage des messages, par date, par note, ...
On permet de définir aussi la durée (depuis 3 mois, depuis toujours...)
Par défaut, la durée est sur 5 ans, ce qui accélère laffichage (la requête) par rapport à «depuis toujours».
]
<div class="comments-posts"></div>[(#REM) fake pour retour JS de Comments ]
[(#SET{self,#SELF|parametre_url{debut_forums,''}})]
<div class="alignement_avec_liste">
<div class="onglets">
<div class="onglets__groupe">
<a href="[(#GET{self}|parametre_url{max,''})]" class="ajax[ (#ENV{max}|non)on]" title="[(#VAL{5}|singulier_ou_pluriel{galactic_contrib:annees_depuis_un,galactic_contrib:annees_depuis_nb})]" rel="nofollow">
[(#VAL{5}|singulier_ou_pluriel{galactic_contrib:annees_un,galactic_contrib:annees_nb})]
</a>
<a href="[(#GET{self}|parametre_url{max,1y})]" class="ajax[ (#ENV{max}|=={1y}|oui)on]" title="[(#VAL{1}|singulier_ou_pluriel{galactic_contrib:annees_depuis_un,galactic_contrib:annees_depuis_nb})]" rel="nofollow">
[(#VAL{1}|singulier_ou_pluriel{galactic_contrib:annees_un,galactic_contrib:annees_nb})]
</a>
<a href="[(#GET{self}|parametre_url{max,3m})]" class="ajax[ (#ENV{max}|=={3m}|oui)on]" title="[(#VAL{3}|singulier_ou_pluriel{galactic_contrib:mois_depuis_un,galactic_contrib:mois_depuis_nb}|attribut_html)]" rel="nofollow">
[(#VAL{3}|singulier_ou_pluriel{galactic_contrib:mois_un,galactic_contrib:mois_nb})]
</a>
<a href="[(#GET{self}|parametre_url{max,+})]" class="ajax[ (#ENV{max}|=={+}|oui)on]" title="<:galactic_contrib:depuis_origine|attribut_html:>" rel="nofollow">
<:galactic_contrib:sans_limite:>
</a>
</div>
<div class="onglets__groupe">
<a href="[(#GET{self}|parametre_url{ordre,''})]" class="ajax[ (#ENV{ordre}|non)on]" title="<:galactic_contrib:classer_par_date|attribut_html:>" rel="nofollow">
<:galactic_contrib:par_date:>
</a>
</div>
</div>
[(#FORMULAIRE_RECHERCHE_AJAX{#SELF,<:galactic_contrib:info_filtrer:>})]
</div>[(#REM) .alignement_avec_liste ]
#SET{date_min,#NULL}
#SET{age,1825}
[(#ENV{max}|=={1y}|oui)#SET{age,365}]
[(#ENV{max}|=={3m}|oui)#SET{age,90}]
[(#ENV{max}|=={+}|oui)#SET{age,#NULL}]
#SET{par,date_thread} [(#REM) ou date_heure ]
<INCLURE{fond=inclure/forums/liste-discussions, dernier_message=1,
id_article, id_rubrique, recherche,
age=#GET{age}, date_thread=#GET{date_min},
par=#GET{par},
ajax, env} />

@ -0,0 +1,8 @@
#SET{nb_reponses,#ENV{nb_reponses,0}}
<div class="nb_comments comments_#GET{nb_reponses}" title="[(#GET{nb_reponses}|contrib_pluraliser{galactic_contrib:info_reponses}|attribut_html)]">
[(#GET{nb_reponses}|oui)#GET{nb_reponses}]
#SET{icone,fa-comment}
[(#GET{nb_reponses}|=={1}|oui)#SET{icone,fa-comment-o}]
[(#GET{nb_reponses}|>{1}|oui)#SET{icone,fa-comments-o}]
<span class="fa[ (#GET{icone})]" aria-hidden="true"></span>
</div>

@ -0,0 +1,36 @@
<BOUCLE_moderateur(CONDITION)
{si #ENV{id_forum}}
{si #ENV{objet}}
{si #ENV{id_objet}}
>
<?php
if (
!empty($GLOBALS['visiteur_session']['id_auteur'])
and $GLOBALS['visiteur_session']['statut']=='0minirezo'
and include_spip('inc/autoriser')
and autoriser('modererforum','#ENV{objet}','#ENV{id_objet}')
) {
include_spip('inc/actions');
$action_off = generer_action_auteur('instituer_forum','#ID_FORUM-off',self());
$action_spam = generer_action_auteur('instituer_forum','#ID_FORUM-spam',self());
echo '<div class="moderations">';
echo bouton_action(
'<i class="fa fa-fire" aria-hidden="true"></i> <span class="sr-only">' . _T('forum:icone_bruler_message') . '</span>',
$action_spam,
'moderation-spam ajax',
_T('galactic_forum:confirmer_spam_message'),
_T('forum:icone_bruler_message')
);
echo bouton_action(
'<i class="fa fa-trash-o" aria-hidden="true"></i> <span class="sr-only">' . _T('forum:icone_supprimer_message') . '</span>',
$action_off,
'moderation-off ajax',
_T('galactic_forum:confirmer_suppression_message'),
_T('forum:icone_supprimer_message')
);
echo '</div>';
unset($action_off, $action_spam);
}
?>
</BOUCLE_moderateur>

@ -0,0 +1,39 @@
<B_forums>
<div class="Sujets">
#ANCRE_PAGINATION
<h3 class="menu-titre invisible"><:galactic_contrib:dernieres_discussions_par_date></h3>
[<p class="nb_resultats">(#GRAND_TOTAL|contrib_pluraliser{galactic_contrib:discussions})</p>]
<ul class="listeSujets comments-ul comments-items">
<BOUCLE_forums(FORUMS)
{id_article ?}
{articles.id_rubrique?}
{id_auteur?}
{id_mot?}
{age ?<=#ENV{age}}
{date_heure ?> #ENV{date_heure}}
{date_thread ?> #ENV{date_thread}}
{recherche?}
{par #ENV{par,date_heure}}{inverse #ENV{inverse,1}}
{!par date_heure}
{pagination 10}
>
<li class="item comment-li comment-item">
<INCLURE{fond=inclure/forums/presentation-message, id_forum} />
<B_dernier_message>
<ul class="listeReponses comment-ul comment-items">
<BOUCLE_dernier_message(FORUMS){plat}{id_thread}{id_parent!=0}{par date}>
<li class="item comment-li comment-item">
<INCLURE{fond=inclure/forums/presentation-reponse, id_forum} />
</li>
</BOUCLE_dernier_message>
</ul>
</B_dernier_message>
</li>
</BOUCLE_forums>
</ul>
[<div class="pagination">(#PAGINATION)</div>]
</div>
</B_forums>
[<p class="nb_resultats">(#GRAND_TOTAL|contrib_pluraliser{galactic_contrib:discussions})</p>]
<//B_forums>

@ -0,0 +1,19 @@
<BOUCLE_forum(FORUMS){id_forum}>
#SET{nb_reponses,0}
<BOUCLE_compte(FORUMS){id_thread}{plat}{id_parent!=0} />#SET{nb_reponses,#TOTAL_BOUCLE}<//B_compte>
<div id="forum#ID_FORUM" class="comment ligneSujet[ (#GET{nb_reponses}|>={1}|non)noreponse]">
<div class="ligneSujet__enbref">
<INCLURE{fond=inclure/forums/bref/commentaires, nb_reponses=#GET{nb_reponses}} />
<INCLURE{fond=inclure/forums/bref/moderation, id_forum, objet, id_objet} />
</div>
<div class="ligneSujet__description">
<INCLURE{fond=inclure/forums/publication-auteur, id_auteur, id_forum, nom, date, lien_lang=#LANG, lien_lang_dir=#LANG_DIR} />
[<div class="texte #EDIT{texte}">(#TEXTE)</div>]
</div>
</div>
</BOUCLE_forum>

@ -0,0 +1,16 @@
<BOUCLE_forum(FORUMS){id_forum}>
<div id="forum#ID_FORUM" class="ligneSujet comment">
<div class="ligneSujet__enbref">
<div class="link">
<a href="#URL_FORUM" title="<:galactic_contrib:message_suivant_dans_discussion|attribut_html:>">
<span class="fa fa-reply[ (#LANG_DIR|=={rtl}|?{fa-flip-vertical,fa-rotate-180})]" aria-hidden="true" ></span>
</a>
</div>
<INCLURE{fond=inclure/forums/bref/moderation, id_forum, objet, id_objet} />
</div>
<div class="ligneSujet__description">
<INCLURE{fond=inclure/forums/publication-auteur, id_auteur, id_forum, nom, date, lien_lang=#LANG, lien_lang_dir=#LANG_DIR} />
[<div class="texte #EDIT{texte}">(#TEXTE)</div>]
</div>
</div>
</BOUCLE_forum>

@ -0,0 +1,19 @@
<div class="publication">
<div class="publication__logo">
[(#LOGO_AUTEUR|image_reduire{20,20}|sinon{#LOGO_ARTICLE|image_reduire{20,20}|image_alpha{50}})]
</div>
<div class="publication__auteur">
<BOUCLE_auteur(AUTEURS){tout}{id_auteur}>
[(#REM) on force l'affichage de la page appelee dans la langue et la dir de l'environnement global d'origine ]
[<a href="[(#URL_AUTEUR|parametre_url{lang,#ENV{lien_lang,''}}|parametre_url{dir,#ENV{lien_lang_dir,''}})]">(#NOM)</a>]
</BOUCLE_auteur>
[<strong class="non_auteur">(#NOM)</strong> ]
<//B_auteur>
</div>
<div class="publication_date">
<a href="#URL_FORUM{#ID_FORUM}" class="permalink" title="<:galactic_contrib:permalink|attribut_html:>">
<span class="fa fa-link" aria-hidden="true"></span>
<time class="published" datetime="[(#DATE|date_iso)]" title="[(#DATE|affdate_heure|attribut_html)]">[(#DATE|date_relative)]</time>
</a>
</div>
</div>

@ -1,3 +1,6 @@
[(#REM) Feuille de style CSS pour les icones ]
[<link rel="stylesheet" href="(#CHEMIN{css/font-awesome.min.css}|direction_css|timestamp)" type="text/css" media="all" />]
[(#REM) Feuille de style CSS pour la coloration ]
[<link rel="stylesheet" href="(#CHEMIN{css/geshi.css}|timestamp)" type="text/css" media="all" />]

@ -6,5 +6,56 @@ if (!defined('_ECRIRE_INC_VERSION')) {
}
$GLOBALS[$GLOBALS['idx_lang']] = array(
// A
'annees_un' => '1 an',
'annees_nb' => '@nb@ ans',
'annees_depuis_un' => 'Depuis 1 an',
'annees_depuis_nb' => 'Depuis @nb@ ans',
'aucune_reponse' => 'Pas de réponse',
// C
'classer_par_date' => 'Classer par date',
'classer_par_note' => 'Classer par note',
// D
'depuis_origine' => 'Depuis toujours',
'dernieres_discussions_par_date' => 'Discussions par date dactivité',
'discussions_zero' => 'Aucune discussion',
'discussions_un' => 'Une discussion',
'discussions_nb' => '@nb@ discussions',
// I
'info_filtrer' => 'Filtrer',
'info_reponses_zero' => '0 réponse',
'info_reponses_un' => '1 réponse',
'info_reponses_nb' => '@nb@ réponses',
'info_votes_zero' => '0 vote',
'info_votes_un' => '1 vote',
'info_votes_nb' => '@nb@ votes',
'info_votes_plus_zero' => '0 vote positif',
'info_votes_plus_un' => '1 vote positif',
'info_votes_plus_nb' => '@nb@ votes positifs',
'info_votes_moins_zero' => '0 vote négatif',
'info_votes_moins_un' => '1 vote négatif',
'info_votes_moins_nb' => '@nb@ votes négatifs',
// M
'message_dans_discussion' => 'Message dans la discussion',
'message_suivant_dans_discussion' => 'Message suivant dans la discussion',
'mois_un' => '1 mois',
'mois_nb' => '@nb@ mois',
'mois_depuis_un' => 'Depuis 1 mois',
'mois_depuis_nb' => 'Depuis @nb@ mois',
// P
'par_date' => 'Par date',
'par_note' => 'Par note',
'permalink' => 'Lien permanent',
// R
'rechercher' => 'Rechercher',
// S
'sans_limite' => 'Sans limite',
);

@ -85,3 +85,14 @@
.user__links {
margin-top: .5em;
}
.menu--surweb {
p {
margin: 0;
}
}
@import "scss/theme/onglets";
@import "scss/theme/formulaires";
@import "scss/theme/forums";

@ -0,0 +1,148 @@
/* Colorer pour rendre visible tous les formulaires */
.formulaire_spip:not(.formulaire_recherche) {
background: $couleur-gris5;
padding:1em;
}
/* Comprimer le formulaire de login */
.formulaire_login {
position:relative;
#pass_securise { float:right; }
.editer_password .details { margin-bottom:0; }
.editer_session { margin-bottom:0; }
fieldset { margin:0; }
.boutons { margin-top:0; padding:0; position:absolute; bottom:1em; right:1em; }
}
.formulaire_oubli {
padding:0 1em;
fieldset { margin:0; }
.boutons { padding:0; }
}
.formulaire_forum {
margin-top:1em;
.texte {
font-size:.9em;
}
.explication {
font-size:.8em;
}
.titre_groupe {
font-weight: normal;
display:inline-block;
}
.choix_mots {
margin-left:1em;
margin-bottom:1em;
columns:3;
@include media($bp-medium) {
columns:2;
}
@include media($bp-small) {
columns:1;
}
}
.editer_notification {
border: 1px solid #ddd;
border-radius: 5px;
background: rgba(255,255,255,.3);
padding-left: 1em;
margin-bottom: 0;
.choix label {
font-size: .9em;
}
}
fieldset.qui {
margin-top:0;
}
fieldset.commentaire {
margin-bottom: 0;
margin-top:0;
}
fieldset + fieldset.commentaire {
margin-top:1.5em;
}
}
.formulaire_spip {
fieldset.previsu {
background:white;
padding:1em 1em 0 1em;
border:3px solid #ecc218;
& > legend {
margin-top:-1.2em;
}
.comment-meta {
overflow: auto;
border-bottom: 3px solid $couleur-gris5;
padding-bottom: .5em;
.spip_logo {
float:right;
height:auto !important;
max-width:20px !important;
}
}
}
}
.formulaire_recherche_ajax {
form {
position: relative;
width: 100%;
}
svg {
display:block;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: em(12px);
width: em(12px);
height: em(12px);
* {
stroke: $couleur-nav;
}
}
div.search {
width: 100%;
}
a.close {
position:absolute;
top: 50%;
transform: translateY(-50%);
right:0;
padding: em(6px) em(12px);
color:$couleur-gris4b;
&:hover {
color: $couleur-lien;
}
}
div.submit {
display: none;
}
input[type="search"] {
border: 1px solid $couleur-gris4b;;
height: em(36px);
width: 100%;
padding-left: em(34px);
padding-right: 15%;
&:focus {
border: 1px solid $couleur-nav;
}
}
}
.formulaire_ecrire_auteur {
padding:1em 2em;
legend {
text-transform: none;
}
fieldset:last-of-type {
margin-bottom:0;
}
.boutons {
margin-top:0;
}
.previsu .comment-meta { margin-bottom:.5em; }
}

@ -0,0 +1,217 @@
$largeur-enbref: 72px;
$largeur-enbref-bordure: 72px - 4px;
.article__forum {
padding-top:3em;
background-color:white;
@include media($bp-medium-up) {
padding-left: calc(5.5555% - #{$largeur-enbref});
}
@include media($bp-large-up) {
padding-left: calc(16.6666% - #{$largeur-enbref});
}
}
.listeSujets, .listeReponses {
list-style-type:none;
margin-left:0;
margin-top:2em;
margin-bottom:4em;
/* Comments déplace la réponse du formulaire */
.reponse_formulaire {
padding: 0.5em;
margin-left: calc(#{$largeur-enbref} + 1em); /* ~ largeur de .ligneSujet__enbref */
@include media($bp-small) {
margin-left:0;
}
border: 1px solid;
font-weight: normal;
min-height: em(24px);
margin-bottom: 1em;
margin-top: 1em;
}
.reponse_formulaire_ok {
color: #264409;
border-color: #C6D880;
background-color: #E6EFC2;
}
.reponse_formulaire_erreur {
color: #8A1F11;
border-color: #FBC2C4;
background-color: #FBE3E4;
}
}
.alignement_avec_liste, .nb_resultats {
padding-left: $largeur-enbref; /* ~ largeur de .ligneSujet__enbref */
@include media($bp-small) {
padding-left:0;
}
}
.nb_resultats {
margin-top:-1em;
margin-bottom:3em;
font-size:.9em;
color:transparentize($couleur-texte, 20%);
margin-left:1em;
}
.ligneSujet {
display:flex;
.ligneSujet__enbref {
font-size: .9em;
text-align:right;
width: $largeur-enbref;
@include vendor-prefix('flex', 0 0 $largeur-enbref);/* 999 votes */
padding-right:1em;
margin-right:1em;
border-right:4px solid $couleur-gris5;
@include media($bp-xxsmall) {
display:none; /* TEMPORAIRE // TODO */
}
.categorie {
margin-top:.1em;
}
.nb_comments {
display: block;
.fa {
color: $couleur-gris4;
}
&.comments_0 .fa {
color: $couleur-nocomment;
}
}
}
.ligneSujet__enbref {
.nb_comments { margin-bottom:1em; }
.resolu { font-size:2em; }
.moderations {
margin-top:1em;
.bouton_action_post {
display:block;
border:none;
font-size:2em;
margin-right:.1em;
line-height:1;
button {
border:none;
background:transparent;
padding:0;
color:$couleur-bouton;
transition:color 0.3s;
}
&:not(:last-child) {
margin-bottom:.2em;
}
&.moderation-off button {
&:hover, &:focus {
color:$couleur-moderation-off !important;
background-color:transparent !important;
}
}
&.moderation-spam button {
&:hover, &:focus {
color:$couleur-moderation-spam !important;
background-color:transparent !important;
}
}
}
}
}
.ligneSujet__description {
@include vendor-prefix('flex-grow', 1);
overflow-wrap: break-word;
min-width: 0;
padding-bottom: 2em;
.titre {
margin-bottom: .3em;
}
}
&:not(.complet) {
.ligneSujet__description {
p { margin-bottom:0; }
}
}
&.complet .titre {
margin:0 0 1em;
}
.publication {
background: transparentize($couleur-gris5, 70%);
padding:.2em .3em;
margin: 0 0 .4em 0;
border-bottom: 2px solid $couleur-gris5;
display:flex;
@include vendor-prefix('flex-direction', 'row');
@include vendor-prefix('flex-wrap', 'wrap');
font-size: .9em;
.publication__logo {
width: 20px;
@include vendor-prefix('flex', '0 0 20px');
img { vertical-align: top; margin-top:1px; }
}
.publication__auteur {
margin-left:.5em;
@include vendor-prefix('flex-grow', 1);
}
.publication_date {
width:12em;
@include vendor-prefix('flex', '0 0 12em');
text-align:right;
margin-left: auto;
abbr.published { border-bottom:0; }
a.permalink {
color:$couleur-texte;
.fa {
color: $couleur-bouton-sombre;
margin-right:.5em;
transition: color 0.3s;
}
&:hover .fa {
color: $couleur-lien-hover;
}
}
@include media($bp-xxsmall) {
width:auto;
@include vendor-prefix('flex', '0 0 100%');
}
}
}
.texte p:last-child {
margin-bottom:0;
}
/* message qui est une réponse, dans une liste dintros */
.reponse {
display:flex;
@include vendor-prefix('flex-direction', 'row');
.link {
width: 2em;
@include vendor-prefix('flex', 0 0 2em);
a {
padding:.3em;
}
}
.message_reponse {
@include vendor-prefix('flex-grow', 1);
}
}
}
.listeReponses {
margin-top:0;
}
.comments .comment-form{
margin-left:$largeur-enbref;
}

@ -0,0 +1,70 @@
.onglets {
display:flex;
@include vendor-prefix('flex-wrap', 'wrap');
@include vendor-prefix('justify-content', 'space-between');
font-size:.9em;
list-style-type:none;
.onglets__groupe {
display: flex;
@include vendor-prefix('flex-wrap', 'wrap');
margin-bottom: 0.5em;
}
.onglets__groupe:not(.onglets__groupe--principal) {
font-size:.9em;
}
a {
text-align:center;
padding: .3em .6em;
line-height: 1;
margin-bottom:.3em;
background-color: $couleur-gris5;
&:not(:last-child) {
margin-right:4px;
}
&.on {
/*background-color: $couleur-lien-hover;*/
/*color:white;*/
border-bottom: 4px solid $couleur-onglet-hover;
font-weight: bold;
}
&:hover, &:focus {
background-color: $couleur-lien;
color:white;
text-decoration:none;
}
.label, .badge {
background-color: $couleur-lien;
transition: background-color 0.3s, color 0.3s;
}
&.on, &:hover, &:focus {
.fa {
color: white !important;
transition: color 0.3s;
}
.label, .badge {
background:white;
color: $couleur-lien !important;
.fa { color: $couleur-lien !important; }
}
}
.fa.sans_reponse { color: $couleur-nocomment; margin-right:.2em; }
}
a.on .badge,
a.on .label {
background:white
}
.onglets__groupe--principal, .js-tablist {
width: 100%;
a {
border:0;
padding: .4em .7em;
}
a.on {
background-color: $couleur-lien-hover;
color:white;
}
}
}

@ -5,6 +5,7 @@ $couleur-gris1: #333333;
$couleur-gris2: #424242;
$couleur-gris3: #444444;
$couleur-gris4: #838383;
$couleur-gris4b : #cacaca;
$couleur-gris5: #f0edf0;
$couleur-gris6: #f8f6f8;
@ -26,4 +27,12 @@ $couleur-texte-gris: lighten($couleur-gris3, 6%);
$couleur-lien: #27A3C3;
$couleur-lien-hover: darken($couleur-lien, 10%);
$couleur-fond-boussole: #333;
$couleur-fond-boussole: #333;
/** Autres couleurs */
$couleur-moderation-off: #d10007;
$couleur-moderation-spam: #ff6a00;
$couleur-bouton : #e8e5e8;
$couleur-bouton-sombre : #dddadd;
$couleur-nocomment: #ba2842;
$couleur-onglet-hover: $couleur-nav-fleche-hover;
Loading…
Cancel
Save