]> git.deb.at Git - deb/packages.git/commitdiff
First import of kalle's proposal
authorGerfried Fuchs <rhonda@debian.org>
Thu, 28 Oct 2010 14:26:15 +0000 (16:26 +0200)
committerGerfried Fuchs <rhonda@debian.org>
Thu, 28 Oct 2010 14:26:15 +0000 (16:26 +0200)
static/Pics/dep.png [new file with mode: 0644]
static/Pics/gradient.png [new file with mode: 0644]
static/Pics/greydot.png [new file with mode: 0644]
static/Pics/openlogo-50.png [new file with mode: 0644]
static/Pics/rec.png [new file with mode: 0644]
static/Pics/sug.png [new file with mode: 0644]
static/debian.css
static/debpkg.css [new file with mode: 0644]
templates/html/head.tmpl

diff --git a/static/Pics/dep.png b/static/Pics/dep.png
new file mode 100644 (file)
index 0000000..cc2a137
Binary files /dev/null and b/static/Pics/dep.png differ
diff --git a/static/Pics/gradient.png b/static/Pics/gradient.png
new file mode 100644 (file)
index 0000000..33009da
Binary files /dev/null and b/static/Pics/gradient.png differ
diff --git a/static/Pics/greydot.png b/static/Pics/greydot.png
new file mode 100644 (file)
index 0000000..ec23c01
Binary files /dev/null and b/static/Pics/greydot.png differ
diff --git a/static/Pics/openlogo-50.png b/static/Pics/openlogo-50.png
new file mode 100644 (file)
index 0000000..f4e75fc
Binary files /dev/null and b/static/Pics/openlogo-50.png differ
diff --git a/static/Pics/rec.png b/static/Pics/rec.png
new file mode 100644 (file)
index 0000000..2376fc5
Binary files /dev/null and b/static/Pics/rec.png differ
diff --git a/static/Pics/sug.png b/static/Pics/sug.png
new file mode 100644 (file)
index 0000000..d7ba341
Binary files /dev/null and b/static/Pics/sug.png differ
index fce9493b3312b7867ae98ff9905d14daba9eb389..63555497ebf396f0b3759d110aa5e6227fba7bee 100644 (file)
-/* css file for debian web site - Jutta Wrage 2004 */
-
-/* all pages have a header, outer inner and footer
-leftcol and maincol can be omitted, there will be other boxes
-to replace later (eg. two content columns)
-normal page:
-<div id="header">
-  <div id="upperheader">
-     <div id="logo">
-     </div> <!-- end logo -->
-     <div id="serverselect">
-     </div> <!-- end serverselect -->
-  </div> <!-- end upperheader -->
-  <div id="navbar">
-  </div> <!-- end navbar -->
-</div> <!-- end header -->
-<div id="outer">
-  <div id="inner">
-    <div id="leftcol">
-      Leftcol is for menus - if omitted, maincol can be omitted, too
-    </div> <!-- end leftcol -->
-    <div id="maincol">
-      Maincol with margin left is for the content
-      But content may go directly to inner
-    </div> <!-- end maincol -->
-  </div> <!-- end inner -->
-  <div id="footer">
-    <hr class="hidecss"> This line is a divider for lynx
-  </div> <!-- end footer -->
-</div> <!-- end outer -->
-color logo #C60036
-cd-pages: bgcolor="#e09e86" - navbar
-*/
-
-/* { border: 1px solid yellow; } */
-html, body {
-       color: #000000;
-       background-color: #FFFFFF;
-       margin: 0 4px 0 4px;
-       padding: 0;
-       text-align: left;
-       font-family: Arial, Helvetica, sans-serif;
-       /* min-width: 440px - commented out due to mozilla problems*/
+/*
+ *      www.debian.org stylesheet proposal
+ *
+ *      Kalle Soderman, 2008 debian.css
+ *
+ *      Copyleft : This work is free, you can copy, spread, and modify it under
+ *      the terms of the Free Art License http://artlibre.org/licence/lal/en/
+ *
+ *
+ *      Font size table
+ *      ---------------
+ *      Browser default 16px
+ *
+ *      14px   87.5%           body    
+ *      24px   1.714em
+ *      18px   1.286em
+ *      16px   1.143em
+ *      12px   0.857em
+ *      11px   0.786em
+ *      8px    0.57em
+ */
+
+html {
+       background-color: transparent;
+}
+
+body {
+       margin: 0;
+       font: normal 87.5% sans-serif;
+       line-height: 1.6;
+       color: black;
+       background-color: white;
 }
-/* direction directive reverses the navbar, too */
-/* html[lang|=ar] {
-      direction: rtl !important;
-      text-align: right !important;
-} */
 
-img { border: 0; }
+#outer {
+       margin: 0 10px 0 62px;
+}
 
-h1 { text-align: center; }
+/*
+ *     Header
+ */
 
-acronym {
-       border-bottom: 1px dotted #000000;
+#header {
+       margin:0;
+       padding:0 10px 0 62px;
+       font-size: 1em;
+       background-image:url('Pics/gradient.png');
+       background-position: 0 0;
+       background-repeat: repeat-x;
 }
 
