From 1217dbe26476be3bee0af2d7bc337369f649a332 Mon Sep 17 00:00:00 2001
From: str4d <str4d@mail.i2p>
Date: Sun, 23 Dec 2012 00:05:58 +0000
Subject: [PATCH] Merged template layout of topbar for duck's and danimoth's
 themes

---
 i2p2www/pages/global/layout.html              |  24 +++------
 i2p2www/static/styles/danimoth.css            |  48 +++++++++++++-----
 .../{ => styles/danimoth}/images/i2plogo.png  | Bin
 i2p2www/static/styles/duck.css                |   9 ++--
 .../duck/images/i2plogo.png}                  | Bin
 5 files changed, 49 insertions(+), 32 deletions(-)
 rename i2p2www/static/{ => styles/danimoth}/images/i2plogo.png (100%)
 rename i2p2www/static/{images/logo_medium.png => styles/duck/images/i2plogo.png} (100%)

diff --git a/i2p2www/pages/global/layout.html b/i2p2www/pages/global/layout.html
index 3ae29735f..60a23a82c 100644
--- a/i2p2www/pages/global/layout.html
+++ b/i2p2www/pages/global/layout.html
@@ -13,12 +13,15 @@
     {%- block headextra %}{% endblock %}
   </head>
   <body>
-{%- if g.theme != "danimoth" %}
     <div class="hide"><a href="#content" title="Skip navigation" accesskey="2">{{ _('Skip navigation') }}</a></div>
-    <div id="branding">
-      <h1 id="logo"><a href="{{ site_url() }}"><img src="{{ url_for('static', filename='images/logo_medium.png') }}" alt="I2P" /></a></h1>
-      <div class="title">{{ self.title() }}</div>
+    <div id="topbar">
+      <a id="logo" href="{{ site_url() }}"><img src="{{ url_for('static', filename='styles/' + g.theme + '/images/i2plogo.png') }}" alt="I2P Logo" title="Invisible Internet Project (I2P)" /></a>
+      <div class="title">
+        <h1>{{ self.title() }}</h1>
+        {% include "global/lang.html" %}
+      </div>
     </div>
+{%- if g.theme != "danimoth" %}
     <div class="navigation">
       {% include "global/nav.html" %}
     </div>
@@ -40,19 +43,6 @@
       {% include "global/footer.html" %}
     </div>
 {%- else %}
-    <div class="topbar">
-      <div class="topbar-inner">
-        <div class="container-fluid">
-          <a class="brand" href="{{ site_url() }}"><img src="{{ url_for('static', filename='images/i2plogo.png') }}" alt="I2P Logo" title="Invisible Internet Project (I2P)" /></a>
-          <div class="pull-right">
-            <h6>{{ self.title() }}</h6>
-            {% include "global/lang.html" %}
-         </div>
-
-        </div>
-      </div>
-    </div>
-
     <div class="container-fluid">
       <div class="sidebar">
         {%- if not self.content() %}
diff --git a/i2p2www/static/styles/danimoth.css b/i2p2www/static/styles/danimoth.css
index 92ad2b5e2..36707bc19 100644
--- a/i2p2www/static/styles/danimoth.css
+++ b/i2p2www/static/styles/danimoth.css
@@ -5,7 +5,7 @@ padding:0;
 
 body {
     margin: 0;
-    padding-top: 70px;
+    /*padding-top: 70px;*/
 }
 
 .news {
@@ -177,6 +177,7 @@ position:relative;
 min-width:940px;
 padding-left:20px;
 padding-right:20px;
+padding-top: 13px;
 zoom:1;
 }
 .container-fluid:before,.container-fluid:after {
@@ -210,8 +211,9 @@ color:#00438a;
 text-decoration:underline;
 }
 
