Begin template adaption for Ubuntu page

This is still work in progress. Some of the HTML isn't
quite right yet, especially due to the changes in
CSS and HTML for the Debian page.

diff --git a/conf/apache.conf.sed.in b/conf/apache.conf.sed.in
index ec90f962f8660f74d50b5f7c90300d136dc154b8..d3b511ab04dc37c870d7b1fc6868ca271c0923af 100644 (file)
--- a/conf/apache.conf.sed.in
+++ b/conf/apache.conf.sed.in
@@ -77,7 +77,7 @@
 </Directory>
 
 <VirtualHost *>
-   ServerAdmin webmaster@debian.org
+   ServerAdmin frank@lichtenheld.de
    DocumentRoot %TOPDIR%/www/
    ServerName %SITE%
    ErrorLog /var/log/apache2/%SITE%-error.log
@@ -116,6 +116,7 @@
    RewriteRule ^/changelogs/ - [L]
    RewriteRule ^/Pics/ - [L]
    RewriteRule ^/about/ - [L]
+   RewriteRule ^/ubuntu/ - [L]
    RewriteRule ^/[^/]+\.css - [L]
    RewriteRule ^/[^/]+\.js - [L]
 

diff --git a/static/ubuntu/footer-bg.jpg b/static/ubuntu/footer-bg.jpg
new file mode 100644 (file)
index 0000000..2126160
Binary files /dev/null and b/static/ubuntu/footer-bg.jpg differ

diff --git a/static/ubuntu/footer-bg.png b/static/ubuntu/footer-bg.png
new file mode 100644 (file)
index 0000000..f314901
Binary files /dev/null and b/static/ubuntu/footer-bg.png differ

diff --git a/static/ubuntu/footer-image.png b/static/ubuntu/footer-image.png
new file mode 100644 (file)
index 0000000..81b170e
Binary files /dev/null and b/static/ubuntu/footer-image.png differ

diff --git a/static/ubuntu/footer-image2.png b/static/ubuntu/footer-image2.png
new file mode 100644 (file)
index 0000000..f045980
Binary files /dev/null and b/static/ubuntu/footer-image2.png differ

diff --git a/static/ubuntu/header-bg4.png b/static/ubuntu/header-bg4.png
new file mode 100644 (file)
index 0000000..4344bdb
Binary files /dev/null and b/static/ubuntu/header-bg4.png differ

diff --git a/static/ubuntu/header-image4.png b/static/ubuntu/header-image4.png
new file mode 100644 (file)
index 0000000..1c577fe
Binary files /dev/null and b/static/ubuntu/header-image4.png differ

diff --git a/static/ubuntu/little-u.gif b/static/ubuntu/little-u.gif
new file mode 100644 (file)
index 0000000..ef56baf
Binary files /dev/null and b/static/ubuntu/little-u.gif differ

