[library-web/new-website-style: 19/24] recreated platform overview table with a <table>

[Frederic Peters <fpeters src gnome org>]

commit 0849d2bc77af3bca92fe32b8a1dfc506b7555bf8
Author: Frédéric Péters <fpeters 0d be>
Date:   Sun Mar 20 11:12:54 2011 +0100

    recreated platform overview table with a <table>

 data/skin/lgo2010.css     |   61 ++++++++++++------
 data/xslt/dev_indexes.xsl |  151 +++++++++++++++++++--------------------------
 2 files changed, 104 insertions(+), 108 deletions(-)
---
diff --git a/data/skin/lgo2010.css b/data/skin/lgo2010.css
index f327d3f..06a980f 100644
--- a/data/skin/lgo2010.css
+++ b/data/skin/lgo2010.css
@@ -293,35 +293,24 @@ span.citem {
 	text-align:		center
 }
 
-
-
-.user-interface, .core, .system-integration, .communication, .multimedia, .data-storage, .utilities, .desktop-integration  {
-  background: #888a85;
-  -moz-border-radius: 5px;
-  color: #2e3436;
-  margin-bottom: 10px;
-}
-
-.multimedia, .data-storage, .communication {
-  height: 180px;
-}
-
-.core {
-  height: 72px;
-}
-
-.platform-overview a {
+#platform-overview a {
   background: #babdb6;
   display: inline-block;
   padding: 5px 10px;
   -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
   text-decoration: none;
   color: #000;
   margin: 5px;
-  width: 80px;
+  width: 65px;
 }
 
-.platform-overview p {
+#platform-overview a:hover {
+    box-shadow: 0 1px 2px #0489d7, 0 1px rgba(255, 255, 255, 0.4) inset;
+    color: #0489d7;
+}
+
+#platform-overview p {
   padding: 0;
   margin: 0;
   padding-left: 5px;
@@ -329,3 +318,35 @@ span.citem {
   padding-bottom: 0;
   font-size: 10px;
 }
+
+#api-doc-box {
+	float: right;
+	width: 205px;
+	margin: 0;
+}
+
+#api-doc-box input {
+	width: 190px;
+}
+
+#api-doc-box h2 {
+	font-size: 20px;
+}
+
+table#platform-overview {
+	width: 700px;
+	table-layout: fixed;
+}
+
+table#platform-overview th {
+	width: 14%;
+}
+
+table#platform-overview td {
+  background: #888a85;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
+  color: #2e3436;
+  margin-bottom: 10px;
+  border: 2px solid white;
+}
diff --git a/data/xslt/dev_indexes.xsl b/data/xslt/dev_indexes.xsl
index 055a5c6..e063856 100644
--- a/data/xslt/dev_indexes.xsl
+++ b/data/xslt/dev_indexes.xsl
@@ -723,114 +723,89 @@ div.body-sidebar { width: 100%; }
 <h2>Getting Started</h2>
 <p>Welcome to GNOME. Getting started is easy - install our dev tools and take a look at a tutorial.</p>
 
-<h3>Get ready for GNOME development</h3>
+<h2>Get ready for GNOME development</h2>
 <a href="" class="action_button">Download GNOME dev tools.</a>
-</div>
-<div class="grid_4 subtle_box">
-
-
-	  <h2>API Documentation</h2>
-	  <p><form role="search" method="get" id="searchform" action="/symbols/"><div>
-<label class="hidden" for="q">Search:
-                        </label><input type="text" value="" name="q" id="s" placeholder="Search"></input>
-</div></form>
-<script type="text/javascript">
-$('#s').autocomplete('http://nezt.local/symbols/lookup/',
-        { minChars:3, matchSubset:1, matchContains:1, cacheLength:10,
-          selectOnly:1, rowsLimit:25 });
-              </script>
-</p>
-	  <ul>
-	  	<li><a href="gtk3/stable/">GTK+</a> C, C++, Python, Javascript, Vala</li>
-	  	<li><a href="clutter/stable/">Clutter</a> C, C++, Python, Javascript, Vala</li>
-	  	<li><a href="http://www.gstreamer.net/documentation/";>GStreamer</a> C, C++, Python, Javascript, Vala</li>
-	  	<li><a href="more">More...</a></li>
-	  </ul>
-
-
-
-</div><!-- grid_4 -->
-
-<div class="clear"></div>
-
 
 <h2>Platform Overview</h2>
-<!-- The platform overview goes here -->
-<div class="container_24 platform-overview">
-<div class="grid_9">
-<div class="user-interface">
+<table id="platform-overview">
+<tr>
+ <td colspan="3" rowspan="3" class="user-interface">
 <p>User Interface</p>