-hr.hidecss {
-       border: 0;
+#header a:link
+, #second-nav a:link {
+       text-decoration: none;
 }
 
-hr {
-       border-bottom: 0;
-       border-top: 1px solid #BFC3DC;
+#header a:hover
+, #second-nav a:hover {
+       text-decoration: underline;
 }
 
-samp {
-       display: block;
-       margin-left: 2em;
+#breadcrumbs {
+       font-size: 0.786em;
+       background-color: transparent;
+       background-color: #f5f6f7;
+       margin:0;       
+       padding: 6px 0.25em 7px  0.25em;
+       border-bottom: 1px solid #d2d3d7 ;
+       text-transform:lowercase;
+       line-height: 1;
 }
-div.sampleblock {
-       width: 80%;
-       margin: auto;
-       font-family:courier, serif;
-       font-size: 90%;
+
+p.section {
+       font-family:monospace;
+       position:absolute;
+       top: 0px;
+       left:62px;
+       text-transform: uppercase;
+       letter-spacing: 0.08em;
+       background-color: #c70036;
+       line-height: 16px;
+       color:white;
+       padding: 0 5px 0 5px;
+       margin:0;
+       font-size: 1em;
 }
-div.quoteblock {
-       width: 75%;
-       margin: auto;
-       font-size: 90%;
-       text-align: justify;
+
+#navbar {
+       background-color: transparent;
+       list-style:none;
+       display:block;
+       border-bottom:1px solid #c70036;
+       text-indent:0;
+       padding: 0;
+       margin-top:0;
+       margin-bottom:0;
+       line-height:1;
+}
+
+#navbar ul {
+       margin:0 ;
+       padding:0 ;
+       height: 54px;
+       clear: both;
+       overflow: hidden;
 }
 
-.quoteblock div.preimg {
+#navbar li {
+       list-style: none;
        float: left;
-       margin-top: 0.2em;
+       padding: 0;
+       margin: 0;
+       font-size: 1em;
 }
-.quoteblock cite {
+
+#navbar a:link
+, #navbar a:visited {
+       padding: 30px 1em 10px 1em;
+       border-left: 1px solid transparent;
+       border-right: 1px solid transparent;
        display: block;
-       text-align: right;
 }
-blockquote.question {
-       font-style: italic;
-}
-blockquote.question p span {
-       font-style: normal;
-       width: 10%;
+
+#navbar a:visited {
+       color: #54638c;
 }
-#pagewidth {
-       width: 100%;
-       text-align: left;
+
+#navbar a:hover
+, #navbar a:visited:hover {
+       background-color: #efefef;
+       border-left: 1px solid  #d2d3d7;
+       border-right: 1px solid #d2d3d7;
 }
 
-/* now the header*/
-#header {
-       margin-left: -3px;
-       width: 100%;
-       height: auto;
+#sitetools {
+       text-align:left;
+       margin: 0 10px 0 0;
+       padding: 0px 0 1px 0;
+       position: absolute;
+       top:0;
+       right:0;
+       border-right: 1px solid white;
+       border-left: 1px solid #d2d3d7;
+       line-height: 1;
 }
 
-/* upper nested header box*/
 #upperheader {
-       width: 100%;
-       margin-top: 11px;
-       height: auto;
-       /* height: 4.8em; */
-       background: #FFFFFF;
+       margin:0;
+       padding:0;
 }
 
 #logo {
-       float: left;
-       margin-left: 6px;
-       background: #FFFFFF;
+       position:absolute;
+       top:0;
+       left:0;
+       padding: 0;
+       background-color: transparent;
+       border: 1px solid transparent;
+       border-top: 0;
 }
 
-#serverselect {
-       float: right;
+#logo a {
        display: block;
-       padding-top: 1px;
-       margin-right: 6px;
-       margin-left: auto;
-       text-align: right;
-       top: 0;
-       right: 0;
+       height:71px;
+       padding: 8px 5px 0 5px;
 }
 
-#serverselect:lang(de) {
-       width: 15em;
-}
-#serverselect:lang(en) {
-       width: 13em;
+#logo img {
+       margin-top: 5px;
 }
 
-#serverselect p {
-       color: #990000;
-       font-size: 0.8em;
-       font-weight: normal;
+#logo:hover {
+       border: 1px solid #d2d3d7 ;
+       border-top: 0;
+       background-color: #eee;
 }
 
-#serverselect p select {
-       font-size: 88%;
-}
+/*
+ *     Links
+ */
 
-#serverselect p input {
-       font-size: 88%;
-}
-.centerlogo {
-       margin-left: 260px;
-       margin-right: auto;
-       width: 125px;
-       text-align: center;
-       vertical-align: bottom;
-}
-#cdlogo {
+a:link {
+       color: #0035c7;
+       text-decoration: underline;
 }
 