diff --git a/static/ubuntu/masthead.css b/static/ubuntu/masthead.css
new file mode 100644 (file)
index 0000000..b574af2
--- /dev/null
+++ b/static/ubuntu/masthead.css
@@ -0,0 +1,115 @@
+#mastWrapper {
+background: url(header-bg4.png) bottom left repeat-x #fff;
+}
+
+#masthead
+{
+position:relative;
+background: url(header-image4.png) no-repeat transparent;
+border-style: solid;
+border-width: 0;
+color: #000;
+height: 90px;
+}
+
+#masthead h1
+{
+       text-indent: -10000px;
+       margin:0;
+}
+
+#search 
+{
+position:absolute;
+top:10px;
+right:20px;              
+}
+#masthead #search a {
+       color: #5B4832;
+       text-decoration: underline;
+}
+#nav 
+{
+position:absolute;
+bottom:0px;
+right:10px;
+}
+                 
+#nav ul 
+{
+margin:0;
+padding:10px 10px 0 20px;
+list-style:none;
+}
+                 
+#nav li 
+{
+float:left;
+background:url("tab_off_ns1.gif") no-repeat left top;
+margin:0;
+padding:0 0 0 5px;
+}
+
+#nav a 
+{
+float:left;
+font-size:105%;
+display:block;
+background:url("tab_off_ns2.gif") no-repeat right top;
+padding:10px 15px 3px 8px;
+text-decoration:none;
+font-weight:bold;
+color:#444;
+}
+
+/* Commented Backslash Hack hides rule from IE5-Mac \*/
+#nav a {float:none;}
+/* End IE5-Mac hack */
+#nav a:hover {
+color:#333;
+}
+
+#nav li:hover, #nav li:hover a 
+{
+background-position:0% -163px;
+color:#000;
+}
+
+#nav li:hover a 
+{
+background-position:100% -163px;
+color:#000;
+}
+
+#nav #current 
+{
+background:url("tab_on_ns1.gif") no-repeat left top;             
+}
+
+#nav #current a 
+{
+background:url("tab_on_ns2.gif") no-repeat right top;            
+padding-bottom:4px;
+color:#000;
+}
+
+.portalMessagehead,
+.system-messagehead,  /* These two last ones are reST error indicators */
+#error-handling {
+    background-color: #ffce7b;
+    border: 1px solid #ffa500;
+    color: #6d4c07;
+    font-size: 10px;
+    font-weight: bold;
+    margin: 1em 0em 0em 0em;
+    padding: 0.5em 1em 0.5em 3em;
+    vertical-align: middle;
+    background-image: url(http://www.ubuntulinux.org/testing_area/info_icon.gif);
+    background-repeat: no-repeat;
+    background-position: 5px center ;
+
+}
+.portalMessagehead a {
+    color: #6d4c07;
+    text-decoration: underline;
+}

diff --git a/static/ubuntu/no-bullet.gif b/static/ubuntu/no-bullet.gif
new file mode 100644 (file)
index 0000000..1ea396b
Binary files /dev/null and b/static/ubuntu/no-bullet.gif differ

diff --git a/static/ubuntu/splash.jpg b/static/ubuntu/splash.jpg
new file mode 100644 (file)
index 0000000..0a3df97
Binary files /dev/null and b/static/ubuntu/splash.jpg differ

diff --git a/static/ubuntu/tab_off_ns1.gif b/static/ubuntu/tab_off_ns1.gif
new file mode 100644 (file)
index 0000000..9510406
Binary files /dev/null and b/static/ubuntu/tab_off_ns1.gif differ

diff --git a/static/ubuntu/tab_off_ns2.gif b/static/ubuntu/tab_off_ns2.gif
new file mode 100644 (file)
index 0000000..14135c9
Binary files /dev/null and b/static/ubuntu/tab_off_ns2.gif differ

diff --git a/static/ubuntu/tab_on_ns1.gif b/static/ubuntu/tab_on_ns1.gif
new file mode 100644 (file)
index 0000000..fce415a
Binary files /dev/null and b/static/ubuntu/tab_on_ns1.gif differ

diff --git a/static/ubuntu/tab_on_ns2.gif b/static/ubuntu/tab_on_ns2.gif
new file mode 100644 (file)
index 0000000..28bf458
Binary files /dev/null and b/static/ubuntu/tab_on_ns2.gif differ

diff --git a/static/ubuntu/trans.gif b/static/ubuntu/trans.gif
new file mode 100644 (file)
index 0000000..2799b45
Binary files /dev/null and b/static/ubuntu/trans.gif differ

