redesign of language selector (take 1)

diff --git a/static/Pics/gradient-flipped.png b/static/Pics/gradient-flipped.png
new file mode 100644 (file)
index 0000000..b4c10b2
Binary files /dev/null and b/static/Pics/gradient-flipped.png differ

diff --git a/static/debian.css b/static/debian.css
index fcef8bedbe14e01465eb6b4835d549735a2dc03f..f6233546a44743a6b5303fb26419ba0aa78ffb4d 100644 (file)
--- a/static/debian.css
+++ b/static/debian.css
@@ -830,3 +830,33 @@ div.tabular table > td:fist-child, table.tabular  > td:fist-child, table.vendors
        float: left;
        margin-right: 1em;
 }
+
+#langSelector {
+        color: #0035c7;
+        text-decoration: underline;
+}
+#langSelector:hover {
+        cursor: pointer;
+        text-decoration: none;
+}
+#langContainer {
+        #background-color: #f5f6f7;
+        background-color: white;
+        background-image:url('Pics/gradient-flipped.png');
+        background-position: bottom;
+        background-repeat: repeat-x;
+        display: none;
+        position: absolute;
+        left: -1em;
+        border-bottom: 1px solid #dfdfe0;
+        margin-right: -1em;
+        min-width: 100%;        /* make it reach the right edge if only a few
+                                   languages are available */
+        padding: 0.5em 1em 1em 1em;
+}
+#langContainer a {
+        margin-right: 1em;
+}
+#pageLang:hover #langContainer {
+    display: block;
+}

diff --git a/templates/html/foot.tmpl b/templates/html/foot.tmpl
index 5bae6982b675df55afb32d4f5e0e85f1f8e3a0f1..c333989ac32c190c70c82ac302377c992413d7c6 100644 (file)
--- a/templates/html/foot.tmpl
+++ b/templates/html/foot.tmpl
@@ -8,8 +8,10 @@ Total page evaluation took [% benchmark %]<br>
 [% IF langs && langs.size > 0 %]
 <hr class="hidecss">
 <!--UdmComment-->
+<div id="pageLang">
+<div id="langSelector">
 <p>[% g('This page is also available in the following languages (How to set <a href="%s">the default document language</a>):', cn_help_url) %]</p>
-<p class="navpara">
+<div id="langContainer">
 [% FOREACH l IN langs %]
 <a href="[% IF keyword_esc;
                make_search_url('',"keywords=$keyword_esc",'lang',l.lang);
@@ -18,7 +20,9 @@ Total page evaluation took [% benchmark %]<br>
            END %]" title="[% l.tooltip %]" hreflang="[% l.lang %]" lang="[% l.lang %]" rel="alternate">[% l.selfname %]
 [%- IF l.transliteration %] ([% l.transliteration %])[% END %]</a>
 [% END %]
-</p>
+</div>
+</div>
+</div>
 <!--/UdmComment-->
 [% END %]