-<a href="gtk3/stable/">GTK+</a>
-<a href="cairo/stable/">Cairo</a>
-<a href="clutter/stable/">Clutter</a>
-<a href="atk/stable/">ATK</a>
-<a href="pango/stable/">Pango</a>
-<a href="http://webkitgtk.org/reference/";>Webkit</a>
-</div>
-
-<div class="core">
-<p>Core</p>
-<a href="gio/stable/">GIO</a>
-<a href="glib/stable/">Glib</a>
-<a href="gobject/stable/">GObject</a>
-</div>
+<a href="gtk3/stable/">GTK+</a><a href="cairo/stable/">Cairo</a><a href="clutter/stable/">Clutter</a>
+<a href="atk/stable/">ATK</a><a href="pango/stable/">Pango</a><a href="http://webkitgtk.org/reference/";>Webkit</a>
+ </td>
 
-</div>
-
-<div class="multimedia grid_3">
+ <td colspan="1" rowspan="5" class="multimedia">
 <p>Multimedia</p>
-<a href="http://www.gstreamer.net/documentation/";>GStreamer</a>
-<a href="libcanberra/stable/">Canberra</a>
-<a href="#">Pulseaudio</a>
-</div>
+<a href="http://www.gstreamer.net/documentation/";>GStreamer</a><a href="libcanberra/stable/">Canberra</a><a href="#">Pulseaudio</a>
+ </td>
 
-<div class="communication grid_3">
+ <td colspan="1" rowspan="5" class="communication">
 <p>Communication</p>
-<a href="#">Telepathy</a>
-<a href="#">Avahi</a>
-<a href="#">GUPnP</a>
-</div>
+<a href="#">Telepathy</a><a href="#">Avahi</a><a href="#">GUPnP</a>
+ </td>
 
-<div class="data-storage grid_3">
+ <td colspan="1" rowspan="5" class="data-storage">
 <p>Data Storage</p>
-<a href="#">EDS</a>
-<a href="libgda/stable/">GDA</a>
-<a href="#">Tracker</a>
-</div>
+<a href="#">EDS</a><a href="libgda/stable/">GDA</a><a href="#">Tracker</a>
+ </td>
 
-<div class="utilities grid_3">
+ <td colspan="1" rowspan="5" class="utilities">
 <p>Utilities</p>
-<a href="#">Champlain</a>
-<a href="#">Enchant</a>
-<a href="#">Poppler</a>
-<a href="poppler/stable/">GeoClue</a>
-</div>
+<a href="#">Champlain</a><a href="#">Enchant</a><a href="#">Poppler</a><a href="poppler/stable/">GeoClue</a>
+ </td>
 
-</div> <!-- container_24 -->
-<div class="clear"></div>
+ </tr>
 
-<div class="container_24 platform-overview">
+<tr> </tr>
+<tr> </tr>
+ <tr>
+   <td colspan="3" rowspan="2" class="core">
+<p>Core</p>
+<a href="gio/stable/">GIO</a><a href="glib/stable/">Glib</a><a href="gobject/stable/">GObject</a>
+   </td>
+ </tr>
 
-<div class="system-integration grid_9">
-<p>System Integration</p>
-<a href="#">upower</a>
-<a href="#">udisks</a>
-<a href="#">policykit</a>
-</div>
+<tr> </tr>
 
-<div class="desktop-integration grid_12">
+ <tr>
+   <td colspan="3" rowspan="2" class="system-integration">
+<p>System Integration</p>
+<a href="#">upower</a><a href="#">udisks</a><a href="#">policykit</a>
+   </td>
+   <td colspan="4" rowspan="2" class="desktop-integration">
 <p>Desktop Integration</p>
-<a href="#">packagekit</a>
-<a href="#">libnotify</a>
-<a href="#">seahorse</a>
-</div>
+<a href="#">packagekit</a><a href="#">libnotify</a><a href="#">seahorse</a>
+   </td>
+ </tr>
+</table>
 
-</div><!--container_24 -->
-<!-- end of platform overview -->
+</div>
+</div>
 
+<div id="api-doc-box" class="grid_4 subtle_box">
+<h2>API Documentation</h2>
+<form role="search" method="get" id="searchform" action="/symbols/"><div>
+<label class="hidden" for="q">Search:
+                        </label><input type="text" value="" name="q" id="s" placeholder="Search" />
+</div></form>
+<script type="text/javascript">
+$('#s').autocomplete('http://nezt.local/symbols/lookup/',
+        { minChars:3, matchSubset:1, matchContains:1, cacheLength:10,
+          selectOnly:1, rowsLimit:25 });
+</script>
+<ul>
+<li>
+<a href="gtk3/stable/">GTK+</a> C, C++, Python, Javascript, Vala</li>
+<li>
+<a href="clutter/stable/">Clutter</a> C, C++, Python, Javascript, Vala</li>
+<li>
+<a href="http://www.gstreamer.net/documentation/";>GStreamer</a> C, C++, Python, Javascript, Vala</li>
+<li><a href="more">More...</a></li>
+</ul>
+</div>
 
-</div><div class="row"></div></div>
-	
+</div>
 
 	  <div id="footer_art" class="default">Â </div>
           </div>