diff --git a/static/ubuntu/ubuntu.css b/static/ubuntu/ubuntu.css
new file mode 100644 (file)
index 0000000..f80d9fd
--- /dev/null
+++ b/static/ubuntu/ubuntu.css
@@ -0,0 +1,304 @@
+
+.hiddenStructure {
+       display: none;
+}
+
+.imageLink {
+       text-decoration: none;
+}
+
+hr {
+    height: 1px;
+    color: #6d4c07;
+    background-color: transparent;
+}
+
+body
+{
+       background-color: #fff;
+       color: #000;
+       font-size: 100.1%;
+       margin: 0;
+       padding: 0;
+}
+#pageWrapper
+{
+       border-style: solid;
+       border-width: 0;                /* layout's side borders */
+       font-family: arial, helvetica, sans-serif;
+       font-size: 80%;                 /* arial looks better with a smaller size */
+       margin: 0;
+       min-width: 500px;               /* IE doens't understand this property */
+       width: auto;
+}
+* html #pageWrapper
+{
+       word-wrap: break-word;          /* invalid CSS but keeps IE from breaking 
+                                       horribly under narrow viewports */
+}
+
+#outerColumnContainer
+{
+       background-color: #fff;
+       border-style: solid;
+       border-width: 0 18em 0 0;       /* side border widths must equal the
+                                       widths of the left and right columns. 
+                                       */
+       border-right-color: #fff;       /* right hand column background color */
+       color: #000;
+       z-index: 1;
+}
+* html #outercolumncontainer
+{
+       /* IE5.0/Win fix for 1px whitespace between masthead and body. 
+        * The case-incorrect selector is on purpose. IE5.0 and IE5.5 are
+        * case insensitive and I'm targeting IE 5.0. 5.5 doesn't get hurt
+        * by this extra margin work.
+        */
+       margin-top: -1px;
+       border-top: solid 1px #fff;
+}
+#innerColumnContainer
+{
+       width: 100%;
+       z-index: 2;
+}
+html[xmlns] .mozclear
+{
+       /* this selector should be valid CSS, but Opera 7.5 (and above) will pick
+        * this up as well. Shouldn't be a problem, Opera should handle this fine,
+        * but it's a Mozilla-targeted hack, and it should probably only affect
+        * mozilla. You can do that by replacing the INVALID CSS selector
+        * :root .mozclear for what's give here.
+        */
+       border-bottom: 1px solid;
+       border-color: transparent;
+       margin-bottom: -1px;
+}
+#rightColumn, #contentColumn
+{
+       float: left;
+       overflow: visible;              /* fix for IE italics bug */
+       position: relative;
+       z-index: 10;
+}
+#rightColumn
+{
+       float: right;                   /* doesn't have to be floated right, but if using some
+                                       original skidoo tweaks, you need it this way */
+       margin: 0 -18em 0 1px;
+       width: 18em;
+}
+#rightColumn .inside
+{
+       font-size: 100%;                /* because the parent element ( #rightColumn )
+                                       defines its width in EMs, we can't change the font 
+                                       size in that selector, otherwise the column won't use
+                                       the entire width reserved for the column */
+}
+#contentColumn
+{
+       margin: 0 -1px 0 0;             /* required to get the negative margin-based
+                                       layout to work. if #contentColumn does not
+                                       overlap the left and right columns, then
+                                       the whole layout will break */
+       width: 100%;
+       font-family: Verdana, arial, helvetica, sans-serif; 
+}
+
+#footWrapper {
+       background: url(footer-bg.png);
+       background-repeat: repeat-x;
+       border-bottom: 2px solid #583D1E;
+}
+
+#footer
+{
+       color: #5B4832;
+       background-image: url(footer-image2.png);
+       background-repeat: repeat-y;
+       background-position: left top;
+       position: relative;
+       text-align: center;
+       padding: 10px;
+}
+
+#prefooter
+{
+       color: #5B4832;
+       text-align: center;
+}
+
+#prefooter .bordertop
+{
+       border-top: 1px dotted #C1B496;
+}
+
+#extranav
+{
+       margin: 0;
+       border-bottom: 1px dotted #C1B496;
+}
+
+#extranav a, #extranav a:visited, #prefooter a, #prefooter a:visited { color: #2e2003;} /* darker brown */
+#extranav a:hover, #prefooter a:hover {color: #800000; } /* ubuntu dark brown */
+
+
+html>body #footer
+{
+       padding-bottom: 1.01em;         /* attempt to fix Gecko engine's rounding errors
+                                       which can disrupt the layout. */
+}
+#footer a
+{
+       color: #5B4832;
+}
+
+p, h1, h2, h3, h4, h5, h6
+{
+       margin: .6em 0 .4em 0;                  /* for better consistency across platforms */
+}
+
+.clear
+{
+       clear: both;
+}
+.inside
+{
+       padding: 0 1.5em;               /* glitch in IE caused by vertical padding in
+                                       this class, so 0 padding is set here and
+                                       those blocks that need the vertical padding
+                                       must be applied to the parent element.
+                                       the purpose of this class is to provide 
+                                       horizontal padding without using hacks to
+                                       get around IE's broken box model. so it's
+                                       okay to apply vertical padding to the parent
+                                       element, just not horizontal padding. */
+}
+#contentColumn, #rightColumn
+{
+       padding-top: 3.0em;
+       padding-bottom: 1.0em;          /* this is the vert padding talked about in the
+                                       .inside selector comment. */
+}
+#footer
+{
+       padding: .3em;                  /* ditto from above */
+}
+#pageWrapper, #innerColumnContainer, #masthead, #footer
+{
+       border-color: #000;             /* one-stop control of border color used within
+                                       the layout */
+}
+#outerColumnContainer
+{
+       border-top-color: #000;         /* should match the above border color */
+}
+
+/* navigation elements */
+#rightColumn ul
+{
+       list-style: none;
+       margin: 0;
+       padding: 0;
+       color: #696969;
+}
+#rightColumn li {
+    margin-bottom: 0px; /* Overwrite plone,css settings */
+}
+#rightColumn #navigation_links li
+{
+       padding: 0 0 .3em 20px;
+       font-size: 120%;
+}
+#rightColumn #navigation_news li
+{
+       padding: 0 .3em .3em 20px;
+}
+#rightColumn a
+{
+       text-decoration: none;
+       color: black;
+       font-weight: bold;
+}
+#rightColumn li.active
+{
+       background-image: url(little-u.gif);
+       background-repeat: no-repeat;
+       background-position: top left;
+}
+
+#rightColumn a:hover
+{
+       text-decoration: underline;
+       color: black;
+}
+
+/* body styles */
+#contentColumn a
+{
+       color: black;
+}
+
+#contentColumn p
+{
+       font-size: 100%;
+       font-family: Verdana, arial, helvetica, sans-serif;
+}
+
+
+/* header styles */
+h1, h2, h3, h4, h5, h6
+{
+       width: 100%;
+       color: #6D4C07;
+       padding-bottom: .0em;
+       padding-top: 0.4em;
+       font-family: Verdana, arial, helvetica, sans-serif; 
+}
+
+h1
+{
+       font-size: 170%;
+       border-bottom: 2px solid #6D4C07;
+}
+
+h2
+{
+       font-size: 160%;
+       border-bottom: 2px solid #6D4C07;
+}
+h3
+{
+       margin-top: 20px;
+       font-size: 130%;
+       border-bottom: 2px solid #6D4C07;
+        
+}
+h4
+{
+       font-size: 120%;
+       border-bottom: 1px solid #6D4C07;
+}
+h5
+{
+       font-size: 110%;
+}
+h6 {
+       font-size: 100%;
+}
+
+.featured {
+       font-size: 125%;
+       font-style: italic;
+}
+       
+dt
+{
+       margin-top: 20px;
+       margin-bottom: 8px;
+       font-size: 120%;
+       border-bottom: 1px solid #6D4C07;
+}
+
+img { border: 0; }

