Changeset 106223 in spip-zone


Ignore:
Timestamp:
Sep 12, 2017, 4:24:35 PM (2 years ago)
Author:
marcimat@…
Message:

Après de longues concertations, testons des onglets plus clair
(sur l’accueil et les catégories pour l’instant uniquement).

On baisse en perf par défaut un peu (le critère notation est appliqué partout, même lorqu’on n’a pas besoin de son tri sur les listes),
mais on pourrait refaire 2 squelettes de liste distincts si besoin (un par date, un par note + {notation}).

Location:
_galaxie_/galactic/galactic_forum
Files:
8 edited

Legend:

Unmodified
Added
Removed
  • _galaxie_/galactic/galactic_forum/inclure/bloc-messages.html

    r106213 r106223  
    66
    77]
     8[(#SET{self,#SELF|parametre_url{debut_forums,''}})]
    89<div class="alignement_avec_liste">
    910<div class="onglets">
    10         <div class="onglets__groupe">
    11                 <a href="[(#SELF|parametre_url{onglet,''}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{onglet}|non)on]" title="<:galactic_forum:derniers_threads_par_date|attribut_html:>" rel="nofollow">
     11        <div class="onglets__groupe onglets__groupe--principal">
     12                <a href="[(#GET{self}|parametre_url{onglet,''})]" class="ajax[ (#ENV{onglet}|non)on]" title="<:galactic_forum:questions_et_derniere_reponse|attribut_html:>" rel="nofollow">
    1213                        <:galactic_forum:activite:>
    1314                </a>
    14                 <a href="[(#SELF|parametre_url{onglet,sujets}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{onglet}|=={sujets}|oui)on]" title="<:galactic_forum:derniers_sujets_ouverts|attribut_html:>" rel="nofollow">
    15                         <:galactic_forum:sujets:>
    16                 </a>
    17                 <a href="[(#SELF|parametre_url{onglet,messages}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{onglet}|=={messages}|oui)on]" title="<:galactic_forum:derniers_messages|attribut_html:>" rel="nofollow">
     15                <a href="[(#GET{self}|parametre_url{onglet,messages})]" class="ajax[ (#ENV{onglet}|=={messages}|oui)on]" title="<:galactic_forum:questions_ou_reponses|attribut_html:>" rel="nofollow">
    1816                        <:galactic_forum:messages:>
    1917                </a>
    20                 <a href="[(#SELF|parametre_url{onglet,sujets_vides}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{onglet}|=={sujets_vides}|oui)on]" title="<:galactic_forum:derniers_sujets_vides|attribut_html:>" rel="nofollow">
     18                <a href="[(#GET{self}|parametre_url{onglet,questions})]" class="ajax[ (#ENV{onglet}|=={questions}|oui)on]" title="<:galactic_forum:questions|attribut_html:>" rel="nofollow">
     19                        <:galactic_forum:questions:>
     20                </a>
     21                <a href="[(#GET{self}|parametre_url{onglet,questions_vides})]" class="ajax[ (#ENV{onglet}|=={questions_vides}|oui)on]" title="<:galactic_forum:questions_sans_reponse|attribut_html:>" rel="nofollow">
    2122                        <span class="fa fa-comment sans_reponse" aria-hidden="true"></span>
    22                         <:galactic_forum:sans_reponse:>
     23                        <:galactic_forum:questions_sans_reponse:>
    2324                </a>
    24                 <a href="[(#SELF|parametre_url{onglet,sujets_notes}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{onglet}|=={sujets_notes}|oui)on]" title="<:galactic_forum:sujets_par_notes|attribut_html:>" rel="nofollow">
    25                         <span class="fa fa-star votes" aria-hidden="true"></span>
    26                         <:galactic_forum:notes:>
    27                 </a>
    28                 <a href="[(#SELF|parametre_url{onglet,sujets_faq}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{onglet}|=={sujets_faq}|oui)on]" title="<:galactic_forum:sujets_resolus_par_notes|attribut_html:>" rel="nofollow">
    29                         <span class="fa fa-star faq" aria-hidden="true"></span>
    30                         <:galactic_forum:faq:>
     25                <a href="[(#GET{self}|parametre_url{onglet,questions_resolues})]" class="ajax[ (#ENV{onglet}|=={questions_resolues}|oui)on]" title="<:galactic_forum:questions_resolues|attribut_html:>" rel="nofollow">
     26                        <span class="fa fa-check resolu" aria-hidden="true"></span>
     27                        <:galactic_forum:questions_resolues:>
    3128                </a>
    3229        </div>
    3330
    3431        <div class="onglets__groupe">
    35                 <a href="[(#SELF|parametre_url{max,''}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{max}|non)on]" title="[(#VAL{5}|singulier_ou_pluriel{galactic_forum:annees_depuis_un,galactic_forum:annees_depuis_nb})]" rel="nofollow">
     32                <a href="[(#GET{self}|parametre_url{max,''})]" class="ajax[ (#ENV{max}|non)on]" title="[(#VAL{5}|singulier_ou_pluriel{galactic_forum:annees_depuis_un,galactic_forum:annees_depuis_nb})]" rel="nofollow">
    3633                        [(#VAL{5}|singulier_ou_pluriel{galactic_forum:annees_un,galactic_forum:annees_nb})]
    3734                </a>
    38                 <a href="[(#SELF|parametre_url{max,1y}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{max}|=={1y}|oui)on]" title="[(#VAL{1}|singulier_ou_pluriel{galactic_forum:annees_depuis_un,galactic_forum:annees_depuis_nb})]" rel="nofollow">
     35                <a href="[(#GET{self}|parametre_url{max,1y})]" class="ajax[ (#ENV{max}|=={1y}|oui)on]" title="[(#VAL{1}|singulier_ou_pluriel{galactic_forum:annees_depuis_un,galactic_forum:annees_depuis_nb})]" rel="nofollow">
    3936                        [(#VAL{1}|singulier_ou_pluriel{galactic_forum:annees_un,galactic_forum:annees_nb})]
    4037                </a>
    41                 <a href="[(#SELF|parametre_url{max,3m}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{max}|=={3m}|oui)on]" title="[(#VAL{3}|singulier_ou_pluriel{galactic_forum:mois_depuis_un,galactic_forum:mois_depuis_nb}|attribut_html)]" rel="nofollow">
     38                <a href="[(#GET{self}|parametre_url{max,3m})]" class="ajax[ (#ENV{max}|=={3m}|oui)on]" title="[(#VAL{3}|singulier_ou_pluriel{galactic_forum:mois_depuis_un,galactic_forum:mois_depuis_nb}|attribut_html)]" rel="nofollow">
    4239                        [(#VAL{3}|singulier_ou_pluriel{galactic_forum:mois_un,galactic_forum:mois_nb})]
    4340                </a>
     
    5047                <BOUCLE_connecte(CONDITION){si #SESSION{id_auteur}}>
    5148                <BOUCLE_compte(FORUMS){id_article ?}{articles.id_rubrique?}{plat}{date > #SESSION{date_suivi_activite}}{si #SESSION{date_suivi_activite}} />#SET{nb,#TOTAL_BOUCLE}<//B_compte>
    52                 <a href="[(#SELF|parametre_url{max,-}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{max}|=={-}|oui)on]" title="<:galactic_forum:depuis_derniere_connexion|attribut_html:>" rel="nofollow">
     49                <a href="[(#GET{self}|parametre_url{max,-})]" class="ajax[ (#ENV{max}|=={-}|oui)on]" title="<:galactic_forum:depuis_derniere_connexion|attribut_html:>" rel="nofollow">
    5350                        <:galactic_forum:derniere_connexion:>
    5451                        [(#GET{nb}|oui)
     
    5956                </BOUCLE_connecte>
    6057
    61                 <a href="[(#SELF|parametre_url{max,+}|parametre_url{debut_forums,''})]" class="ajax[ (#ENV{max}|=={+}|oui)on]" title="<:galactic_forum:depuis_origine|attribut_html:>" rel="nofollow">
     58                <a href="[(#GET{self}|parametre_url{max,+})]" class="ajax[ (#ENV{max}|=={+}|oui)on]" title="<:galactic_forum:depuis_origine|attribut_html:>" rel="nofollow">
    6259                        <:galactic_forum:sans_limite:>
    6360                </a>
    6461        </div>
     62
     63
     64        <div class="onglets__groupe">
     65                <a href="[(#GET{self}|parametre_url{ordre,''})]" class="ajax[ (#ENV{ordre}|non)on]" title="<:galactic_forum:classer_par_date|attribut_html:>" rel="nofollow">
     66                        <:galactic_forum:par_date:>
     67                </a>
     68                <a href="[(#GET{self}|parametre_url{ordre,note})]" class="ajax[ (#ENV{ordre}|=={note}|oui)on]" title="<:galactic_forum:classer_par_note|attribut_html:>" rel="nofollow">
     69                        <:galactic_forum:par_note:>
     70                </a>
     71        </div>
     72
    6573</div>
    6674
     
    7684[(#ENV{max}|=={-}|et{#SESSION{date_suivi_activite}}|oui)#SET{age,#NULL}#SET{date_min,#SESSION{date_suivi_activite}}]
    7785
     86#SET{par,date_heure}
     87[(#ENV{onglet}|non)#SET{par,date_thread}]
     88[(#ENV{ordre}|=={note}|oui)#SET{par,nombre_votes_diff}]
    7889
    79 [(#ENV{onglet}|non)<INCLURE{fond=inclure/liste-sujets, par=date_thread, dernier_message=1, id_article, id_rubrique, age=#GET{age}, date_thread=#GET{date_min}, recherche, ajax, env} />]
    80 [(#ENV{onglet}|=={sujets}|oui)<INCLURE{fond=inclure/liste-sujets, par=date_heure, id_article, id_rubrique, age=#GET{age}, date_heure=#GET{date_min}, recherche, ajax, env} />]
    81 [(#ENV{onglet}|=={messages}|oui)<INCLURE{fond=inclure/liste-messages, id_article, id_rubrique, age=#GET{age}, date_heure=#GET{date_min}, recherche, ajax, env} />]
    82 [(#ENV{onglet}|=={sujets_vides}|oui)<INCLURE{fond=inclure/liste-sujets-vides, id_article, id_rubrique, age=#GET{age}, date_heure=#GET{date_min}, recherche, ajax, env} />]
    83 [(#ENV{onglet}|=={sujets_notes}|oui)<INCLURE{fond=inclure/liste-sujets-par-notes, id_article, id_rubrique, age=#GET{age}, date_heure=#GET{date_min}, recherche, ajax, env} />]
    84 [(#ENV{onglet}|=={sujets_faq}|oui)<INCLURE{fond=inclure/liste-sujets-resolus-par-notes, id_article, id_rubrique, age=#GET{age}, date_heure=#GET{date_min}, recherche, ajax, env} />]
     90
     91[(#ENV{onglet}|non)
     92        <INCLURE{fond=inclure/liste-sujets, dernier_message=1,
     93                id_article, id_rubrique, recherche,
     94                age=#GET{age}, date_thread=#GET{date_min},
     95                par=#GET{par},
     96                ajax, env} />
     97]
     98[(#ENV{onglet}|=={questions}|oui)
     99        <INCLURE{fond=inclure/liste-sujets,
     100                id_article, id_rubrique, recherche,
     101                age=#GET{age}, date_thread=#GET{date_min},
     102                par=#GET{par},
     103                ajax, env} />
     104]
     105[(#ENV{onglet}|=={messages}|oui)
     106        <INCLURE{fond=inclure/liste-messages,
     107                id_article, id_rubrique, recherche,
     108                age=#GET{age}, date_heure=#GET{date_min},
     109                par=#GET{par},
     110                ajax, env} />
     111]
     112
     113[(#ENV{onglet}|=={questions_vides}|oui)
     114        <INCLURE{fond=inclure/liste-sujets-vides,
     115                id_article, id_rubrique, recherche,
     116                age=#GET{age}, date_heure=#GET{date_min},
     117                par=#GET{par},
     118                ajax, env} />
     119]
     120[(#ENV{onglet}|=={questions_resolues}|oui)
     121        <INCLURE{fond=inclure/liste-sujets-resolus,
     122                id_article, id_rubrique, recherche,
     123                age=#GET{age}, date_heure=#GET{date_min},
     124                par=#GET{par},
     125                ajax, env} />
     126]
  • _galaxie_/galactic/galactic_forum/inclure/liste-messages.html

    r106203 r106223  
    99                {id_auteur?}
    1010                {id_mot?}
     11                {notation}
    1112                {plat}
    1213                {recherche?}
     
    1415                {date_heure ?> #ENV{date_heure}}
    1516                {date_thread ?> #ENV{date_thread}}
    16                 {!par date}
     17                {par #ENV{par,date_heure}}{inverse #ENV{inverse,1}}
    1718                {pagination 10}
    1819        >
  • _galaxie_/galactic/galactic_forum/inclure/liste-sujets-resolus.html

    r106203 r106223  
    99                {id_auteur?}
    1010                {resolus}
     11                {notation}
    1112                {age ?<=#ENV{age}}
    1213                {date_heure ?> #ENV{date_heure}}
  • _galaxie_/galactic/galactic_forum/inclure/liste-sujets-vides.html

    r106203 r106223  
    88                {articles.id_rubrique?}
    99                {id_auteur?}
     10                {notation}
    1011                {compter_reponses nombre_reponses = 0}
    1112                {age ?<=#ENV{age}}
  • _galaxie_/galactic/galactic_forum/inclure/liste-sujets.html

    r106216 r106223  
    99                {id_auteur?}
    1010                {id_mot?}
     11                {notation}
    1112                {age ?<=#ENV{age}}
    1213                {date_heure ?> #ENV{date_heure}}
     
    1415                {recherche?}
    1516                {par #ENV{par,date_heure}}{inverse #ENV{inverse,1}}
     17                {!par date_heure}
    1618                {pagination 10}
    1719        >
  • _galaxie_/galactic/galactic_forum/lang/galactic_forum_fr.php

    r106221 r106223  
    3636        // C
    3737        'classer' => 'Classer',
     38        'classer_par_date' => 'Classer par date',
     39        'classer_par_note' => 'Classer par note',
    3840        'clos' => 'Ce fil de discussion est clos',
    3941        'confirmer_suppression_message' => 'Confirmer la suppression du message ?',
     
    4244
    4345        // D
     46        'date' => 'Date',
    4447        'discussions' => 'Discussions',
    4548        'deplacer_dans' => 'Déplacer dans',
     
    151154        'nouveaux_messages_connexion_un' => '1 nouveau message depuis votre dernière connexion',
    152155        'nouveaux_messages_connexion_nb' => '@nb@ nouveaux messages depuis votre dernière connexon',
     156        'note' => 'Note',
    153157        'notes' => 'Notes',
    154158
    155159        // P
    156160        'page_utile' => 'Cette page vous a-t-elle été :',
    157         'par_date' => 'par date',
    158         'par_interet' => 'par intérêt',
    159         'par_pertinence' => 'par pertinence',
     161        'par_date' => 'Par date',
     162        'par_interet' => 'Par intérêt',
     163        'par_pertinence' => 'Par pertinence',
     164        'par_note' => 'Par note',
    160165
    161166        // Q
    162167        'questions' => 'Questions',
     168        'questions_et_derniere_reponse' =>'Questions et leur dernière réponse',
     169        'questions_ou_reponses' =>'Questions ou réponses',
     170        'questions_sans_reponse' => 'Questions sans réponses',
     171        'questions_resolues' => 'Questions résolues',
    163172        'quoideneuf' => 'Modifications récentes',
     173
    164174
    165175        // R
  • _galaxie_/galactic/galactic_forum/scss/theme/onglets.scss

    r106166 r106223  
    99                display: flex;
    1010                @include vendor-prefix('flex-wrap', 'wrap');
     11                margin-bottom: 0.5em;
     12        }
     13        .onglets__groupe:not(.onglets__groupe--principal) {
     14                font-size:.9em;
    1115        }
    1216        a {
    1317                text-align:center;
    14                 padding:.3em .7em;
     18                padding: .3em .6em;
     19                line-height: 1;
     20                margin-bottom:.3em;
    1521                background-color: $couleur-gris5;
    1622                &:not(:last-child) {
    1723                        margin-right:4px;
    1824                }
    19                 margin-bottom:.5em;
    2025                &.on {
    21                         background-color: $couleur-lien-hover;
    22                         color:white;
     26                        /*background-color: $couleur-lien-hover;*/
     27                        /*color:white;*/
     28                        border-bottom: 4px solid $couleur-onglet-hover;
     29                        font-weight: bold;
    2330                }
    2431                &:hover, &:focus {
     
    4552                .fa.sans_reponse { color: $couleur-nocomment; margin-right:.2em; }
    4653                .fa.faq { color: $couleur-faq; margin-right:.2em; }
     54                .fa.resolu { color: $couleur-resolu; margin-right:.2em; }
    4755        }
    4856        a.on .badge,
     
    5058                background:white
    5159        }
     60        .onglets__groupe--principal {
     61                width: 100%;
     62                a {
     63                        border:0;
     64                        padding: .4em .7em;
     65                }
     66                a.on {
     67                        background-color: $couleur-lien-hover;
     68                        color:white;
     69                }
     70        }
    5271}
     72
  • _galaxie_/galactic/galactic_forum/scss/utils/_couleurs.scss

    r106222 r106223  
    6464        $couleur-chapitre-hover: set-nth($couleur-chapitre-hover, $i, change-color(nth($couleur-chapitre-vif, $i), $lightness: 90%, $alpha: .2));
    6565}
     66
     67$couleur-onglet-hover: $couleur-nav-fleche-hover;
Note: See TracChangeset for help on using the changeset viewer.