-#navbar {
-       /* margin-top: 1em; */
-       clear: both;
-       padding-left: 0px;
-       /* margin-top: 5px; */
-       padding-top: 6px;
-       padding-bottom: 4px;
-       width: 100%;
-       height: auto;
-       text-align: center;
-       background: #DF0451;
-}
-#navbar ul {
-       display: inline;
-       list-style-type: none; 
-       padding-left:  0px;
-       line-height: 1.5em;
+a:visited {
+       color: #54638c;
 }
-#navbar ul li {
-       display: inline;
-       margin: 0;
-       white-space: nowrap;
-}
-#navbar a {
-       color: #FFFFFF;
+
+a:hover {
        text-decoration: none;
-       padding: 0.2em 0.4em 0.2em 0.4em;
-       background-color: #000084;
-       border: 1px solid #000084;
-       font-family: Arial, Helvetica, sans-serif;
-       font-weight: bold;
-       font-size: 0.9em;
+       color: #00207a;
 }
-#navbar a:hover {
-       background: #0000CC;
+
+a:active {
+       color:#c2c3c7;
 }
-#navbar .hidecss, .hidecss {
-       display: none;
+
+a img {
+       border:0;
 }
 
-/* the rest of page out of two nested boxes around */
+/*
+ *     Leftcol (Should be renamed secondnav)
+ */
 
-#outer {
-       background-color: #FFFFFF;
-       width: auto;
-       /* border:solid white 2px; */
+#second-nav {
+       width: 16em;
+       float:right;
+       padding:0 0 0 1em;
+       margin: 1em 0 10px 1em;
+       border-left:1px solid #d3d6df;
+       font-size: 0.786em;
+       line-height: 1.5;
 }
 
-#inner {
-       margin: -2px;
-       margin-top: 0;
-       width: 100%;
-       background: #FFFFFF;
-       /* overflow: auto; */
+#second-nav ul {
+       padding:0;
+       margin:0;
+       list-style:none;
 }
 
-#leftcol {
-       float: left;
-       margin: 0em 0.4em 0 0;
-       padding-left: 0;
-       padding-bottom: 1em;
-       width: auto;
-       background: #BBDDFF;
-       font-size: 0.9em;
-       font-family: Arial, Helvetica, sans-serif;
-       border: 1px solid #BBDDFF;
-       /* overflow: auto; */
-}
-#leftcol a:link, #leftcol a:visited {
-       display: block;
+#second-nav ul ul {
+       margin-left: 1em;
 }
-#leftcol a:hover {
-       background-color: #DDEEFF;
-       /* background-color: #FFFFFF; */
+
+#second-nav li {
+       font-weight: normal;
+       margin-top:0.5em;
 }
-#leftcol ul {
-       margin: 2px;
-       padding: 0;
-       list-style-type: none;
+
+#second-nav p {
+       line-height: 1;
        font-weight: bold;
 }
-#leftcol ul.votemenu {
-       width: 11em;
-}
-#leftcol ul.cdmenu {
-       width: 12em;
-}
-#leftcol ul.votemenu ul li, #leftcol ul.cdmenu ul li {
-       padding-bottom: 0.4em;
-}
-#leftcol li ul {
-       display: inline;
+
+#second-nav h2 {
+       margin:0;
 }
-#leftcol ul li {
-       padding: 0.2em 0;
+
+
+/*
+ *     Typography
+ */
+
+p {
+       margin: 0 0 1em 0;
 }
-#leftcol ul ul {
-       font-size: 0.9em;
-       margin: 0;
+
+h1
+, h2
+, h3
+, h4 {
+       font-weight: 600;
+       margin-bottom: 0.5em;
+       margin-top: 1em;
 }
-#leftcol ul li a {
-       line-height: 1.2em;
-       padding-right: 0.5em;
-       /* padding: 0.2em 0 0.3em 0em; */
+
+h1 {
+       line-height: 1em;
 }
-#leftcol ul ul li a {
+
+h4 {
+       font-size: 1em;
        font-weight: normal;
-       padding: 0.1em 0.5em;
-       line-height: 1.1em;
-}
-#leftcol ul ul li {
-       padding-top: 0;
-}
-#leftcol p {
-       margin-left: 2px;
-       margin-right: 2px;
+       font-style: italic;
 }
-#leftcol p a {
-       display: block;
-       margin: 0;
+
+h3 {
+       font-size: 1em;
 }
-#leftcol p img {
-       margin-left: 1em;
+
+h2 {
+       font-size: 1.143em;
 }
 
-#maincol {
-       background: #FFFFFF;
-       margin-left: 12em;
-       margin-right: 0.5em;
-       margin-bottom: 1em;
+ol,ul {
+       padding-left: 2em;
+       margin-left:0;
 }
 
-#maincol:lang(en), #maincol:lang(cz), #maincol:lang(ko),
-       #maincol:lang(no), #maincol:lang(sk), #maincol:lang(tr),
-       #maincol:lang(zh-CN), #maincol:lang(zh-HK), #maincol:lang(zh-TW) {
-       margin-left: 10em;
+hr {
+       border: none;
+       background-color: #bbb;
+       height: 1px;
 }
 