diff --git a/templates/html/foot.tmpl b/templates/html/foot.tmpl
index c7c273ea3fc38a5079dcaef7d742c090ee094bea..c6b4dc6b893bd0288b4311e0a9a954dad77d2c08 100644 (file)
--- a/templates/html/foot.tmpl
+++ b/templates/html/foot.tmpl
@@ -1,8 +1,9 @@
 [%- IF benchmark && debug -%]
 Total page evaluation took [% benchmark %]<br>
 [%- END -%]
-</div> <!-- end inner -->
+</div></div></div></div>
 
+<div class=\"clear mozclear\"></div><div id=\"prefooter\">
 <div id="footer">
 
 [% IF langs.size > 0 %]
@@ -23,6 +24,8 @@ Total page evaluation took [% benchmark %]<br>
 <p [%- ' class="bordertop"' IF langs.size > 0 %]>Back to: <a href="[% homepage %]">[% organisation %] homepage</a> || <a href="[% searchformurl %]">Packages search page</a></p>
 
 <hr class="hidecss">
+<div id="footWrapper">
+<div id="footer" class="inside">
 <div id="fineprint" class="bordertop">
 <p>To report a problem with the web site, e-mail <a href="mailto:[% contact.mail %]">[% contact.mail %]</a>. For other contact information, see the [% organisation %] <a href="[% contact.url %]">contact page</a>.</p>
 <p>[% IF timestamp.string %]Generated: [% timestamp.string %]<br>[% END %]
