Changeset 75870 in spip-zone for _plugins_/boussole/branches/v0


Ignore:
Timestamp:
Sep 14, 2013, 8:26:33 PM (6 years ago)
Author:
eric@…
Message:

Synchronisation de la topnav de la boussole v0 avec celle de la boussole v2

Location:
_plugins_/boussole/branches/v0
Files:
5 edited

Legend:

Unmodified
Added
Removed
  • _plugins_/boussole/branches/v0/css/boussole_topnav.css

    r75790 r75870  
    1 /* CSS crunched with Crunch - http://crunchapp.net/ */
    2 .spip_theme{background:#f9f9f9;-webkit-box-shadow:0px 3px 5px #aaaaaa;-moz-box-shadow:0px 3px 5px #aaaaaa;box-shadow:0px 3px 5px #aaaaaa;}
    3 .menu_container.spip-theme{background:#f9f9f9;-webkit-box-shadow:0px 3px 5px #aaaaaa;-moz-box-shadow:0px 3px 5px #aaaaaa;box-shadow:0px 3px 5px #aaaaaa;}.menu_container.spip-theme>ul>li a{color:#4b4b4b;font-family:"Georgia,Cambria,Times New Roman,Times,serif";font-size:16px;}.menu_container.spip-theme>ul>li a:hover,.menu_container.spip-theme>ul>li a:active,.menu_container.spip-theme>ul>li a:focus{background:none;}
    4 .menu_container.spip-theme>ul>li:hover{background-color:#d2a3d8;}
    5 .menu_container.spip-theme ul.menu_submenu_block li a:hover{background:none repeat scroll 0% 0% #f9f9f9;}
    6 .menu_container{margin-bottom:0;height:45px;clear:both;float:left;position:absolute;top:0;left:0;}
    7 .menu_container.full_width{width:100%;}
    8 .menu_container>ul{list-style:none outside none;margin:0px;padding:0px;float:left;position:relative;width:100%;height:inherit;}.menu_container>ul>li{float:left;padding:0px;margin:0px;text-align:left;border-right:1px solid rgba(255, 255, 255, 0.25);-webkit-box-shadow:-1px 0px 0px rgba(0, 0, 0, 0.2) inset;-moz-box-shadow:-1px 0px 0px rgba(0, 0, 0, 0.2) inset;box-shadow:-1px 0px 0px rgba(0, 0, 0, 0.2) inset;transition:background-color 200ms linear 0s;}
    9 .menu_container>ul>li>a{padding:0 17px;line-height:45px;vertical-align:middle;color:#ffffff;text-decoration:none;text-shadow:0px 1px 2px rgba(0, 0, 0, 0.25);font-size:13px;font-family:"Georgia,Cambria,Times New Roman,Times,serif";}.menu_container>ul>li>a>img{margin-right:10px;vertical-align:middle;}
    10 .menu_container>ul>li.right{float:right;}
    11 .menu_container>ul>li.last>a{box-shadow:none;border-right:0px none;}
    12 .menu_container>ul>li:hover{margin-left:-1px;cursor:pointer;}
    13 .menu_container>ul>li>.menu_dropdown_block{visibility:hidden;display:none;position:absolute;border-right:1px solid #dddddd;border-width:0px 1px 1px;border-style:none solid solid;border-color:-moz-use-text-color #dddddd #dddddd;-moz-border-top-colors:none;-moz-border-right-colors:none;-moz-border-bottom-colors:none;-moz-border-left-colors:none;border-image:none;-webkit-box-shadow:1px 1px 3px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 3px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 3px rgba(0, 0, 0, 0.2);background:none repeat scroll 0% 0% #ffffff;top:100%;color:#575757;opacity:0;text-align:left;transition:opacity 100ms linear 0s;-moz-box-sizing:border-box;overflow:hidden;z-index:30;}
    14 .menu_container>ul>li:hover>.menu_dropdown_block{visibility:visible;display:block;opacity:1;margin-left:-1px;}
    15 .menu_container>ul>li>.menu_dropdown_block.full_width{left:0px;margin-left:0px;}
    16 .menu_container>ul>li>.menu_dropdown_block .ssmenu_container{padding:15px 15px 5px 15px;}.menu_container>ul>li>.menu_dropdown_block .ssmenu_container ul.menu_submenu{list-style:none outside none;padding:0px;margin:0px 0px 10px;}.menu_container>ul>li>.menu_dropdown_block .ssmenu_container ul.menu_submenu li{display:block;}.menu_container>ul>li>.menu_dropdown_block .ssmenu_container ul.menu_submenu li>a{display:block;padding:4px 0px;text-decoration:none;color:#666666;font-family:"Georgia,Cambria,Times New Roman,Times,serif";}.menu_container>ul>li>.menu_dropdown_block .ssmenu_container ul.menu_submenu li>a:hover{color:#111111;background:none;}
    17 .menu_container>ul>li>.menu_dropdown_block .ssmenu_container ul.menu_submenu li>a>img{float:left;margin-right:5px;}
    18 .mobile_collapser{display:none ;}.mobile_collapser>label{display:block;height:22px;padding:12px 25px;color:#4b4b4b;text-shadow:0px 1px 2px rgba(0, 0, 0, 0.25);font-size:16px;line-height:22px;font-family:"Georgia,Cambria,Times New Roman,Times,serif";text-align:left;box-shadow:0px -1px 1px rgba(0, 0, 0, 0.2) inset;}
    19 .mobile_collapser .mobile_menu_icon{display:block;float:left;width:22px;height:22px;background:url('../images/mobile-menu-icon-black.png') no-repeat scroll 50% 50% transparent;margin-right:10px;}
    20 #hidden_menu_collapser{display:none ;}#hidden_menu_collapser:checked+ul{height:auto;min-height:40px;max-height:2999px;}
    21 @media only screen and (max-width:940px) and (min-width:640px){.menu_container>ul>li>a{padding:12px 15px;font-size:14px;} .menu_container>ul>li:hover>a{padding-left:16px;}}@media only screen and (max-width:940px){.mobile_collapser{background:"none no-repeat #353535";display:block;height:46px;} .menu_container{padding:0px;height:auto;}.menu_container>ul{position:relative;transition:all 100ms linear 0s;height:0px;background:inherit;overflow:hidden;}.menu_container>ul>li{position:relative;float:none;background:inherit;}.menu_container>ul>li:hover{margin-left:0px;} .menu_container>ul>li>a{box-shadow:none;border-right:0px none;} .menu_container>ul>li>.menu_dropdown_block{visibility:visible;position:relative;transition:all 100ms linear 0s;height:0px;width:100%;} .menu_container>ul>li:hover>.menu_dropdown_block{height:auto;min-height:40px;max-height:3000px;} .menu_container>ul>li .right{float:none;} .menu_container>ul>li>.menu_dropdown_block [class^="span"],.menu_container>ul>li>.menu_dropdown_block [class*=" span"]{float:none;width:auto ! important;}}html.ie7 .menu_container>ul{zoom:1;white-space:nowrap;z-index:1;}
    22 html.ie7 .menu_container>ul>li>.menu_dropdown_block{top:0;position:relative;}
     1.spip_theme {
     2  background: #2e2e2e;
     3  /* Old browsers */
     4
     5  background-color: #3d3b3c;
     6  background-image: -moz-linear-gradient(top, #2e2e2e, #544f52);
     7  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2e2e2e), to(#544f52));
     8  background-image: -webkit-linear-gradient(top, #2e2e2e, #544f52);
     9  background-image: -o-linear-gradient(top, #2e2e2e, #544f52);
     10  background-image: linear-gradient(to bottom, #2e2e2e, #544f52);
     11  background-repeat: repeat-x;
     12  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2e2e2e', endColorstr='#ff544f52', GradientType=0);
     13  -webkit-box-shadow: 0px 3px 5px #aaaaaa;
     14  -moz-box-shadow: 0px 3px 5px #aaaaaa;
     15  box-shadow: 0px 3px 5px #aaaaaa;
     16}
     17.caret {
     18  content: "";
     19  display: inline-block;
     20  height: 0;
     21  vertical-align: middle;
     22  width: 0;
     23  margin-right: 10px;
     24}
     25.menu_container.spip-theme {
     26  background: #2e2e2e;
     27  /* Old browsers */
     28
     29  background-color: #3d3b3c;
     30  background-image: -moz-linear-gradient(top, #2e2e2e, #544f52);
     31  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2e2e2e), to(#544f52));
     32  background-image: -webkit-linear-gradient(top, #2e2e2e, #544f52);
     33  background-image: -o-linear-gradient(top, #2e2e2e, #544f52);
     34  background-image: linear-gradient(to bottom, #2e2e2e, #544f52);
     35  background-repeat: repeat-x;
     36  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2e2e2e', endColorstr='#ff544f52', GradientType=0);
     37  -webkit-box-shadow: 0px 3px 5px #aaaaaa;
     38  -moz-box-shadow: 0px 3px 5px #aaaaaa;
     39  box-shadow: 0px 3px 5px #aaaaaa;
     40  z-index: 99;
     41}
     42.menu_container.spip-theme > ul > li a {
     43  color: #eeeeee;
     44  font-family: "Georgia,Cambria,Times New Roman,Times,serif";
     45  font-size: 15px;
     46}
     47.menu_container.spip-theme > ul > li a:hover,
     48.menu_container.spip-theme > ul > li a:active,
     49.menu_container.spip-theme > ul > li a:focus {
     50  background: none;
     51}
     52.menu_container.spip-theme > ul > li .caret {
     53  border-bottom-color: #eeeeee;
     54  border-top-color: #eeeeee;
     55  border-left: 4px solid transparent;
     56  border-right: 4px solid transparent;
     57  border-top: 4px solid #eeeeee;
     58}
     59.menu_container.spip-theme > ul > li:hover {
     60  background-color: #544f52;
     61}
     62.menu_container.spip-theme > ul > li:hover .caret {
     63  border-bottom-color: #eeeeee;
     64  border-top-color: #eeeeee;
     65  border-top: 4px solid #eeeeee;
     66}
     67.menu_container.spip-theme ul.menu_submenu_block li:hover {
     68  background: none repeat scroll 0% 0% #2e2e2e;
     69}
     70.menu_container {
     71  margin-bottom: 0;
     72  height: 40px;
     73  clear: both;
     74  float: left;
     75  position: absolute;
     76  top: 0;
     77  left: 0;
     78}
     79.menu_container.full_width {
     80  width: 100%;
     81}
     82.menu_container > ul {
     83  list-style: none outside none;
     84  margin: 0px;
     85  padding: 0px;
     86  float: left;
     87  position: relative;
     88  width: 100%;
     89  height: inherit;
     90}
     91.menu_container > ul > li {
     92  float: left;
     93  padding: 0px;
     94  margin: 0px;
     95  text-align: left;
     96  transition: background-color 200ms linear 0s;
     97}
     98.menu_container > ul > li > a {
     99  padding: 0 7px 0 17px ;
     100  line-height: 40px;
     101  vertical-align: middle;
     102  color: #ffffff;
     103  text-decoration: none;
     104  text-shadow: none;
     105  font-size: 15px;
     106  font-family: "Georgia,Cambria,Times New Roman,Times,serif";
     107}
     108.menu_container > ul > li > a > img {
     109  margin-right: 10px;
     110  vertical-align: middle;
     111}
     112.menu_container > ul > li.right {
     113  float: right;
     114}
     115.menu_container > ul > li.last > a {
     116  box-shadow: none;
     117  border-right: 0px none;
     118}
     119.menu_container > ul > li:hover {
     120  cursor: pointer;
     121}
     122.menu_container > ul > li > .menu_dropdown_block {
     123  visibility: hidden;
     124  display: none;
     125  position: absolute;
     126  border-right: 1px solid #dddddd;
     127  border-width: 0px 1px 1px;
     128  border-style: none solid solid;
     129  border-color: -moz-use-text-color #dddddd #dddddd;
     130  -moz-border-top-colors: none;
     131  -moz-border-right-colors: none;
     132  -moz-border-bottom-colors: none;
     133  -moz-border-left-colors: none;
     134  border-image: none;
     135  -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
     136  -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
     137  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
     138  background: none repeat scroll 0% 0% #ffffff;
     139  top: 100%;
     140  color: #575757;
     141  opacity: 0;
     142  text-align: left;
     143  transition: opacity 100ms linear 0s;
     144  -moz-box-sizing: border-box;
     145  overflow: hidden;
     146  z-index: 30;
     147}
     148.menu_container > ul > li:hover > .menu_dropdown_block,
     149.menu_container > ul > li:focus > .menu_dropdown_block {
     150  visibility: visible;
     151  display: block;
     152  opacity: 1;
     153  margin-left: -1px;
     154}
     155.menu_container > ul > li > .menu_dropdown_block.full_width {
     156  left: 0px;
     157  margin-left: 0px;
     158}
     159.menu_container > ul > li > .menu_dropdown_block .ssmenu_container {
     160  padding: 15px 15px 5px 15px;
     161}
     162.menu_container > ul > li > .menu_dropdown_block .ssmenu_container ul.menu_submenu {
     163  list-style: none outside none;
     164  padding: 0px;
     165  margin: 0px 0px 10px;
     166}
     167.menu_container > ul > li > .menu_dropdown_block .ssmenu_container ul.menu_submenu li {
     168  display: block;
     169}
     170.menu_container > ul > li > .menu_dropdown_block .ssmenu_container ul.menu_submenu li > a {
     171  background: transparent;
     172  display: block;
     173  border: 0;
     174  padding: 4px 0px;
     175  text-decoration: none;
     176  color: #666666;
     177  font-family: "Georgia,Cambria,Times New Roman,Times,serif";
     178}
     179.menu_container > ul > li > .menu_dropdown_block .ssmenu_container ul.menu_submenu li > a:hover {
     180  color: #111111;
     181  background: none;
     182}
     183.menu_container > ul > li > .menu_dropdown_block .ssmenu_container ul.menu_submenu li > a > img {
     184  float: left;
     185  margin-right: 5px;
     186}
     187.mobile_collapser {
     188  display: none ;
     189}
     190.mobile_collapser > label {
     191  display: block;
     192  height: 22px;
     193  padding: 12px 25px;
     194  color: #eeeeee;
     195  text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
     196  font-size: 16px;
     197  line-height: 22px;
     198  font-family: "Georgia,Cambria,Times New Roman,Times,serif";
     199  text-align: left;
     200  box-shadow: 0px -1px 1px rgba(0, 0, 0, 0.2) inset;
     201}
     202.mobile_collapser .mobile_menu_icon {
     203  display: block;
     204  float: left;
     205  width: 22px;
     206  height: 22px;
     207  background: url('../images/mobile-menu-icon-black.png') no-repeat scroll 50% 50% transparent;
     208  margin-right: 10px;
     209}
     210#hidden_menu_collapser {
     211  display: none ;
     212}
     213#hidden_menu_collapser:checked + ul {
     214  height: auto;
     215  min-height: 40px;
     216  max-height: 2999px;
     217}
     218@media only screen and (max-width: 940px) and (min-width: 640px) {
     219  .menu_container > ul > li > a {
     220    padding: 12px 15px;
     221    font-size: 14px;
     222  }
     223  .menu_container > ul > li:hover > a {
     224    padding-left: 16px;
     225  }
     226}
     227@media only screen and (max-width: 940px) {
     228  .mobile_collapser {
     229    background: "none no-repeat #353535";
     230    display: block;
     231    height: 46px;
     232  }
     233  .menu_container {
     234    padding: 0px;
     235    height: auto;
     236  }
     237  .menu_container > ul {
     238    position: relative;
     239    transition: all 100ms linear 0s;
     240    height: 0px;
     241    background: inherit;
     242    overflow: hidden;
     243  }
     244  .menu_container > ul > li {
     245    position: relative;
     246    float: none;
     247    background: inherit;
     248  }
     249  .menu_container > ul > li:hover {
     250    margin-left: 0px;
     251  }
     252  .menu_container > ul > li > a {
     253    box-shadow: none;
     254    border-right: 0px none;
     255  }
     256  .menu_container > ul > li > .menu_dropdown_block {
     257    visibility: visible;
     258    position: relative;
     259    transition: all 100ms linear 0s;
     260    height: 0px;
     261    width: 100%;
     262  }
     263  .menu_container > ul > li:hover > .menu_dropdown_block {
     264    height: auto;
     265    min-height: 40px;
     266    max-height: 3000px;
     267  }
     268  .menu_container > ul > li .right {
     269    float: none;
     270  }
     271  .menu_container > ul > li > .menu_dropdown_block [class^="span"],
     272  .menu_container > ul > li > .menu_dropdown_block [class*=" span"] {
     273    float: none;
     274    width: auto ! important;
     275  }
     276}
     277/*
     278
     279Selecteur conditionels pour EI
     280http://romy.tetue.net/selecteurs-conditionnels-pour-ie
     281
     282*/
     283html.ie7 .menu_container > ul {
     284  zoom: 1;
     285  white-space: nowrap;
     286  z-index: 1;
     287}
     288html.ie7 .menu_container > ul > li > .menu_dropdown_block {
     289  top: 0;
     290  position: relative;
     291}
  • _plugins_/boussole/branches/v0/demo/boussole.html

    r75790 r75870  
    5050                boussole=spip,
    5151                titre_boussole=oui,
    52                 taille_logo_boussole=32,
     52                taille_logo_boussole=36,
    5353                taille_logo_site=16,
    5454                type_bulle=slogan_site,
  • _plugins_/boussole/branches/v0/inclure/boussole_topnav_spip.html

    r75790 r75870  
    22                boussole=spip,
    33                titre_boussole=oui,
    4                 taille_logo_boussole=32,
     4                taille_logo_boussole=36,
    55                taille_logo_site=16,
    66                type_bulle=slogan_site,
     7                div_id=boussole_spip,
    78                titre_menu_mobile=SPIP} />
  • _plugins_/boussole/branches/v0/modeles/boussole_topnav.html

    r75792 r75870  
    2323        - taille_logo_site: taille max du logo de chaque site (en pixels). 0 ou vide correspond à aucun logo
    2424        - titre_menu_mobile :    Titre du menu en mode mobile
     25        - div_id : id du div englobant. Vide correspond a aucun id
    2526           
    2627    css généré utilisable directement en production
     
    3637-->]
    3738<B_groupe>
    38 <div id="boussole" class="menu_container spip-theme full_width">
     39<div[ id="(#ENV{div_id})"] class="menu_container spip-theme full_width">
    3940        <div class="mobile_collapser">
    4041                <label for="hidden_menu_collapser">
     
    4748        [(#ENV{titre_boussole, non}|=={oui}|ou{#ENV{taille_logo_boussole}|>{0}}|oui)
    4849                <li>
    49                         <a[ href="(#BOUSSOLE_INFOS{#ENV{boussole}}|table_valeur{demo}|sinon{#})"]>
     50                        <a[ href="(#BOUSSOLE_INFOS{#ENV{boussole}}|table_valeur{demo}|sinon{#})"][ alt="(#ENV{boussole}|strtoupper)"]>
    5051                        [(#ENV{taille_logo_boussole}|>{0}|oui)
    5152                                [(#BOUSSOLE_INFOS{#ENV{boussole}}|table_valeur{logo}|image_reduire{#ENV{taille_logo_boussole}}|image_recadre{#ENV{taille_logo_boussole},#ENV{taille_logo_boussole},center,transparent})]
     
    6061                <li>
    6162                        <a href="#">[(#AKA_BOUSSOLE|boussole_traduire{nom_groupe, #AKA_GROUPE})]</a>
     63                        <b class="caret"></b>
    6264                        [(#REM) <!-- Liste des site du groupe en cours -->]
    6365                        <B_site>
  • _plugins_/boussole/branches/v0/plugin.xml

    r75792 r75870  
    88        <auteur>Eric Lupinacci</auteur>
    99        <licence>GPL</licence>
    10         <version>0.6.9</version>
     10        <version>0.6.10</version>
    1111        <version_base>0.1</version_base>
    1212        <icon>boussole_logo-64.png</icon>
Note: See TracChangeset for help on using the changeset viewer.