-#lefthalfcol {
-       float: left;
-       margin-left: 0em;
-       width: 49%;
+.hidecss {
+       display: none;
 }
 
-#lefthalfcol dl {
-       margin-top: 0em;
+pre {
+       overflow: auto;
 }
 
-#righthalfcol {
-       margin-left: 50%;
-       width: 50%;
+dd {
+       margin-left: 2em;
+       margin-bottom: 1em;
 }
 
-#righthalfcol dl {
-       margin-right: 0.2em;
+.toc {
+       font-size: 0.8em;
+       list-style:none;
+       margin: 1em 0 1em 0;
+       background-image: url('Pics/greydot.png');
+       background-position: bottom left;
+       background-repeat: repeat-x;
+       line-height:1.5;
+       padding: 0;
+       max-width: 67%;
 }
 
-#footer {
-       clear: both;
-       width: 100%;
-       padding-top: 3px;
-       bottom: 0;
-       text-align: center;
-       margin: 1em 0 0 0;
-       border-top: 1px solid #BFC3DC;
+.toc li {
+       background-image: url('Pics/greydot.png');
+       background-position: top left;
+       background-repeat: repeat-x;
+       padding: 0.25em 0 0.25em 0;
+ }
+
+.toc a {
+       display:block;
 }
 
-#fineprint {
-       margin-top: 0.2em;
-       padding-top: 3px;
-       text-align: center;
-       font-size: 0.85em;
+.toc a:hover {
+       display:block;
+       background-color: #f0f0f4;
 }
 
