Dotclear

Changeset 3289:9993fc03f56d for inc


Ignore:
Timestamp:
07/23/16 12:55:20 (9 years ago)
Author:
franck <carnet.franck.paul@…>
Branch:
default
Message:

Implements <time> element whenever it's relevant, thank's Tomek for suggestion

Location:
inc/public/default-templates/dotty
Files:
8 edited

Legend:

Unmodified
Added
Removed

  • inc/public/default-templates/dotty/README.md

    r3246 r3289  
    1 # Currywurst 
     1# Dotty 
    22 
    3 Un nouveau jeu de templates par défaut pour Dotclear (versions ≥ 2.7) 
     3Un nouveau jeu de templates pour Dotclear (versions ≥ 2.10) 
    44 
    55## Motivations 
    66 
    7 Le jeu de templates Currywurst répond à divers objectifs : 
    8  
    9 - Proposer un jeu de templates en HTML 5. 
    10 - Pouvoir ainsi y introduire des balises [http://fr.wikipedia.org/wiki/Accessible_Rich_Internet_Applications](ARIA) pour une meilleure accessibilité. 
    11 - Améliorer la sémantique des tags html (par exemple ne plus présenter les commentaires dans une liste de définition). 
    12 - Factoriser les éléments récurrents dès que c'est possible sans pâtir à la compréhension. 
    13 - Préparer le passage à la syntaxe [http://twig.sensiolabs.org/](twig). 
    14 - Adopter une nomenclature inspirée de [http://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/](BEM) – sans en faire une religion dogmatique toutefois. Voir aussi [http://coding.smashingmagazine.com/2011/12/12/an-introduction-to-object-oriented-css-oocss/](OOCSS). 
    15 - Faire en sorte de réduire l'obligation de recourir aux sélecteurs enfants (`#top h1 {}` par exemple) ou aux ID dans les CSS. 
    16  
    17 ## Revue fichier par fichier 
    18  
    19 Ne sont pas listées les modifications systématiques : ajout de classes sur tous les éléments « probablement stylés » ou ne possédant qu'un id ; syntaxe html5. 
    20  
    21 Les modifications nécessitant des explications sont listées de la façon suivante : 
    22  
    23     <Description courte> : <motivation>. <Explication>. 
    24  
    25 Les motivations sont abrégées en : 
    26 - a11y : amélioration accessibilité 
    27 - sém. : amélioration ou correction sémantique (html) 
    28 - cont. : amélioration du contenu 
    29 - ergo : amélioration ergonomique 
    30  
    31 Par convention l'ordre des attributs dans les balises html est *class, id, autres attributs*. 
    32  
    33 Toutes les listes (ul ou ol) comportent le terme "list" dans leur nom de class. 
    34  
    35 ### _top.html 
    36  
    37 Déplacement des liens d'accès rapides au-dessus du titre du blog : **a11y**, **ergo**. *Le titre de fenêtre étant lu avant tout par les aides techniques, l'internaute sait déjà où il se trouve. L'accès est également plus rapide au clavier. Côté design, la plupart des créateurs de thèmes ont pris l'habitude de déplacer ce bloc en haut de la page ; ils n'auront plus besoin de passer par des position absolute pour ce faire.* 
    38  
    39 ### _simple-entry.html 
    40  
    41 (aka contexte du billet seul entier avec commentaires etc.) 
    42  
    43 Formulaire de dépôt de commentaire : 
    44 - remplacement des inputs par des buttons 
    45 - typage des champs 
    46 - ajout des attributs required quand nécessaire 
    47  
    48 Découpage en deux grandes div : post et post-feedback. 
    49 - post 
    50   - post-title : titre 
    51   - post-meta 
    52     - post-info 
    53     - post-tags-list 
    54   - post-excerpt 
    55   - post-content 
    56   - post-attachments 
    57     - post-attachments-title 
    58     - post-attachments-list 
    59 - post-feedback 
    60   - feedback__comments 
    61     - comments-feed 
    62     - comments-list 
    63   - comment-form 
    64   - send-trackback 
    65  
    66 ### __layout.html 
    67  
    68 Reprend l'intégralité du home.html et définit les blocs permettant l'héritage et extension 
    69  
    70 La liste des noms utilisés pour les blocs sont les suivants (les noms sont composés de deux termes, le nom du parent direct du bloc et le nom du bloc en question, sachant que le nom 'attr' est réservé aux attributs des balises, comme par exemple 'body-attr', et 'tag' pour encadrer une balise ouvrante seule) : 
    71  
    72 - html-head : contenu de la balise head 
    73   - head-title : balise title 
    74   - head-meta : liste des balises meta du head 
    75     - meta-robots : consigne pour les robots 
    76     - meta-entry : partie spécifique au contexte 
    77   - head-dc : liste des balises dublin core du head 
    78     - dc-entry : partie spécifique au contexte 
    79   - head-linkrel : liste des balises link rel du head 
    80 - body-tag : balise body (sans contenu ni balise fermante) 
    81 - html-body : contenu de la balise body 
    82   - body-page : contenu de la div #page 
    83     - page-top : contenu d'entête de la div #page (en général inclusion du _top.html) 
    84     - page-wrapper : contenu principal de la div #page, soit le contenu de la div #wrapper 
    85       - wrapper-main : contenu principal de la div #wrapper, soit le contenu de la div #main 
    86         - main-content : contenu de la div #content 
    87       - wrapper-sidebar : contenu annexe de la div #wrapper (en général inclusion de _sidebar.html) 
    88     - page-footer : contenu de pied de page de la div #page (en général inclusion du _footer.html) 
    89  
    90 Pour rappel, la hiérarchie des blocs html est la suivante : 
    91  
    92 - html 
    93   - head 
    94   - body 
    95     - #page 
    96       - .header 
    97       - #wrapper 
    98         - #main 
    99           - #content 
    100         - #sidebar/.sidebar 
    101       - #footer/.footer 
    102  
    103  
    104 *** 
    105  
    106 A réfléchir : inclusion par défaut de liens "sociaux" ? 
    107  
    108 *** 
     7Le jeu de templates Dotty reprend la même structure que le jeu currywurst avec la différence qu'il tire parti des balises sémantiques spécifiques de HTML5 : section, article, aside, header, footer, … 

  • inc/public/default-templates/dotty/_entry-content.html

    r3246 r3289  
    66               <p class="post-info"> 
    77                    <span class="post-author">{{tpl:lang By}} {{tpl:EntryAuthorLink}}, </span> 
    8                     <span class="post-date">{{tpl:EntryDate}}. </span> 
     8                    <span class="post-date"><time datetime="{{tpl:EntryDate iso8601="1"}}" pubdate>{{tpl:EntryDate}}</time>. </span> 
    99                    <span class="post-permalink"><a href="{{tpl:EntryURL}}">{{tpl:lang Permalink}}</a></span> 
    1010                    <tpl:EntryIf has_category="1"> 

  • inc/public/default-templates/dotty/_entry-feedback.html

    r3246 r3289  
    2222                         </tpl:CommentIf> 
    2323                                   <p class="comment-info"><a href="#c{{tpl:CommentID}}" class="comment-number">{{tpl:CommentOrderNumber}}</a> 
    24                                         {{tpl:lang From}} {{tpl:CommentAuthorLink}} - {{tpl:CommentDate format="%d"}}/{{tpl:CommentDate format="%m"}}/{{tpl:CommentDate format="%Y"}}, {{tpl:CommentTime}} 
     24                                        {{tpl:lang From}} {{tpl:CommentAuthorLink}} - <time datetime="{{tpl:CommentDate iso8601="1"}}">{{tpl:CommentDate format="%d"}}/{{tpl:CommentDate format="%m"}}/{{tpl:CommentDate format="%Y"}}, {{tpl:CommentTime}}</time> 
    2525                                   </p> 
    2626                                   <div class="comment-content"> 

  • inc/public/default-templates/dotty/_entry-full.html

    r3246 r3289  
    33     <header> 
    44          <!-- # New day date --> 
    5           <tpl:DateHeader><p class="post-day-date">{{tpl:EntryDate}}</p></tpl:DateHeader> 
     5          <tpl:DateHeader> 
     6               <p class="post-day-date"><time datetime="{{tpl:EntryDate iso8601="1"}}">{{tpl:EntryDate}}</time></p> 
     7          </tpl:DateHeader> 
    68 
    79          <h2 class="post-title"><a href="{{tpl:EntryURL}}">{{tpl:EntryTitle encode_html="1"}}</a></h2> 
    … …  
    2325          <p class="post-info"> 
    2426               <span class="post-author">{{tpl:lang By}} {{tpl:EntryAuthorLink}}, </span> 
    25                <span class="post-date">{{tpl:EntryDate}}.</span> 
     27               <span class="post-date"><time datetime="{{tpl:EntryDate iso8601="1"}}" pubdate>{{tpl:EntryDate}}</time>.</span> 
    2628               <tpl:EntryIf has_category="1"> 
    2729               <span class="post-cat"><tpl:EntryCategoriesBreadcrumb><a 

  • inc/public/default-templates/dotty/_entry-short.html

    r3246 r3289  
    33     <header> 
    44          <!-- # New day date --> 
    5           <tpl:DateHeader><p class="post-day-date">{{tpl:EntryDate}}</p></tpl:DateHeader> 
     5          <tpl:DateHeader> 
     6               <p class="post-day-date"><time datetime="{{tpl:EntryDate iso8601="1"}}">{{tpl:EntryDate}}</time></p> 
     7          </tpl:DateHeader> 
    68 
    79          <h2 class="post-title"><a href="{{tpl:EntryURL}}">{{tpl:EntryTitle encode_html="1"}}</a></h2> 
    … …  
    4244          <p class="post-info"> 
    4345               <span class="post-author">{{tpl:lang By}} {{tpl:EntryAuthorLink}}, </span> 
    44                <span class="post-date">{{tpl:EntryDate}}.</span> 
     46               <span class="post-date"><time datetime="{{tpl:EntryDate iso8601="1"}}" pubdate>{{tpl:EntryDate}}</time>.</span> 
    4547               <tpl:EntryIf has_category="1"> 
    4648               <span class="post-cat"><tpl:EntryCategoriesBreadcrumb><a 

  • inc/public/default-templates/dotty/_entry-title.html

    r3246 r3289  
    33     <header> 
    44          <!-- # New day date --> 
    5           <tpl:DateHeader><p class="day-date">{{tpl:EntryDate}}</p></tpl:DateHeader> 
     5          <tpl:DateHeader> 
     6               <p class="day-date"><time datetime="{{tpl:EntryDate iso8601="1"}}">{{tpl:EntryDate}}</time></p> 
     7          </tpl:DateHeader> 
    68 
    79          <h2 class="post-title"><a href="{{tpl:EntryURL}}">{{tpl:EntryTitle encode_html="1"}}</a></h2> 
    … …  
    1719          <p class="post-info"> 
    1820               <span class="post-author">{{tpl:lang By}} {{tpl:EntryAuthorLink}}, </span> 
    19                <span class="post-date">{{tpl:EntryDate}}. </span> 
     21               <span class="post-date"><time datetime="{{tpl:EntryDate iso8601="1"}}" pubdate>{{tpl:EntryDate}}</time>. </span> 
    2022               <tpl:EntryIf has_category="1"> 
    2123                    <tpl:EntryCategoriesBreadcrumb> 

  • inc/public/default-templates/dotty/archive.html

    r3249 r3289  
    3636               <div id="arch-by-year" class="arch-block arch-by-year"> 
    3737                    <h3>{{tpl:lang By date}}</h3> 
    38                     <p class="fromto">{{tpl:lang FromDay}} <tpl:Entries no_content="1" order="asc" lastn="1"><a href="{{tpl:EntryURL}}">{{tpl:EntryDate format="%e %B %Y"}}</a></tpl:Entries> {{tpl:lang toDay}} <tpl:Entries no_content="1" order="desc" lastn="1"><a href="{{tpl:EntryURL}}">{{tpl:EntryDate format="%e %B %Y"}}</a></tpl:Entries></p> 
     38                    <p class="fromto">{{tpl:lang FromDay}} <tpl:Entries no_content="1" order="asc" lastn="1"><a href="{{tpl:EntryURL}}"><time datetime="{{tpl:EntryDate iso8601="1"}}">{{tpl:EntryDate format="%e %B %Y"}}</time></a></tpl:Entries> {{tpl:lang toDay}} <tpl:Entries no_content="1" order="desc" lastn="1"><a href="{{tpl:EntryURL}}"><time datetime="{{tpl:EntryDate iso8601="1"}}">{{tpl:EntryDate format="%e %B %Y"}}</time></a></tpl:Entries></p> 
    3939                    <tpl:Archives order="asc"> 
    4040                         <tpl:ArchivesYearHeader> 
    4141                              <div class="arch-by-year__each-year"> 
    42                                    <h4>{{tpl:ArchiveDate format="%Y"}}</h4> 
     42                                   <h4><time datetime="{{tpl:ArchiveDate format="%Y"}}">{{tpl:ArchiveDate format="%Y"}}</time></h4> 
    4343                                   <ul class="arch-list arch-year-list"> 
    4444                         </tpl:ArchivesYearHeader> 
    45                                         <li><a href="{{tpl:ArchiveURL}}" title="{{tpl:ArchiveDate encode_html="1"}}">{{tpl:ArchiveDate encode_html="1" format="%B"}}</a> 
     45                                        <li><a href="{{tpl:ArchiveURL}}" title="{{tpl:ArchiveDate encode_html="1"}}"><time datetime="{{tpl:ArchiveDate format="%Y-%m"}}">{{tpl:ArchiveDate encode_html="1" format="%B"}}</time></a> 
    4646                                             <span>({{tpl:ArchiveEntriesCount}})</span></li> 
    4747                         <tpl:ArchivesYearFooter> 

  • inc/public/default-templates/dotty/archive_month.html

    r3249 r3289  
    3838 
    3939     <header id="content-info"> 
    40           <h2>{{tpl:ArchiveDate}} <span>({{tpl:ArchiveEntriesCount}})</span></h2> 
     40          <h2> 
     41               <time datetime="{{tpl:ArchiveDate format="%Y-%m"}}">{{tpl:ArchiveDate}}</time> <span>({{tpl:ArchiveEntriesCount}})</span> 
     42          </h2> 
    4143     </header> 
    4244 
Note: See TracChangeset for help on using the changeset viewer.

Sites map