Attached patch to tools.git/patches/patches.css adds the necessary
styling for a WineHQ-style patch status page:
http://i.imgur.com/5ToSc.png

The div class="main" needs to be replaced by the html attached in the
other file. I can write a patch for it if it's to be included, but I
cannot test it. Is it worth doing?


J. Leclanche
<body class="patches-winehq-org"> 
 
<div id="logo_glass"><a href="/patches/"><img 
src="http://winehq.org/images/winehq_logo_glass_sm.png"; alt=""></a></div> 
<div id="logo_text"><a href="/patches/"><img 
src="http://winehq.org/images/winehq_logo_text.png"; alt="WineHQ" 
title="WineHQ"></a></div> 
 
<div id="tabs"> 
        <ul> 
                <li><a href="http://www.winehq.org/";>WineHQ</a></li> 
                <li><a href="http://wiki.winehq.org/";>Wiki</a></li> 
                <li><a href="http://appdb.winehq.org/";>AppDB</a></li> 
                <li><a href="http://bugs.winehq.org/";>Bugzilla</a></li> 
                <li><a href="http://forums.winehq.org/";>Forums</a></li> 
        </ul> 
</div> 
 
<div id="logo_blurb">Wine source repository &ndash; Patch status</div> 
<div id="main_content"> 
<div id="content"> 
<table class="main">
(main table)
</table>

<div class="legend"> 
<h2>Legend</h2> 
<table id="legend">
(legend table)
</table>
</div>
 
</div>
</div>
</body>
</html>
diff --git a/patches/patches.css b/patches/patches.css
index 6e0e206..b94aee6 100644
--- a/patches/patches.css
+++ b/patches/patches.css
@@ -1,29 +1,121 @@
 /* WineHQ-ish look */
+
 body {
-    background-color: #E2E2E2;
-    color: black;
+    background-color: #000000;
+    color: #000000;
+    background-image: url("http://winehq.org/images/bg.jpg";);
+    background-repeat: no-repeat;
     font-family: "bitstream vera sans", "verdana", "arial", "helvetica", sans-serif;
-    margin: 10px;
-    font-size: small;
+    margin: 0;
+    font-size: 10pt;
 }
 
 a:link    { text-decoration: none; }
 a:visited { text-decoration: none; }
 a:hover   { text-decoration: underline; }
 
-div.main, div.legend {
-    margin: 10px 0 0 0;
+/* wine logo image */
+#logo_glass_big {
+    position: absolute;
+    z-index: 2;
+    top: 0px;
+    left: 0px;
+    width: 200px;
+    height: 313px;
+}
+
+#logo_glass {
+    position: absolute;
+    z-index: 2;
+    top: 20px;
+    left: 50px;
+    width: 100px;
+    height: 157px;
+}
+
+#logo_text {
+    position: absolute;
+    z-index: 3;
+    top: 40px;
+    left: 110px;
+    width: 186px;
+    height: 58px;
+}
+
+#logo_blurb {
+    position: absolute;
+    z-index: 4;
+    top: 92px;
+    left: 130px;
+    font-size: 12px;
+    color: #999999;
+}
+
+#tabs {
+    position: absolute;
+    z-index: 6;
+    top: 0px;
+    right: 10px;
+    margin: 0px;
+    padding: 0px;
+}
+
+#tabs ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+#tabs li            {
+    float: left;
+    width: 112px;
+    height: 28px;
+    margin: 0px 2px 0px 2px;
+    padding: 0;
+    text-align: center;
+    background-image: url("http://winehq.org/images/tab_u.png";);
+    background-repeat: no-repeat;
+}
+
+#tabs li.s {
+    background-image: url("http://winehq.org/images/tab_s.png";);
+}
+
+#tabs li.s a {
+    font-weight: bold;
+}
+
+#tabs li:hover {
+    background-image: url("http://winehq.org/images/tab_h.png";);
+}
+
+#tabs a {
+    display: block;
+    width: 108px;
+    height: 23px;
+    padding-top: 3px;
+    font-size: 16px; color: white; text-decoration: none;
+}
+
+#main_content {
+    padding: 85px 10px 10px 100px;
+}
+#content {
     background-color: white;
-    width: 100%;
-    border: 1px solid #601919;
+    border-radius: 7px;
+    padding: 20px 20px 10px 80px;
 }
 
+
 h1, h2 {
     text-align: center;
-    background-color: #601919;
-    color: #ffffff;
-    padding: 4px;
-    margin: 0;
+}
+
+table {
+    border: 1px solid black;
+}
+table.main {
+    margin-top: 30px;
 }
 
 table th {
@@ -34,9 +126,10 @@ table th {
     margin: 0;
 }
 
-table.main, table.legend { width: 100%; }
+table { width: 100%; }
+
+#legend ul { margin: 2px 0; }
 
-table.legend ul { margin: 2px 0; }
 
 tr.even { background-color: #fff8f8; }
 tr.odd { background-color: #f8e8e8; }


Reply via email to