Language Switch:

* display language name next to flag (and enlarge the flag box to ~400px)

* force the links color inside the language box because the background color is
forced : on a theme like "grum dark II", the result is really awful, impossible
to read.

* the current language is not removed from the list, this ways the list is not
reorganized depending on the current language



git-svn-id: http://piwigo.org/svn/trunk@9906 68402e56-0260-453c-a942-63ccdbb3a9ee
This commit is contained in:
plegall 2011-03-28 13:51:43 +00:00
commit e405136d47
4 changed files with 25 additions and 14 deletions

View file

@ -4,7 +4,7 @@
<div>
<ul>
<li>
<a rel="nofollow" href="#">
<a rel="nofollow" href="#" class="activeFlag">
<img class="flags" src="{$lang_switch.Active.img}" alt="{$lang_switch.Active.alt}" title="{$lang_switch.Active.alt}"/>
</a>
<!--[if lte IE 6]>
@ -15,11 +15,12 @@
<td>
<![endif]-->
<ul class="flag-pan">
<li class="languageSwitchBoxTitle">{'Language'|@translate}</li>
{foreach from=$lang_switch.flags key=code item=flag name=f}
<li>
<a rel="nofollow" href="{$SCRIPT_NAME}{$flag.url}">
<img class="flags" src="{$flag.img}" alt="{$flag.alt}" title="{$flag.alt}"/>
<img class="flags" src="{$flag.img}" alt="{$flag.alt}" title="{$flag.alt}"/> {$flag.title}
</a>
</li>
{/foreach}

View file

@ -1,4 +1,5 @@
.flag-pan { border:1px solid; background-color: #111; }
.content ul.categoryActions .flag-pan a:hover {color:#ddd}
.menuf .flags {border-color: #000 !important; }
.flag-pan { border-radius: 8px; } /* round corners with CSS3 compliant browsers */

View file

@ -1,15 +1,19 @@
.flag-pan { width:132px; z-index:100; border-width:1px; border-style: solid; background-color: #999; padding: 2px 5px 10px 5px; }
.content ul.categoryActions .flag-pan a img.flags { margin: 5px 2px 10px; }
.content ul.categoryActions .flag-pan a { margin: 0; border:none; }
.flag-pan { width:380px; z-index:100; border:2px solid #CDCDCD; background-color: #f0f0f0; padding: 2px 5px 10px 5px; }
.languageSwitchBoxTitle {display:block;width:370px;text-align:center;margin:5px auto;font-weight:bold;color:#464646;}
.content ul.categoryActions .flag-pan a img.flags { margin-bottom: -2px; }
.content ul.categoryActions .flag-pan a { margin: 0; border:none; color:#464646;}
.content ul.categoryActions .flag-pan a:hover {color:black}
.menuf { width:30px; height:24px; display: inline; }
.menuf ul li a, .menuf ul li a:visited {display:block; text-decoration:none; width:44px; height:27px; text-align:center; line-height:27px; overflow:hidden; border:none}
.menuf ul li a, .menuf ul li a:visited {display:block; text-decoration:none; width:120px; height:27px; text-align:left; line-height:27px; overflow:hidden; border:none}
.menuf ul {padding:0; margin:0; list-style: none;}
.menuf ul li {float:left; position:relative; right: 0; top: 0;}
.menuf ul li {float:left; position:relative; right:0; top:0; margin-left:5px}
.menuf ul li ul {display: none;}/* specific to non IE browsers */
.menuf li a:hover { border:0 !important;}
.menuf .flags {border-width:1px !important; ; border-style: solid !important; margin-top:5px; }
.menuf ul li:hover ul {display:block; position:absolute; top:0px; left:-96px; }
.menuf li a:hover { border:1px dotted #464646}
.menuf .flags {border:1px solid #ddd !important; margin-top:5px; }
.menuf ul li:hover ul {display:block; position:absolute; top:0px; right:0px; }
.menuf ul li:hover ul li ul {display: none;}
.menuf ul li:hover ul li {display: block;}
.menuf ul li:hover ul li a {display:block;}
.menuf ul li:hover ul li:hover ul {display:block; position:absolute; left:0px; top:0;}
.menuf ul li:hover ul li:hover ul {display:block; position:absolute; left:0px; top:0;}
.menuf ul li a.activeFlag, .menuf ul li a.activeFlag:visited {width:30px;}

View file

@ -70,11 +70,16 @@ class language_controler {
'url' => str_replace(array('=&amp;','?&amp;'),array('&amp;','?'),
add_url_params( $url_starting, array('lang'=> $code) )),
'alt' => ucwords( $displayname ),
'title' => substr($displayname, 0, -4), // remove [FR] or [RU]
'img' => get_root_url().'language/' . $code . '/' . $code . '.jpg',
);
if ( $code !== $user['language'] )
$lsw['flags'][$code] = $qlc ;
else $lsw['Active'] = $qlc;
$lsw['flags'][$code] = $qlc ;
if ($code == $user['language'])
{
$lsw['Active'] = $qlc;
}
}
$template->set_filename('language_flags', dirname(__FILE__) . '/flags.tpl');
$lsw['side'] = ceil(sqrt(count($available_lang)));