-.bordertop { border-top: 1px solid #BFC3DC; }
+/*
+ *     Sitemap 
+ */
 
-dl.gloss dt {
-       font-weight: bold;
+.card {
+       clear:both;
+       margin:2em 0 2em 0;
+       background-position: 0 -50px;
+       background-repeat: repeat-x;
+       padding:8px 0 8px 0;
 }
 
-#footer ul {
-       display: inline;
-       list-style-type: none;
+.card ul {
+       margin:0.5em 0 1em 0;
 }
 
-#footer ul li {
-       display: inline;
+.card ul li {
+       list-style:none;
 }
 
-#footer ul li a, table.y2k td {
-       white-space: nowrap;
+.card h2 {
+       margin:0;
 }
 
-#footer p {
-       margin: 0px;
+.lefthalf {
+       float:left;
 }
 
-#main {
-       background: #bbddff;
-       padding: 1em 0; /* have some padding to get rid of collapsed margins */
+.righthalf {
+       margin-left:50%;
 }
 
-/* classes for cards */
-
-.cardleft {
-       margin: 0 0 1em;
-       float: left;
-       width: 49%;
+.lefthalf ul {
+       margin-top:0;
 }
-.cardright {
-       margin-left: 50%
-       /*margin: 0 1% 2em 50%; */
+
+/*
+ *     Footer
+ */
+
+#footer {
+       font-size: 0.786em;
+       border: 1px solid #dfdfe0;
+       border-bottom: 0;
+       padding:1em;
+       background-color: #f2f3f6;
+       margin: 0 0 0 0;
 }
-.card {
-       clear: left;
-       margin: 0 0 1em;
+
+#footer hr {
+       border-top: 1px solid #d2d3d7;
+       border-bottom: 1px solid white;
+       height: 0;
 }
 
-.cardleft h2, .cardright h2, .card h2 {
-       font-size: 120%;
-       background: #000000;
-       color: #FFD400;
+#footer .editbar li {
        display: inline;
-       padding: 0.2em 0.4em;
-       margin: 0 10px;
-       font-family: Arial, Helvetica, sans-serif;
-       letter-spacing: 0.2em;
+       margin-right: 2em;
 }
 
-.cardleft dl dd, .cardright dl dd , .card dl dd {
-       padding-bottom: 0.5em;
+#footer .info {
+       font-size: 1em;
 }
 
-.cardleft div, .cardright div, .card div {
-       border: 2px solid #000000;
-       background: #FFFFFF;
-       padding: 0.5em;
-       margin: 2px 10px;
-       /* the next two lines xpand the div to heigth of left inner div */
-       overflow: auto;
+#fineprint {
+       margin-bottom: 1em;
 }
 
-div.lefthalf {
-       float: left;
-       width: 49%;
-       border: 0;
-       margin: 0; 
+#footermap {
+       list-style:none;
+       margin: 0 0 0 0;
        padding: 0;
-}
-
-div.righthalf {
+       width:100%;
+       font-size: 11px;
+       overflow: hidden;
+       line-height: 1.6;
        border: 0;
-       margin: 0;
-       padding: 0;
 }
-/* colors for packages, warnings and news in ports */
-.warning, dt.new, .no {
-       color: red; /* FF0000 */
+
+ul#footermap-cola a
+, ul#footermap-colb a
+, ul#footermap-colc a
+, ul#footermap-cold a
+, ul#footermap-cole a {
+       padding-left: 0;
 }
 
-.psmallcenter, .psmalltrademark {
-       clear: both;
-       font-size: 0.85em;
-       text-align: center;
-}
-
-.psmalltrademark {
-       color: green;
-}
-table.ridgetable, table.reltable {
-       border-width: 4px;
-       border-color: gray;
-       margin: 0 1em 1em 1em;
-       border-style: ridge;
-       border-collapse: collapse;
-}
-table.vote {
-       margin: 0 auto;
-       border-width: 3px;
-       border-color: gray;
-       border-style: ridge;
-       border-collapse: collapse;
-}
-#pcontentsres col, #pcontentsres th, #pdownload th, #pdownload td, table.ridgetable th, table.ridgetable td,
-       table.reltable td, table.reltable th {
-       border: 2px #BFC3DC;
-       border-style: ridge;
-       padding: 0.1em;
-}
-table.reltable th {
-       background-color: #44CCCC;
-}
-table.vote th {
-       border: 1px solid gray;
-       background-color: #DDDDDD;
-}
-table.vote td {
-       border: 1px solid gray;
-       padding: 4px;
-}
-table.reltable tr.odd {
-       background-color: #FFFFFF;
-}
-table.reltable tr.even {
-       background-color: #DDDDDD;
-}
-table.stattrans {
-       margin: 0 auto;
-       width: 95%;
-       border: 1px solid black;
-       background-color: #cdc9c9;
-}
-table.stattrans th {
-       text-align: center;
-       padding: 2px;
-}
-table.stattrans td {
-       text-align: right;
-       padding: 2px;
-}
-table.stattrans tbody th {
-       text-align: left;
-       font-weight: normal;
+ul#footermap-cola
+, ul#footermap-colb
+, ul#footermap-colc
+, ul#footermap-cold
+, ul#footermap-cole {
+       float:left;
+       width: 19%;
+       min-width: 11em;
+       height: 12em; /* Update when adding items */
+       margin:0 1% 0 0;
+       padding: 10px 0 0 0;
+       list-style: none;
 }
 
-/* partners */
-.partnertype {
-       background-color: #DD0000;
-       padding: 0.2em 0 0.2em 1em;
-       color: #FFFFFF;
+ul#footermap-cole {
+       width: 18.9%;
+       margin-right:0;
+}
 
+#footermap-wrap {
+       padding:1em;
+       border-top: 1px solid white;
 }
-div.partnerlogo {
-       display: table-cell;
-       vertical-align: middle;
-       text-align: center;
-       width: 30%;
+
+#footermap a {
+       margin: 0;
 }
-div.partnerdesc {
-       display: table-cell;
-       font-size: 85%;
+
+#footermap ul{
+       list-style: none;
+       padding:0;
 }
-div.cdflash {
-       background-color: #E09E86;
-       width: 80%;
-       margin: auto;
-       text-align: center;
+
+#footermap li {
+       text-indent:0;
+       background-color: transparent;
+       font-weight:bold;
+       margin-top: 0.5em;
 }
-.cdrsync {
-       color: #6B1300;
+
+#footermap li ul {
+       margin: 0;
+       padding: 0:
 }
-/* debian installer */
 
-.dierror {
-       background-color: #FF6060;
+#footermap li li {
+       margin:0;
+       text-indent:0;
+       padding:0;
+       font-weight:normal;
+       line-height: 1.5;
+       border:0;
+       background-image:none;
+       background-color:transparent;
 }
-.dibad {
-       background-color: #F7FF60;
+
+#sitetools form {
+       margin:0;
+       padding:0;
 }
-.digood {
-       background-color: #7AFF71;
+
+#sitetools input {
+       margin: 0 0 0 0.25em;
+       padding-left: 4px;
+       font-size: 0.786em;
+       padding-right: 4px;
 }
 
-/* useful classes */
+#sitetools select {
+       font-size: 0.786em;
+       margin-left: 0.5em;
+}
 
-th.eventheader {
-       background-color: #BBDDFF;
+#sitetools form p {
+       display: inline;
+       line-height: 1;
+       margin:0;
+       padding:0;
+       font-size: 0.786em;
 }
-.center {
-       text-align: center;
+
+.sitetool a {
+       margin: 0.5em 0 0.5em 1em;
+       padding: 0 0 0 0;
+       float: left;
 }
-.right {
-       text-align: right;
+
+.sitetool {
+       margin:0;
+       padding: 2px 5px 2px 5px;
+       border-left: 1px solid white;
+       border-right: 1px solid #d2d3d7;
+       display:block;
+       float:left;
 }
-ul.circlelist {
-       list-style-type: circle;
+
+#serverselect input
+, #serverselect option 
+, #serverselect select {
+       font-size: 11px;
 }
-.centerdiv table {
-       margin-left: auto;
-       margin-right: auto;
+
+#serverselect ul {
+       display: inline;
+       margin-left: 2em;
 }
-ul.discless {
-       list-style-type: none;
+
+#serverselect li {
+       list-style: none;
+       display: inline;
+       padding:0 1em 0 1em;
+       margin:0;
 }
-.top, img.ico {
-       vertical-align: top;
+
+#serverselect form p {
+       margin:0;
+       padding:0;
+       line-height: 1;
 }
-img.ico {
+
+
+
+.lcol50 {
        float: left;
-       margin: 0 0.2em 0 0;
+       width: 49%;
+       font-size:0.8em;
+       margin:0 0 0 0;
+       padding:0 0.5em 0 0;
 }
-img.rightico {
-       float: right;
-       vertical-align: top;
-       margin: 0 0 0 0.2em;
+
+.lcol50 h2 {
+       margin-top:0;
 }
-img.cve {
-       vertical-align: -25px;
+
+.rcol50 {
+       margin:0 0 0 51%;
+       padding:0;
+       font-size:0.8em;
 }
-.y2kok, .yes {
-       color: #00BB00;
+
+/*
+ *     Extras
+ */
+
+.clear {
+       clear:both
 }
-.y2kok2 {
-       color: #00BBBB;
+
+#clear {
+       clear:both;
+       border:0;
+       height:1px;
+       display:block;
+ }
+
+.quicklist:before {
+       content: "Quick Links: ";
+       font-weight: bold;
 }
-.bluehead {
-       color: #0000FF !important;
+
+.quicklist {
+       list-style: none;
+       font-size: 0.8em;
+       margin:0;
+       padding:0;
+       text-indent:0;
 }
-span.halfsize {
-       font-size: 80%;
+
+.quicklist li  {
+       display:inline;
 }
-span.ddpbooktitle, span.merchtitle {
-       font-size: larger;
+
+.item p{
+       margin: 0;
 }
-a:link { color: #0000FF; }
-a:visited { color: #800080; }
-a:hover { color: #F000FF; }
-a:active { color: #FF0000; }
 
-.navpara a, col.y2k {
-       white-space: nowrap;
-       /* this is to keep from breaking at whitespace in anchors */
+.item h2
+, .item p
+, .item ul{
+       margin-right: 10px 
 }
 
-/* language dependent stuff */
-/* quotes */
-html[lang="de"] q:before {
-       content: "\00BB";
+.col50 {
+       width:50%;
+       float: left;
 }
-html[lang="de"] q:after {
-       content: "\00AB";
+
+.lastcol {
+       margin: auto;
+       width: 50%;
+       float:left;
 }
-html[lang="de"] q q:before {
-       content: "\203A";
+
+.lastcol h2
+, .lastcol p
+, .lastcol ul {
+       margin-left:  10px;
+       margin-right:0;
 }
-html[lang="de"] q q:after {
-       content: "\2039";
+
+.line {
+       clear: both;
+       display: block;
+       margin: 0 0 2em 0;
+       padding: 0;
+       width: auto;
+       overflow: hidden;
 }
-html[lang="pl"] q:before { content: "\201E"; }
-html[lang="pl"] q:after { content: "\201D"; }
-html[lang="pl"] q q:after { content: "\2019"; }
-html[lang="pl"] q q:before { content: "\201A"; }
 
-html[lang="fr"] q:before { content: "\00AB\00A0"; }
-html[lang="fr"] q:after { content: "\00A0\00BB"; } 
-html[lang="fr"] q q:before { content: "\2039\00A0"; }
-html[lang="fr"] q q:after { content: "\00A0\203A"; }
+.cardleft {
+       width:50%;
+       float: left;
+}
 
-#leftcol:lang(ja) ul ul {
-       font-size: 0.95em;
+.cardright {
+       margin: auto;
+       width: 50%;
+       float:left;
+}
+
+.cardleft div 
+, .cardleft h2 {
+       margin-right: 0.5em;
 }
-html[lang|="zh"] strong {
-       /* color: #FFFFFF; */
-       background-color: yellow;
+
+.cardright div
+, .cardight h2 {
+       margin-left: 0.5em;
 }
-.underline { text-decoration: underline; }
-.clr { clear:both; }
-/*.content{padding:5px;} */ /*padding for content */
-/* #header .content{padding-bottom:0;} */ /*padding bottom 0 to remove space in IE5 Mac*/
 
-/* for l10n-arabic */
-.bidi {
-       direction: rtl;
-       text-align: right;
+ul.votemenu {
+       font-size: 0.8em;
+       list-style:none;
+       margin: 1em 0 1em 0;
+       background-image: url('Pics/greydot.png');
+       background-position: bottom left;
+       background-repeat: repeat-x;
+       line-height:1.5;
+       padding: 0;
+       max-width: 67%;
+}
+
+.votemenu li {
+       background-image: url('Pics/greydot.png');
+       background-position: top left;
+       background-repeat: repeat-x;
+       padding: 0.25em 0 0.25em 0;
+ }
+
+.votemenu a {
+       display:block;
 }
 
-#leftcol, #navbar, #navbar a {
-       -moz-border-radius: 15px;
-       /* this goes to the end as the css validator does not like it
-       will be replaced by border-radius with css3 */
+.votemenu a:hover {
+       display:block;
+       background-color: #f0f0f4;
 }
diff --git a/static/debpkg.css b/static/debpkg.css
new file mode 100644 (file)
index 0000000..c3aa031
--- /dev/null
@@ -0,0 +1,267 @@
+/*
+ *      packages.debian.org stylesheet proposal
+ *
+ *      Kalle Soderman, 2009 debpkg.css
+ *
+ *      Copyleft : This work is free, you can copy, spread, and modify it under
+ *      the terms of the Free Art License http://artlibre.org/licence/lal/en/
+ *
+ *
+ *      Font size table
+ *      ---------------
+ *      Browser default 16px
+ *
+ *      14px   87.5%           body    
+ *      24px   1.714em
+ *      18px   1.286em
+ *      16px   1.143em
+ *      12px   0.857em
+ *      11px   0.786em
+ *      8px    0.57em
+ */
+
+@import url("debian.css");
+
+#header {
+       background-image:url('./Pics/gradient.png');
+}
+
+#footer {
+       margin-left: 0;
+       margin-right: 0;
+}
+
+#pnavbar {
+       font-size: 0.786em;
+       background-color: transparent;
+       background-color: #f5f6f7;
+       margin:0;       
+       padding: 6px 0.25em 7px  0.25em;
+       border-bottom: 1px solid #d2d3d7 ;
+       text-transform:lowercase;
+       line-height: 1;
+}
+
+
+#pmoreinfo {
+       width: 20em;
+       float:right;
+       padding:0 0 0 1em;
+       margin: 1em 0 10px 1em;
+       border-left:1px solid #d3d6df;
+       font-size: 0.786em;
+       line-height: 1.5;
+}
+
+#pmoreinfo ul {
+       padding:0;
+       margin:0;
+       list-style:none;
+}
+
+#pmoreinfo ul ul {
+       margin-left: 1em;
+}
+
+#pmoreinfo li {
+       font-weight: normal;
+       margin-top:0.5em;
+}
+
+#pmoreinfo p {
+       line-height: 1;
+       font-weight: bold;
+}
+
+#pmoreinfo h2 {
+       margin:0;
+}
+
+
+#packagesearch #breadcrumbs {
+       margin-bottom: 0;
+}
+       
+#hpacketsearch form {
+       margin:0; padding:0;
+}
+
+#hpacketsearch {
+       background:#f7f8fc;
+       border-bottom: 1px solid #e2e3e7;
+       display:block;
+       padding:0;
+
+       font-size: 0.786em;
+}
+
+#psearchtoomanyhits {
+       padding:10px;
+       border: 1px solid #cccca3;
+       margin:0;
+       margin-top:10px;
+       background-color:#ffffcb;
+}
+
+#psearchres {
+       margin: 0 0 2em 0;
+}
+
+#psearchres h2{
+       margin:0;
+       padding:0;
+}
+
+#psearchres h3{
+       margin:0;
+       padding:0;
+}
+
+#psearchres ul li{
+       margin:0 0 0.5em 0;
+       padding:0;
+}
+
+#pothers {
+       margin-top:0.25em;      
+       float: right;
+}
+
+#psource {
+       margin-top:0.25em;
+}
+
+/*
+ *     Package sidebar
+ */
+#ptablist {
+
+}
+
+/*
+ *     Package dependencies
+ */
+
+#pdeplegend {
+       margin-bottom:2em;
+       font-weight:bold;
+       padding: 0 0.5em 0 0;
+       border:1px solid #d3d6df;
+}
+
+#pdeplegend img {
+       margin-left: 1em;
+}
+
+#pdeplegend tr,#pdeplegend ul,#pdeplegend li {
+       margin:0; padding:0;
+}
+
+#pdeplegend td {
+       padding-left: 1.5em;
+       padding-right: 1em;
+}
+
+#pdeps dd {
+       margin:0;
+       padding:0;
+}
+
+#pdeps dt {
+       margin-top:0.5em;
+}
+
+#pdeps ul.uldep, #pdeps ul.uladep {
+       list-style-type: disc;
+       list-style-image: url(Pics/dep.png);
+}
+
+.uldep dt {
+
+}
+
+#pdeps ul.ulrec, #pdeps ul.ulidep {
+       list-style-type: square;
+       list-style-image: url(Pics/rec.png);
+}
+
+#pdeps ul.ulsug {
+       list-style-type: circle;
+       list-style-image: url(Pics/sug.png);
+}
+
+#pdownload {
+       margin-bottom:1em;
+       text-align: left;
+}
+
+#pdownload table {
+       text-align:left;
+}
+
+#pdeplegend td li {
+       padding-left:0;
+}
+
+#pdeplegend td,#pdeplegend tr,#pdeplegend table,#pdeplegend ul,#pdeplegend li,#pdeplegend tbody {
+       margin:0;
+       paddding:0;
+}
+
+.pkgreport #pdeplegend td li {
+       margin:0.25em 0 0 2em;
+}
+
+#ptags {
+       font-size: 0.786em;
+       padding: 1em;
+       margin-right: 22em;
+}
+
+.card {
+       clear:both;
+       margin:2em 0 2em 0;
+       background-position: 0 -50px;
+       background-repeat: repeat-x;
+       padding:8px 0 8px 0;
+}
+
+.card ul {
+       margin:0.5em 0 1em 0;
+}
+
+.card ul li {
+       list-style:none;
+}
+
+.card h2 {
+       margin:0;
+}
+
+#lefthalfcol {
+       float:left;
+       width: 50%;
+       padding-right: 1em;
+       margin:0;
+}
+
+#righthalfcol {
+       margin:0;
+       margin-left:50%;
+       padding-left: 1em;
+}
+
+#lefthalfcol dl
+, #righthalfcol dl {
+       margin-top: 0;
+}
+#lefthalfcol dd
+, #righthalfcol dd {
+       margin-bottom: 1em;
+}      
+
+.lefthalf ul {
+       margin-top:0;
+}
+
+
index f8d520bedd8bf74f95ff953283b9c30cb8f0d276..656a792f14c479e7911e6043891277523b308fae 100644 (file)
@@ -9,29 +9,43 @@
 <meta name="Keywords" content="[% organisation %],  [% keywords %]">
 [% html_meta %]
 