-.pull-right {
-float:right;
+div#topbar .title {
+float: right;
+padding: 0 20px;
 }
 
 .pull-left {
@@ -1300,14 +1302,29 @@ table .headerSortUp.purple,table .headerSortDown.purple {
 background-color:#e2d5f0;
 }
 
-.topbar {
-height:40px;
+#topbar {
+/*height:40px;
 position:fixed;
 top:0;
 left:0;
-right:0;
+right:0;*/
 z-index:10000;
-overflow:visible;
+/*overflow:visible;*/
+overflow: hidden;
+min-width: 980px;
+background-color:#222222;
+background-repeat:repeat-x;
+background-image:-khtml-gradient(linear, left top, left bottom, from(#333333), to(#222222));
+background-image:-moz-linear-gradient(top, #333333, #222222);
+background-image:-ms-linear-gradient(top, #333333, #222222);
+background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #222222));
+background-image:-webkit-linear-gradient(top, #333333, #222222);
+background-image:-o-linear-gradient(top, #333333, #222222);
+background-image:linear-gradient(top, #333333, #222222);
+filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);
+-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);
+-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);
+box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);
 }
 .topbar a {
 color:#bfbfbf;
@@ -1325,17 +1342,24 @@ text-decoration:none;
 position:relative;
 }
 
-.topbar h3 a,.topbar .brand {
+#topbar a#logo {
 float:left;
 display:block;
 padding:8px 20px 12px;
-margin-left:-20px;
+/*margin-left:-20px;*/
 color:#ffffff;
 font-size:20px;
 font-weight:200;
 line-height:1;
 }
 
+#topbar .title h1 {
+    color: #bfbfbf;
+    font-size: 13px;
+    margin: 0;
+    text-transform: uppercase;
+}
+
 .topbar p {
 margin:0;
 line-height:40px;
@@ -1425,19 +1449,19 @@ filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endCo
 box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);
 }
 
-.topbar div>ul,.nav {
+#topbar div>ul,.nav {
 display:block;
 float:left;
 margin:0 10px 0 0;
 position:relative;
 left:0;
 }
-.topbar div>ul>li,.nav>li {
+#topbar div>ul>li,.nav>li {
 display:block;
 float:left;
 }
 
-.topbar div>ul a,.nav a {
+#topbar div>ul a,.nav a {
 display:block;
 float:none;
 /*padding:10px 10px 11px;*/
diff --git a/i2p2www/static/images/i2plogo.png b/i2p2www/static/styles/danimoth/images/i2plogo.png
similarity index 100%
rename from i2p2www/static/images/i2plogo.png
rename to i2p2www/static/styles/danimoth/images/i2plogo.png
diff --git a/i2p2www/static/styles/duck.css b/i2p2www/static/styles/duck.css
index c80d0dc0b..6d34dbd7e 100644
--- a/i2p2www/static/styles/duck.css
+++ b/i2p2www/static/styles/duck.css
@@ -12,18 +12,21 @@ a {color:#d00e0e; text-decoration:none;}
 
 div.hide {display:none;}
 
-div#branding {width:80%; /*margin:1em auto;*/ margin: 1em auto 0; position:relative;}
-    div#branding #logo img:hover {
+div#topbar {width:80%; /*margin:1em auto;*/ margin: 1em auto 0; position:relative;}
+    div#topbar #logo img:hover {
         filter:alpha(opacity=60);
         -moz-opacity: 0.6;
         opacity: 0.6;
     }
-    div#branding .title {
+    div#topbar .title {
         font-family:"URW Gothic L", "Century Gothic", sans-serif; text-transform:uppercase; font-size:3.5em; 
         font-weight:bold; text-shadow:1px 1px 1px rgba(0,0,0,.2); color:#333333;
         position:absolute; top:0; right:0; line-height:41px; vertical-align:middle;
         max-width: 70%; text-align: right;
     }
+    div#topbar .languages {
+        display: none;
+    }
 
 div.navigation {position:relative;}
     ul.languages {margin: 0 2px !important;}
diff --git a/i2p2www/static/images/logo_medium.png b/i2p2www/static/styles/duck/images/i2plogo.png
similarity index 100%
rename from i2p2www/static/images/logo_medium.png
rename to i2p2www/static/styles/duck/images/i2plogo.png
-- 
GitLab