Changeset 92010 in spip-zone for _squelettes_/bazar


Ignore:
Timestamp:
Sep 22, 2015, 4:06:03 PM (4 years ago)
Author:
chankalan@…
Message:

menu smart + broutilles

Location:
_squelettes_/bazar/trunk
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • _squelettes_/bazar/trunk/css/theme.css

    r91939 r92010  
    5858.ham { border-bottom:3px solid #b7b3ac; border-top:3px solid #b7b3ac; display:block; padding:3px 0 0; margin:3px 0 0; }
    5959.btn-nav .ham:last-of-type { border-bottom:none; }
    60 /* animation du menu sous 768px de largeur ecran, cf js/script.js */
    61 .nav ul.ouvert { height:auto; left:0; text-align:left;
    62         -webkit-animation:  ouvrir 0.2s 1 ease; /* Chrome, Safari, Opera */
    63         animation: ouvrir 0.2s 1 ease;
    64 }
    65 /* Chrome, Safari, Opera */
    66 @-webkit-keyframes ouvrir {
    67     0%   { left:-100%; }
    68     100% { left:0; }
    69 }
    70 /* Standard */
    71 @keyframes ouvrir {
    72     0%   { left:-100%; }
    73     100% { left:0; }
    74 }
    7560
    7661
     
    7964 * contenu
    8065 **********************************/
    81 .arbo { position:absolute; bottom:0; left:16px; width:62%; font-size:70%; padding:0; margin:0; }
     66.arbo { font-size:70%; padding:0 16px; margin:0; }
    8267.arbo a, .arbo { color:#93908B; text-decoration:none; }
    8368.arbo a:hover { color:#666; }
    8469
     70.cartouche { margin-bottom: 2em; }
    8571p.info-publi, p.traductions { font-size:80%; }
    8672p.info-publi { margin:0; }
     
    164150.formulaire_recherche input.submit:hover { color:#000; }
    165151.formulaire_recherche input.text, .formulaire_recherche textarea { padding:0 0.2em; border-color:#C9C5BF; }
    166 .formulaire_recherche .search.text { width: 50%; }
     152.formulaire_recherche .search.text { width: 40%; }
    167153
    168154.formulaire_spip { margin-top:4em; padding-top:1em; border-top:1px solid #C9C5BF; font-size: 80%; color:#C9C5BF; }
     
    202188        }
    203189        .row.nb_tile_3 .tile { max-width:100%; min-height:0; -webkit-align-self: auto; /* Safari */  align-self:auto; }
     190        .header { margin-right:68px; }
    204191        .nav { padding-right:50px; min-height:66px; }
    205         .label-btn-nav { top:20px; left:auto; right:42px; }
    206192        .btn-nav { top:8px; left:auto; right:8px; }
    207         .nav ul { margin:0; position:absolute; right:-100%; top:66px; width:100%; height:0; z-index:2; }
     193        .nav ul { margin:0; position:absolute; right:-100%; top:66px; width:100%; height:0; text-align:left; z-index:2;
     194                -webkit-transition:  right 0.4s; /* Chrome, Safari, Opera */
     195                transition: right 0.4s;
     196        }
    208197        .nav li { display:block; }
    209         .nav li a { display:block; background:#b7b3ac; margin:0; }
     198        .nav li a { display:block; background:#b7b3ac; margin:0; }/* animation du menu sous 768px de largeur ecran, cf js/script.js */
     199        .nav ul.ouvert { height:auto; right:0; }
    210200}
    211201@media (max-width:479px) {
  • _squelettes_/bazar/trunk/formulaires/recherche.html

    r91895 r92010  
    33        [(#ENV{action}|form_hidden)]
    44        [<input type="hidden" name="lang" value="(#ENV{lang})" />]
    5         <label for="#ENV{_id_champ}"><:info_rechercher_02:></label>
    6         <input type="search" class="search text" size="10" name="recherche" id="#ENV{_id_champ}"[ value="(#ENV{recherche})"] accesskey="4" autocapitalize="off" autocorrect="off"
    7         /><input type="submit" class="submit" value="&gt;&gt;" title="<:info_rechercher:>" />
     5        <label for="recherche"><:info_rechercher_02:></label>
     6        <input type="search" class="search text" size="10" name="recherche" id="recherche"[ value="(#ENV{recherche})"] accesskey="4" /><input type="submit" class="submit" value="&gt;&gt;" title="<:info_rechercher:>" />
    87</div></form>
    98</div>
  • _squelettes_/bazar/trunk/inclure/nav.html

    r91939 r92010  
    11<B_nav>
    22<nav class="nav[ (#TOTAL_BOUCLE|=={1}|oui)none]" id="nav" role="navigation" aria-label="Menu principal">
    3         <button type="button" id="btn-nav" class="btn-nav" aria-label="afficher/masquer le menu de navigation">
    4                 <span class="ham"></span>
    5                 <span class="ham"></span>
    6                 MENU
    7         </button>
    83        <ul>
    94                <li class="">
  • _squelettes_/bazar/trunk/js/script.js

    r91895 r92010  
    11$(document).ready(function(){
     2        // placer le html du bouton du menu sous 768px
     3        $('.nav').prepend('<button type="button" class="btn-nav" aria-label="afficher/masquer le menu de navigation"><span class="ham"></span><span class="ham"></span>MENU</button>');
    24        // afficher/masquer le menu
    35        $('.btn-nav').bind('click', function(){
  • _squelettes_/bazar/trunk/paquet.xml

    r91939 r92010  
    22        prefix="bazar"
    33        categorie="squelette"
    4         version="0.2.5"
     4        version="0.2.6"
    55        etat="dev"
    66        compatibilite="[3.0.0;3.1.*]"
  • _squelettes_/bazar/trunk/rubrique.html

    r91901 r92010  
    2727        </header>
    2828        <main class="main clearfix" role="main">
     29                <p class="arbo"><a href="#URL_SITE_SPIP/"><:accueil_site:></a><BOUCLE_ariane(HIERARCHIE){id_rubrique}> &gt; <a href="#URL_RUBRIQUE">[(#TITRE|couper{80})]</a></BOUCLE_ariane>[ &gt; <strong class="on">(#TITRE|couper{80})</strong>]</p><!--.arbo-->
    2930                [(#REM) Contenu principal : contenu de la rubrique ]
    3031                <div class="wrapper">
    3132                <article class="content" id="content">
    32                         <p class="arbo"><a href="#URL_SITE_SPIP/"><:accueil_site:></a><BOUCLE_ariane(HIERARCHIE){id_rubrique}> &gt; <a href="#URL_RUBRIQUE">[(#TITRE|couper{80})]</a></BOUCLE_ariane>[ &gt; <strong class="on">(#TITRE|couper{80})</strong>]</p><!--.arbo-->
    33        
     33                       
    3434                        <header class="cartouche clearfix">
    3535                                <h1 class="#EDIT{titre} surlignable">#TITRE</h1>
Note: See TracChangeset for help on using the changeset viewer.