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

4 files changed, 25 insertions, 14 deletions

diff --git a/plugins/language_switch/flags.tpl b/plugins/language_switch/flags.tpl
index eb855fc69..9bf88dba6 100644
--- a/plugins/language_switch/flags.tpl
+++ b/plugins/language_switch/flags.tpl
@@ -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}
diff --git a/plugins/language_switch/language_switch-Sylvia.css b/plugins/language_switch/language_switch-Sylvia.css
index f3bf91d9f..b0ddc7be0 100644
--- a/plugins/language_switch/language_switch-Sylvia.css
+++ b/plugins/language_switch/language_switch-Sylvia.css
@@ -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 */
diff --git a/plugins/language_switch/language_switch-default.css b/plugins/language_switch/language_switch-default.css
index 909f3eb5f..6f5b60ec0 100644
--- a/plugins/language_switch/language_switch-default.css
+++ b/plugins/language_switch/language_switch-default.css
@@ -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;}
\ No newline at end of file
+.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;}
\ No newline at end of file
diff --git a/plugins/language_switch/language_switch.inc.php b/plugins/language_switch/language_switch.inc.php
index 721a5af11..c24fcd1a8 100644
--- a/plugins/language_switch/language_switch.inc.php
+++ b/plugins/language_switch/language_switch.inc.php
@@ -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)));