@@ -30,8 +33,8 @@ Total page evaluation took [% benchmark %]<br>
 Content Copyright &copy; [% copyright.years %] <a href="[% copyright.url %]">[% copyright.name %]</a>; See <a href="[% license.url %]">license terms</a>. [% IF trademarknotes -%][% trademarknotes %][%- END %]
 [% END %]
 <p><a href="/about/">Learn more about this site</a>.</p>
-</div> <!-- end fineprint -->
 </div> <!-- end footer -->
-</div> <!-- end outer -->
+</div> <!-- end footWrapper -->
+</div> <!-- end pageWrapper -->
 </body>
 </html>

diff --git a/templates/html/head.tmpl b/templates/html/head.tmpl
index 74d8b4ab39a6d025feee4b74e9b1e9cba168f657..6cb91da891dc08b8f47aac4c68d50f4ec04fa8a3 100644 (file)
--- a/templates/html/head.tmpl
+++ b/templates/html/head.tmpl
@@ -11,6 +11,8 @@
 
 <link href="/debian.css" rel="stylesheet" type="text/css" media="all">
 <link href="/packages.css" rel="stylesheet" type="text/css" media="all">
+<link href="/ubuntu/ubuntu.css" rel="stylesheet" type="text/css" media="all">
+<link href="/ubuntu/masthead.css" rel="stylesheet" type="text/css" media="all">
 [% IF rss_alternate %]
 <link rel="alternate" type="application/rss+xml" title="RSS" href="[% rss_alternate %]">
 [% END %]
@@ -23,17 +25,19 @@
 [% sitewidemsg.txt %]
 </div>
 [%- END -%]
-<div id="header">
-   <div id="upperheader">
+    <div id="pageWrapper">
+      <div id="mastWrapper">
+        <div id="masthead">
+          <a class="imageLink"
+             href="[% homepage %]">&nbsp;</a>
 
-   <div id="logo">
-  <!-- very Debian specific use of the logo stuff -->
-  <a href="[% logo.url %]"><img src="[% logo.src %]" alt="" /></a>
-  <a href="[% logo.url %]"><img src="/Pics/debian.png" alt="[% logo.alt %]" width="179" height="61"></a>
-</div> <!-- end logo -->
+          <a class="hiddenStructure"
+             href="[% homepage %]/#documentContent">Skip
+             to content</a>
 
 [%- IF print_search_field %]
 [% checked = 'checked="checked"' %]
+<div id="search">
 <form method="GET" action="/search">
 <div id="hpacketsearch">
 [% IF search_field_values.mode %]<input type="hidden" name="mode" value="[% search_field_values.mode %]">[% END %]
@@ -59,9 +63,25 @@
 </div>
 </div> <!-- end hpacketsearch -->
 </form>
+</div>
 [% END %]
 
-</div> <!-- end upperheader -->
+     <!-- masthead content begin -->
+    <h5 class="hiddenStructure">Sections</h5>    
+    <div id="nav">
+      <ul>        
+      </ul>
+    </div> <!-- nav -->
+    <!-- masthead content end -->
+    </div> <!-- masthead -->
+   </div>  <!-- mastWrapper -->
+
+<div class="visualClear"></div>
+<div id="contentColumn">
+<div class="inside">
+<div id="content" class="">
+<div class="documentContent" id="region-content">
+
 
 <p class="hidecss"><a href="#inner">skip the navigation</a></p>
 <div id="pnavbar">
@@ -72,11 +92,7 @@
 [% END %]
 </div> <!-- end navbar -->
 
-</div> <!-- end header -->
-<div id="outer">
-<div id="inner">
-
 [%- IF page_title %]
-  <h1>[% page_title %]</h1>
+  <h1 class="documentFirstHeading">[% page_title %]</h1>
   [%- PROCESS 'html/messages.tmpl' -%]
 [% END -%]