Skip to content
Extraits de code Groupes Projets
Valider 08f0014d rédigé par renato's avatar renato
Parcourir les fichiers

the main toolbar is now an unordered list; 

each submenu is a child on its parent menu and it is an unordered list too;
it still need to be enhanced to work without js
parent fe65c0ac
Aucune branche associée trouvée
Aucune étiquette associée trouvée
Aucune requête de fusion associée trouvée
Masquer les modifications d'espaces
En ligne Côte à côte
.gitattributes
+ 1
− 0
Voir le fichier @ 08f0014d
...@@ -250,6 +250,7 @@ dist/puce_rtl.gif -text ...@@ -250,6 +250,7 @@ dist/puce_rtl.gif -text
dist/spip.png -text dist/spip.png -text
dist/style_prive.html -text dist/style_prive.html -text
dist/style_prive_defaut.css -text dist/style_prive_defaut.css -text
dist/style_prive_ie.html -text
dist/vignettes/abw.png -text dist/vignettes/abw.png -text
dist/vignettes/ai.png -text dist/vignettes/ai.png -text
dist/vignettes/aiff.png -text dist/vignettes/aiff.png -text
......
dist/javascript/presentation.js
+ 23
− 14
Voir le fichier @ 08f0014d
var bandeau_elements = false; var bandeau_elements = false;
function decaleSousMenu() {
var sousMenu = $("div.bandeau_sec",this).css({visibility:'hidden',display:'block'});
if(!sousMenu.length) return;
var left;
if($.browser.msie) {
var version = navigator.appVersion.match(/MSIE ([^;]+)/);
version = parseInt(version[1]);
left = parseInt(sousMenu[0].parentNode.offsetLeft);
if(version>6) {
left += parseInt($("#bandeau-principal div")[0].offsetLeft);
}
} else left = parseInt(sousMenu[0].offsetLeft);
if (left > 0) {
var demilargeur = Math.floor( sousMenu[0].offsetWidth / 2 );
var gauche = left
- demilargeur
+ Math.floor(largeur_icone / 2);
if (gauche < 0) gauche = 0;
sousMenu.css("left",gauche+"px");
}
sousMenu.css({display:'',visibility:''});
}
function changestyle(id_couche, element, style) { function changestyle(id_couche, element, style) {
// La premiere fois, regler l'emplacement des sous-menus // La premiere fois, regler l'emplacement des sous-menus
if (!bandeau_elements) { if (!bandeau_elements) {
bandeau_elements = $('#haut-page div.bandeau'); bandeau_elements = $('#haut-page div.bandeau');
if (bug_offsetwidth) {
$('#bandeau-principal div.bandeau').each(function(){
var left = parseInt(this.style.left);
if (left > 0) {
demilargeur = Math.floor( this.offsetWidth / 2 );
if (demilargeur == 0) demilargeur = 100; // bug offsetwidth MSIE, on fixe une valeur arbitraire
gauche = left
- demilargeur
+ Math.floor(largeur_icone / 2);
if (gauche < 0) gauche = 0;
this.style.left = gauche+"px";
}
});
}
} }
// Masquer les elements du bandeau // Masquer les elements du bandeau
......
dist/style_prive.html
+ 79
− 3
Voir le fichier @ 08f0014d
...@@ -83,11 +83,82 @@ select.fondl { ...@@ -83,11 +83,82 @@ select.fondl {
} }
.maj-debut:first-letter { text-transform: uppercase; } .maj-debut:first-letter { text-transform: uppercase; }
/*style for horizontal list <div class='h-list'><ul ><li><tag class='menu-item'></tag></li></ul></div>*/
/*for IE item list must be specified in .menu-item*/
/*possible added classes lefted centered righted vcentered*/
.h-list {display:table}
.h-list ul {
display:table-row;
list-style:none;
padding:0;
margin:0;
}
.h-list li {display:table-cell;padding:0;margin:0}
.h-list ul>li .menu-item {width:auto !important}
.vcentered li {vertical-align:middle}
.lefted {margin:0 auto 0 0;}
.centered {margin:0 auto;}
.righted {margin:0 0 0 auto;}
/*style for bandeau-principal*/
#bandeau-principal {padding-top:5px;border-bottom: 1px solid #000;position:relative;z-index:90;background:#fff}
#bandeau-principal .h-list .menu-item {margin:0 auto}
#bandeau-principal a .icon_fond {
background:##ENV{couleur_claire,edf3fe};
height:48px;
width:48px;
margin:auto;
}
#bandeau-principal a.selection .icon_fond {
width:48px;
margin:auto
}
#bandeau-principal a:hover span.icon_fond {
background:url(#EVAL{_DIR_IMG_PACK}fond-gris-anim.gif);
height:48px;
width:48px;
margin:auto;
}
#bandeau-principal li.boutons_admin:hover .bandeau_sec,
#bandeau-principal li.boutons_admin.sfhover .bandeau_sec
{
display:block;
}
#bandeau-principal span.icon_fond span {
behavior: url(../win_back_png.htc);
background:center top no-repeat;
height:48px;
display:block;
width:48px;
margin:0
}
/*style for submenus*/
.bandeau_sec {
margin-top: 0;
padding: 2px;
padding-top: 0;
background-color: #fff;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
z-index: 100;
display:none;
position:absolute;
}
/* /*
* Icones et bandeaux * Icones et bandeaux
*/ */
/* Da cancellare
#bandeau-principal { #bandeau-principal {
background-color: #fff; background-color: #fff;
margin: 0; margin: 0;
...@@ -95,6 +166,7 @@ select.fondl { ...@@ -95,6 +166,7 @@ select.fondl {
border-bottom: 1px solid #000; border-bottom: 1px solid #000;
} }
.bandeau-icones { .bandeau-icones {
background-color: #fff; background-color: #fff;
margin: 0; margin: 0;
...@@ -102,7 +174,8 @@ select.fondl { ...@@ -102,7 +174,8 @@ select.fondl {
padding-bottom: 2px; padding-bottom: 2px;
padding-top: 4px; padding-top: 4px;
} }
*/
/*
.bandeau_sec .gauche { .bandeau_sec .gauche {
margin-top: 0; margin-top: 0;
padding: 2px; padding: 2px;
...@@ -115,7 +188,8 @@ select.fondl { ...@@ -115,7 +188,8 @@ select.fondl {
-moz-border-radius-bottomright: 5px; -moz-border-radius-bottomright: 5px;
z-index: 100; z-index: 100;
} }
*/
/*
.bandeau-icones.separateur { .bandeau-icones.separateur {
vertical-align: middle; vertical-align: middle;
height: 100%; height: 100%;
...@@ -125,6 +199,8 @@ select.fondl { ...@@ -125,6 +199,8 @@ select.fondl {
background: url(#EVAL{_DIR_IMG_PACK}wrapper.php?file=tirets-separation.gif); background: url(#EVAL{_DIR_IMG_PACK}wrapper.php?file=tirets-separation.gif);
background-position: 5px 0px; background-position: 5px 0px;
} }
*/
.bandeau_couleur { .bandeau_couleur {
padding-right: 4px; padding-right: 4px;
padding-left: 4px; padding-left: 4px;
...@@ -1490,4 +1566,4 @@ div.rub-ouverte, a.rub-ouverte { ...@@ -1490,4 +1566,4 @@ div.rub-ouverte, a.rub-ouverte {
border: 0px; border: 0px;
height: 10px; height: 10px;
width: 10px; width: 10px;
} }
\ No newline at end of file
dist/style_prive_defaut.css
+ 7
− 3
Voir le fichier @ 08f0014d
...@@ -6,7 +6,7 @@ body { ...@@ -6,7 +6,7 @@ body {
/* /*
* Icones et bandeaux * Icones et bandeaux
*/ */
/* Da cenacellare
#bandeau-principal { #bandeau-principal {
background-color: white; background-color: white;
margin: 0; margin: 0;
...@@ -21,7 +21,8 @@ body { ...@@ -21,7 +21,8 @@ body {
padding-bottom: 2px; padding-bottom: 2px;
padding-top: 4px; padding-top: 4px;
} }
*/
/*
.bandeau_sec .gauche { .bandeau_sec .gauche {
margin-top: 0; margin-top: 0;
padding: 2px; padding: 2px;
...@@ -34,7 +35,8 @@ body { ...@@ -34,7 +35,8 @@ body {
-moz-border-radius-bottomright: 5px; -moz-border-radius-bottomright: 5px;
z-index: 100; z-index: 100;
} }
*/
/*
.bandeau-icones .separateur { .bandeau-icones .separateur {
vertical-align: middle; vertical-align: middle;
height: 100%; height: 100%;
...@@ -43,6 +45,8 @@ body { ...@@ -43,6 +45,8 @@ body {
margin: 0; margin: 0;
background-position: 5px 0px; background-position: 5px 0px;
} }
*/
.bandeau_couleur { .bandeau_couleur {
padding-right: 4px; padding-right: 4px;
padding-left: 4px; padding-left: 4px;
......
dist/style_prive_ie.html 0 → 100644
+ 40
− 0
Voir le fichier @ 08f0014d
[(#REM)
Ce squelette definit les styles de l'espace prive
Note: l'entete "Vary:" sert a repousser l'entete par
defaut "Vary: Cookie,Accept-Encoding", qui est (un peu)
genant en cas de "rotation du cookie de session" apres
un changement d'IP (effet de clignotement).
ATTENTION: il faut absolument le charset sinon Firefox croit que
c'est du text/html !
]
#CACHE{3600*100,cache-client}
#HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15}
#HTTP_HEADER{Vary: Accept-Encoding}
/*style for horizontal list <div class='h-list'><ul ><li><tag class='menu-item'></tag></li></ul></div>*/
/*for IE item list must be specified in .menu-item*/
/*possible added classes lefted centered righted vcentered*/
/*clear without markup*/
.h-list ul {height:1%}
/*end clear without markup*/
.h-list li {/*display:inline*/float:[(#ENV{ltr}|choixsiegal{left,left,right})]}
* html .h-list li {margin-right:-2px}
/*style for bandeau-principal*/
li * {word-wrap:break-word}
#bandeau-principal li.boutons_admin:hover .bandeau_sec,
#bandeau-principal li.boutons_admin.sfhover .bandeau_sec
{
display:block;
}
/*style for submenus*/
* html .bandeau_sec {float:none;width:100%}
* html .bandeau_sec ul {}
ecrire/inc/boutons.php
+ 56
− 40
Voir le fichier @ 08f0014d
...@@ -333,9 +333,16 @@ function definir_barre_gadgets() { ...@@ -333,9 +333,16 @@ function definir_barre_gadgets() {
function bandeau_principal($rubrique, $sous_rubrique, $largeur) function bandeau_principal($rubrique, $sous_rubrique, $largeur)
{ {
$res = ''; $res = '';
foreach($GLOBALS['boutons_admin'] as $page => $detail) { $decal = 0;
//cherche les espacement pour determiner leur largeur
$num_espacements = 0;
foreach($GLOBALS['boutons_admin'] as $page => $detail) {
if ($page=='espacement') $num_espacements++;
}
$larg_espacements = ($largeur-(count($GLOBALS['boutons_admin'])-$num_espacements)*_LARGEUR_ICONES_BANDEAU)/$num_espacements;
foreach($GLOBALS['boutons_admin'] as $page => $detail) {
if ($page=='espacement') { if ($page=='espacement') {
$res .= "<td> &nbsp; </td>"; $res .= "<li class='cellule48' style='width:".$larg_espacements."px'><span class='menu-item' style='width:"._LARGEUR_ICONES_BANDEAU."px'>&nbsp</span></li>";
} else { } else {
if ($detail->url) if ($detail->url)
$lien_noscript = $detail->url; $lien_noscript = $detail->url;
...@@ -348,22 +355,23 @@ function bandeau_principal($rubrique, $sous_rubrique, $largeur) ...@@ -348,22 +355,23 @@ function bandeau_principal($rubrique, $sous_rubrique, $largeur)
$lien = $lien_noscript; $lien = $lien_noscript;
$res .= icone_bandeau_principal( $res .= icone_bandeau_principal(
_T($detail->libelle), $detail,
$lien, $lien,
$detail->icone,
$page, $page,
$rubrique, $rubrique,
$lien_noscript, $lien_noscript,
$page, $page,
$sous_rubrique); $sous_rubrique,
$largeur,$decal);
} }
$decal += _LARGEUR_ICONES_BANDEAU;
} }
return "<div class='bandeau-icones'>\n<table width='$largeur' cellpadding='0' cellspacing='0' border='0'><tr>\n$res</tr></table></div>\n"; return $res;
} }
// http://doc.spip.org/@icone_bandeau_principal // http://doc.spip.org/@icone_bandeau_principal
function icone_bandeau_principal($texte, $lien, $fond, $rubrique_icone = "vide", $rubrique = "", $lien_noscript = "", $sous_rubrique_icone = "", $sous_rubrique = ""){ function icone_bandeau_principal($detail, $lien, $rubrique_icone = "vide", $rubrique = "", $lien_noscript = "", $sous_rubrique_icone = "", $sous_rubrique = "",$largeur,$decal){
global $spip_display, $menu_accesskey, $compteur_survol; global $spip_display, $menu_accesskey, $compteur_survol;
$alt = ''; $alt = '';
...@@ -371,8 +379,7 @@ function icone_bandeau_principal($texte, $lien, $fond, $rubrique_icone = "vide", ...@@ -371,8 +379,7 @@ function icone_bandeau_principal($texte, $lien, $fond, $rubrique_icone = "vide",
if ($spip_display == 1){ if ($spip_display == 1){
} }
else if ($spip_display == 3){ else if ($spip_display == 3){
$title = "title=\"$texte\""; $title = " title=\"$texte\"";
$alt = $texte;
} }
if (!$menu_accesskey = intval($menu_accesskey)) $menu_accesskey = 1; if (!$menu_accesskey = intval($menu_accesskey)) $menu_accesskey = 1;
...@@ -385,7 +392,7 @@ function icone_bandeau_principal($texte, $lien, $fond, $rubrique_icone = "vide", ...@@ -385,7 +392,7 @@ function icone_bandeau_principal($texte, $lien, $fond, $rubrique_icone = "vide",
$menu_accesskey++; $menu_accesskey++;
} }
$class_select = ($sous_rubrique_icone == $sous_rubrique) ? " class='selection'" : ''; $class_select = " class='menu-item boutons_admin".($sous_rubrique_icone == $sous_rubrique ? " selection" : "")."'";
if (strncasecmp("javascript:",$lien,11)==0) { if (strncasecmp("javascript:",$lien,11)==0) {
$a_href = "\nonclick=\"$lien; return false;\" href='$lien_noscript' "; $a_href = "\nonclick=\"$lien; return false;\" href='$lien_noscript' ";
...@@ -398,49 +405,52 @@ function icone_bandeau_principal($texte, $lien, $fond, $rubrique_icone = "vide", ...@@ -398,49 +405,52 @@ function icone_bandeau_principal($texte, $lien, $fond, $rubrique_icone = "vide",
if ($spip_display != 1 AND $spip_display != 4) { if ($spip_display != 1 AND $spip_display != 4) {
$class ='cellule48'; $class ='cellule48';
$texte = http_img_pack($fond, $alt, "$title width='48' height='48'") $texte = "<span class='icon_fond'><span".http_style_background($detail->icone)."></span></span>".($spip_display == 3 ? '' : "<span>"._T($detail->libelle)."</span>");
. ($spip_display == 3 ? '' : "<span>$texte</span>");
} else { } else {
$class = 'cellule-texte'; $class = 'cellule-texte';
} }
return "<td style='width: " return "<li style='width: "
. _LARGEUR_ICONES_BANDEAU . _LARGEUR_ICONES_BANDEAU
. "px' class='$class' onmouseover=\"changestyle('bandeau$rubrique_icone');\"><a$accesskey$a_href$class_select>" . "px' class='$class boutons_admin' onmouseover=\"changestyle('bandeau$rubrique_icone');\"><a$accesskey$a_href$class_select$title>"
. $texte . $texte
. "</a></td>\n"; . "</a>\n"
. bandeau_principal2($detail->sousmenu,$rubrique, $sous_rubrique, $largeur, $decal)
. "</li>\n";
} }
// http://doc.spip.org/@bandeau_principal2 // http://doc.spip.org/@bandeau_principal2
function bandeau_principal2($rubrique, $sous_rubrique, $largeur) { function bandeau_principal2($sousmenu,$rubrique, $sous_rubrique, $largeur, $decal) {
global $spip_lang_left; global $spip_lang_left;
$res = ''; $res = '';
$decal=0;
$coeff_decalage = 0; $coeff_decalage = 0;
if ($GLOBALS['browser_name']=="MSIE") $coeff_decalage = 1.0; if ($GLOBALS['browser_name']=="MSIE") $coeff_decalage = 1.0;
$largeur_maxi_menu = $largeur-100; $largeur_maxi_menu = $largeur-100;
$largitem_moy = 85; $largitem_moy = 85;
foreach($GLOBALS['boutons_admin'] as $page => $detail) { if (($rubrique == $page) AND (!_SPIP_AJAX)) {
if (($rubrique == $page) AND (!_SPIP_AJAX)) {
$class = "visible_au_chargement"; $class = "visible_au_chargement";
} else { } else {
$class = "invisible_au_chargement"; $class = "invisible_au_chargement";
} }
$sousmenu= $detail->sousmenu;
if($sousmenu) { if($sousmenu) {
$offset = (int)round($decal-$coeff_decalage*max(0,($decal+count($sousmenu)*$largitem_moy-$largeur_maxi_menu))); $offset = (int)round($decal-$coeff_decalage*max(0,($decal+count($sousmenu)*$largitem_moy-$largeur_maxi_menu)));
if ($offset<0){ $offset = 0; } if ($offset<0){ $offset = 0; }
$res .= "<div class='$class bandeau' id='bandeau$page' style='position: absolute; $spip_lang_left: ".$offset."px;'><div class='bandeau_sec'><table class='gauche'><tr>\n";
$width=0; $width=0;
$max_width=0;
foreach($sousmenu as $souspage => $sousdetail) { foreach($sousmenu as $souspage => $sousdetail) {
if ($width+1.25*$largitem_moy>$largeur_maxi_menu){$res .= "</tr><tr>\n";$width=0;} if ($width+1.25*$largitem_moy>$largeur_maxi_menu){
$res .= "</ul><ul><li>\n";
if($width>$max_width) $max_width=$width;
$width=0;
}
if($souspage=='espacement') { if($souspage=='espacement') {
if ($width>0){ if ($width>0){
$res .= "<td class='separateur'></td>\n"; $res .= "<li class='separateur'></li>\n";
$largitem = 0; $largitem = 0;
} }
} else { } else {
...@@ -448,12 +458,12 @@ function bandeau_principal2($rubrique, $sous_rubrique, $largeur) { ...@@ -448,12 +458,12 @@ function bandeau_principal2($rubrique, $sous_rubrique, $largeur) {
$res .= $html; $res .= $html;
} }
$width+=$largitem+10; $width+=$largitem+10;
if($width>$max_width) $max_width+=$largitem;
} }
$res .= "</tr></table></div></div>"; $res .= "</ul></div>\n";
$res = "<div class='bandeau_sec h-list' style='width:{$max_width}px;$spip_lang_left:{$offse}px;'><ul>".$res;
} }
$decal += _LARGEUR_ICONES_BANDEAU;
}
return $res; return $res;
} }
...@@ -464,15 +474,21 @@ function bandeau_double_rangee($rubrique, $sous_rubrique, $largeur) ...@@ -464,15 +474,21 @@ function bandeau_double_rangee($rubrique, $sous_rubrique, $largeur)
definir_barre_boutons(); definir_barre_boutons();
return "<div class='invisible_au_chargement' style='position: absolute; height: 0px; visibility: hidden;'><a href='oo'>"._T("access_mode_texte")."</a></div>" return "<div class='invisible_au_chargement' style='position: absolute; height: 0px; visibility: hidden;'><a href='oo'>"._T("access_mode_texte")."</a></div>"
. "<div id='haut-page'>" . "<div id='haut-page'>\n"
. "<div id='bandeau-principal' align='center'>\n" . "<div id='bandeau-principal'>\n"
. "<div class='h-list centered' style='width:{$largeur}px'><ul>\n"
. bandeau_principal($rubrique, $sous_rubrique, $largeur) . bandeau_principal($rubrique, $sous_rubrique, $largeur)
. "<table width='$largeur' cellpadding='0' cellspacing='0'><tr><td>" . "</ul></div>\n"
. "<div style='text-align: $spip_lang_left; width: ".$largeur."px; position: relative; z-index: 2000;'>" . "</div>"
. bandeau_principal2($rubrique, $sous_rubrique, $largeur) //script to show the submenus in IE6, not supporting :hover on li elements
. "</div>" . "<script type='text/javascript'>\n"
. "</td></tr></table>" . "var boutons_admin = jQuery('#bandeau-principal li.boutons_admin');\n"
. "</div>\n"; . "if(jQuery.browser.msie) boutons_admin.hover(\n"
. "function(){jQuery(this).addClass('sfhover')},\n"
. "function(){jQuery(this).removeClass('sfhover')}\n"
. ");\n"
. "boutons_admin.one('mouseover',decaleSousMenu);\n"
. "</script>\n";
} }
...@@ -517,22 +533,22 @@ function icone_bandeau_secondaire($texte, $lien, $fond, $rubrique_icone = "vide" ...@@ -517,22 +533,22 @@ function icone_bandeau_secondaire($texte, $lien, $fond, $rubrique_icone = "vide"
} }
if ($spip_display == 3) $accesskey_icone = $accesskey; if ($spip_display == 3) $accesskey_icone = $accesskey;
$class_select = ($rubrique_icone != $rubrique) ? '' : " class='selection'"; $class_select = "class='menu-item".($rubrique_icone != $rubrique ? "" : " selection")."'";
$compteur_survol ++; $compteur_survol ++;
$a_href = "<a$accesskey href=\"$lien\"$class_select>"; $a_href = "<a$accesskey href=\"$lien\"$class_select>";
if ($spip_display != 1) { if ($spip_display != 1) {
$res = "<td class='cellule36' style='width: ".$largeur."px;'>"; $res = "<li class='cellule36' style='width: ".$largeur."px;'>";
$res .= $a_href . $res .= $a_href .
http_img_pack("$fond", $alt, "$title"); http_img_pack("$fond", $alt, "$title");
if ($aide AND $spip_display != 3) $res .= aide($aide)." "; if ($aide AND $spip_display != 3) $res .= aide($aide)." ";
if ($spip_display != 3) { if ($spip_display != 3) {
$res .= "<span>$texte</span>"; $res .= "<span>$texte</span>";
} }
$res .= "</a></td>\n"; $res .= "</a></li>\n";
} }
else $res = "<td style='width: $largeur" . "px' class='cellule-texte'>$a_href". $texte . "</a></td>\n"; else $res = "<li style='width: $largeur" . "px' class='cellule-texte'>$a_href". $texte . "</a></li>\n";
return array($res, $largeur); return array($res, $largeur);
} }
......
ecrire/inc/presentation.php
+ 5
− 1
Voir le fichier @ 08f0014d
...@@ -1284,7 +1284,11 @@ function envoi_link($nom_site_spip) { ...@@ -1284,7 +1284,11 @@ function envoi_link($nom_site_spip) {
// CSS espace prive : la vraie // CSS espace prive : la vraie
. '<link rel="stylesheet" type="text/css" href="' . '<link rel="stylesheet" type="text/css" href="'
. generer_url_public('style_prive', $args) .'" />' . "\n" . generer_url_public('style_prive', $args) .'" />' . "\n"
. "<!-- [if IE lt 8] -->\n"
. '<link rel="stylesheet" type="text/css" href="'
. generer_url_public('style_prive_ie', $args) .'" />' . "\n"
. "<!-- [endif] -->"
// CSS calendrier // CSS calendrier
. '<link rel="stylesheet" type="text/css" href="' . '<link rel="stylesheet" type="text/css" href="'
. find_in_path('agenda.css') .'" />' . "\n" . find_in_path('agenda.css') .'" />' . "\n"
......
0% ou .
You are about to add 0 people to the discussion. Proceed with caution.
Terminez d'abord l'édition de ce message.
Veuillez vous inscrire ou vous pour commenter

Forge communautaire SPIP | Charte d'utilisation | Signaler un problème sur ce site