-<link href="/debian.css" rel="stylesheet" type="text/css" media="all">
-<link href="/packages.css" rel="stylesheet" type="text/css" media="all">
-<link href="/packages-site.css" rel="stylesheet" type="text/css" media="all">
+<link href="/debpkg.css" rel="stylesheet" type="text/css" media="all">
 [% IF rss_alternate %]
 <link rel="alternate" type="application/rss+xml" title="RSS" href="[% rss_alternate %]">
 [% END %]
 <script src="/packages.js" type="text/javascript"></script>
 </head>
 <body>
-[%- IF sitewidemsg -%]
-<div id="psitewidemsg" class="[% sitewidemsg.importance %]">
-[%- IF sitewidemsg.title -%]<h2>[% sitewidemsg.title %]</h2>[% END %]
-[% sitewidemsg.txt %]
-</div>
-[%- END -%]
 <div id="header">
    <div id="upperheader">
 
    <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-small.png" alt="[% logo.alt %]" width="90" height="31"></a>
+<a href="[% logo.url %]"><img src="[% logo.src %]" alt="Debian" with="50" height="61"></a>
 </div> <!-- end logo -->
+<p class="hidecss"><a href="#inner">[% g('skip the navigation') %]</a></p>
+<p class="section">Packages</p>
+</div> <!-- end upperheader -->
+<!-- navbar -->
+<div id="navbar">
+<ul>
+   <li><a href="http://www.debian.org/intro/about">About Debian</a></li>
+   <li><a href="http://www.debian.org/distrib/">Getting Debian</a></li>
+   <li><a href="http://www.debian.org/support">Support</a></li>
+   <li><a href="http://www.debian.org/devel/">Developers'&nbsp;Corner</a></li>
+</ul>
+</div> <!-- end navbar -->
+
+<div id="pnavbar">
+ &lsaquo;&nbsp;&nbsp;<a href="[% packages_homepage %]" title="[% g('%s Packages Homepage', organisation) %]">[% g('Packages') %]</a>
+[% FOREACH n IN navigation %]
+ &lsaquo;&nbsp;&nbsp;[% IF n.url %]<a href="[% n.url %]" [% IF n.title %]title="[% n.title %]"[% END %]>[% n.name %]</a>[% ELSE %][% n.name %][% END %] 
+[% END %]
+</div> <!-- end navbar -->
+
+</div> <!-- end header -->
+<div id="outer">
+<div id="inner">
 
 [%- IF print_search_field %]
 [% checked = 'checked="checked"'
 </div> <!-- end hpacketsearch -->
 </form>
 [% END %]
+[%- IF sitewidemsg -%]
+<div id="psitewidemsg" class="[% sitewidemsg.importance %]">
+[%- IF sitewidemsg.title -%]<h2>[% sitewidemsg.title %]</h2>[% END %]
+[% sitewidemsg.txt %]
+</div>
+[%- END -%]
 
-</div> <!-- end upperheader -->
-
-<p class="hidecss"><a href="#inner">[% g('skip the navigation') %]</a></p>
-<div id="pnavbar">
- &gt;&gt; <a href="[% project_homepage %]" title="[% g('%s Homepage', organisation) %]">[% organisation %]</a>
- &gt;&gt; <a href="[% packages_homepage %]" title="[% g('%s Packages Homepage', organisation) %]">[% g('Packages') %]</a>
-[% FOREACH n IN navigation %]
- &gt;&gt; [% IF n.url %]<a href="[% n.url %]" [% IF n.title %]title="[% n.title %]"[% END %]>[% n.name %]</a>[% ELSE %][% n.name %][% END %] 
-[% END %]
-</div> <!-- end navbar -->
-
-</div> <!-- end header -->
-<div id="outer">
-<div id="inner">
 
 [%- IF page_title %]
   <h1>[% page_title %]</h1>