HTML5 and jQuery

20 files changed, 529 insertions, 446 deletions

diff --git a/gentoobrowse/.p2config b/gentoobrowse/.p2config
index 9adbd90..40c426a 100644
--- a/gentoobrowse/.p2config
+++ b/gentoobrowse/.p2config
@@ -1,2 +1,5 @@
+sessionModule = couchsession
+session.couchdb.baseurl = http://firebrand:5984/p2sessions/
+session.couchdb.baseurl = http://defiant:5984/p2sessions/
 errorcontenttype=text/xml-xslt
 errortransformstyle=xslt/error.xslt
diff --git a/gentoobrowse/css/screen.css b/gentoobrowse/css/screen.css
index e277be9..d8470b6 100644
--- a/gentoobrowse/css/screen.css
+++ b/gentoobrowse/css/screen.css
@@ -1,21 +1,33 @@
 html {
-	background: white url('/images/glogo-small.png') no-repeat 10px 5px;
-	font-family: cursive, sans-serif;
+	background: white url('/images/simple-blue-wave.jpg') no-repeat left top;
+  font-family: 'Open Sans', sans-serif;
+	padding: 0;
+	margin: 0;
 }
 body {
+	background: transparent url('/images/glogo-small.png') no-repeat 0 0;
 	font-size: 11px;
+	margin: 10px 40px 10px 10px;
+	padding: 0;
 }
-h1 {
+header h1 {
+	font-family: 'Salsa', cursive, sans-serif;
 	font-style: italic;
 	font-weight: bold;
 	font-size: 45px;
-	margin: 20px 160px 5px;
+	margin: 0px 160px 10px;
+	padding-top: 10px;
 	border-bottom: 1px solid black;
 	height: 66px;
 }
-.tabs {
+nav ul {
 	font-size: 15px;
 	text-align: center;
+	margin: 10px;
+}
+nav li {
+	padding: 0px 7px;
+	display: inline;
 }
 h2 {
 	padding: 0;
@@ -28,26 +40,101 @@ p.summary {
 p.error {
 	color: red;
 }
-
-.colLeft {
-	vertical-align: top;
+a, a:visited {
+	color: blue;
+}
+nav {
+	clear: both;
+}
+#news {
 	width: 130px;
 	padding: 5px;
+	float: left;
+}
+#news ul {
+	padding-left: 15px;
 }
-.content {
-	vertical-align: top;
-	border-left: 3px dotted black;
+#content {
 	padding: 5px;
 }
+footer {
+	clear: both;
+	padding: 20px;
+}
+article#content {
+	margin-left: 150px;
+}
 
-.newebuilds th {
-	margin: 0;
+/* New ebuilds */
+article#content section.newebuilds {
+	float: left;
+}
+section.newebuilds {
 	width: 33%;
 }
+.newebuilds h3 {
+	display: block;
+	text-align: center;
+	margin: 2px;
+}
 .newebuilds ul {
-	margin: 0;
+	margin: 0px;
+	padding: 0 0 0 15px;
+}
+.newebuilds p {
+	margin: 0 0 2px 0;
+}
+.synctime {
+	font-size: 9px;
+	padding-left: 6px;
+}
+
+/* Popup forms */
+form#login {
+	width: 200px;
+	margin-left: -100px;
+	display: none;
+}
+form#search {
+	width: 300px;
+	margin-left: -150px;
+	display: none;
+}
+form.popup {
+	position: fixed;
+	background-color: #ededff;
+	border: 1px solid #a0a0ff;
+	padding: 20px;
+	left: 50%;
+	top: 25%;
+	box-shadow: 8px 8px 8px #bbb;
+	border-radius: 10px;
+}
+form.popup h1 {
+	font-size: 14px;
+	margin: 0px;
+	padding-bottom: 3px;
+}
+form.popup input.submit {
+	width: 80px;
+	border: 1px solid #a0a0ff;
+	color: #3030aa;
+	background-color: #ddddff;
+	margin-bottom: 0px;
+	float: right;
+	border-radius: 3px;
+	margin-left: 10px;
+}
+form.popup input {
+	display: block;
+	border: 1px solid #aaaaff;
+	border-radius: 3px;
+	width: 100%;
+	margin-bottom: 4px;
+	padding: 2px;
 }
 
+/* Package details */
 .ver {
 	font-size: large;
 	padding: 5px 20px;
@@ -57,84 +144,91 @@ p.error {
 	color: red;
 	font-weight: bold;
 }
-.urls {
+#urls {
 	float: right;
 	margin: 8px 30px;
 }
-.urls a {
+#urls a {
 	display: block;
 }
 
-div.trademark, div.poweredby {
+p.disclaimer, ul.poweredby {
 	text-align: center;
 	color: gray;
 	font-size: 9px;
 	margin: 10px;
+	display: block;
+}
+ul.poweredby li {
+	display: inline;
+	padding: 0px 3px;
 }
 .warning {
 	color: red;
 	font-weight: bold;
 }
-form.generalForm table {
-	width: 500px;
-	background-color: #ddddff;
-	border: 1px solid #aaaaff;
-}
-
-form.generalForm td input {
-	border: 1px solid #aaaaff;
-	width: 98%;
-}
 .tracked {
 	font-weight: bold;
 }
-.syncdate {
-	font-size: larger;
-}
-.synctime {
-	font-size: smaller;
-}
 #dotrack, #dountrack {
 	font-size: 8px;
 	margin: 0 10px;
 }
 
-.tabstrip {
+/* Package detail tabs */
+ul.ui-tabs-nav {
+	padding-left: 16px;
 	white-space: nowrap;
+	margin-bottom: 0;
 }
-.tabbox {
-	margin: 0px;
+ul.ui-tabs-nav li a {
+	text-decoration: none;
+	padding: 0 8px 0 10px;
 }
-.tabvisible, .tabhidden {
-	padding: 10px 20px;
-	margin: 0px;
+ul.ui-tabs-nav li {
+	font-weight: normal;
+	background-color: white;
+	display: inline;
+	padding: 0;
+	font-size: 14px;
 	border: 1px solid grey;
+	margin: 0 2px;
+	border-top-left-radius: 10px;
+	border-top-right-radius: 10px;
+}
+ul.ui-tabs-nav li.ui-tabs-selected {
+	border-bottom: 1px solid #eeeeee;
 	background: #eeeeee;
-	-webkit-border-radius: 5px;
-	-moz-border-radius: 5px;
-	border-radius: 5px;
 }
-.tabvisible {
+section.ui-tabs-panel {
 	display: block;
+	padding: 10px 20px;
+	border: 1px solid grey;
+	box-shadow: 8px 8px 8px #bbb;
+	margin: 0 10px;
+	background: #eeeeee;
+	border-radius: 5px;
 }
-.tabhidden {
+section.ui-tabs-hide {
 	display: none;
 }
-.tabhandle a {
+
+/* Search results accordian */
+h3.ui-accordion-header {
+	margin: 2px;
+	box-shadow: none;
+	outline: none;
+}
+h3.ui-accordion-header a {
 	text-decoration: none;
-	padding: 0 8px 0 10px;
+	color: black;
 }
-.tabhandle {
-	font-weight: normal;
-	display: inline;
-	padding: 0 0;
-	font-size: 14px;
+.accordionpane {
+	padding: 10px;
 	border: 1px solid grey;
-	margin: 0 2px;
-	-webkit-border-top-left-radius: 10px;
-	-webkit-border-top-right-radius: 10px;
-	-moz-border-radius-topleft: 10px;
-	-moz-border-radius-topright: 10px;
-	border-top-left-radius: 10px;
-	border-top-right-radius: 10px;
+	box-shadow: 8px 8px 8px #bbb;
+	margin-top: 10px;
+	margin-right: 30px;
+	background: #eeeeee;
+	border-radius: 5px;
 }
diff --git a/gentoobrowse/datasources/poweredBy.txt b/gentoobrowse/datasources/poweredBy.txt
index 0e3bead..c71422d 100644
--- a/gentoobrowse/datasources/poweredBy.txt
+++ b/gentoobrowse/datasources/poweredBy.txt
@@ -3,5 +3,6 @@ PostgreSQL|http://www.postgresql.org/
 Apache|http://httpd.apache.org/
 FastCGI|http://www.fastcgi.com/drupal/
 XSLT|http://www.w3.org/TR/xslt/
+jQuery|http://jquery.com/
 Boost|http://www.boost.org/
 Project2|http://project2.randomdan.homeip.net/
diff --git a/gentoobrowse/images/simple-blue-wave.jpg b/gentoobrowse/images/simple-blue-wave.jpg
new file mode 100644
index 0000000..8366a2e
--- /dev/null
+++ b/gentoobrowse/images/simple-blue-wave.jpg
diff --git a/gentoobrowse/js/js.js b/gentoobrowse/js/js.js
new file mode 100644
index 0000000..35dc3de
--- /dev/null
+++ b/gentoobrowse/js/js.js
@@ -0,0 +1,9 @@
+function hideForm(f) {
+	$(f).fadeOut('slow');
+	return false;
+}
+function toggleForm(f) {
+	$('form.popup').not(f).fadeOut('slow');
+	$(f).fadeToggle('slow');
+	return false;
+}
diff --git a/gentoobrowse/js/tabs.js b/gentoobrowse/js/tabs.js
deleted file mode 100644
index c1cd1ae..0000000
--- a/gentoobrowse/js/tabs.js
+++ /dev/null
@@ -1,10 +0,0 @@
-function showTab(name)
-{
-	var children = document.getElementById('tabcontainer').childNodes;
-	for(var c = 0; c != children.length; c++) {
-		if (children[c].className == 'tabvisible') {
-			children[c].className = 'tabhidden';
-		}
-	}
-	document.getElementById(name).className = 'tabvisible';
-}
diff --git a/gentoobrowse/present/search.xml b/gentoobrowse/present/search.xml
index 5a96f2a..9f2f0df 100644
--- a/gentoobrowse/present/search.xml
+++ b/gentoobrowse/present/search.xml
@@ -4,17 +4,6 @@
 	<xi:include href="../views/search.xml" />
 	<xi:include href="../views/webcommon.xml" />
 
-	<project2:if name="haveNoBCriteria" mode="and">
-		<project2:regexcheck name="criteriaLength" regex="^$">
-			<apply-to source="param" name="bcriteria" default="" />
-		</project2:regexcheck>
-		<project2:rawview name="a-packages">
-			<form caption="Package Search" submit="Search" action="/search" method="get" autofocus="criteria" order="1">
-				<input type="text" caption="Criteria" name="criteria"
-						xslvalue="/gentoo/project2:params/project2:param[@name='criteria']/@value" />
-			</form>
-		</project2:rawview>
-	</project2:if>
 	<project2:if name="haveCriteria" mode="and">
 		<project2:regexcheck name="criteriaLength" regex=".+">
 			<apply-to source="param" name="criteria" default="" />
@@ -24,26 +13,9 @@
 				<criteria source="param" name="criteria" default="" />
 			</parameters>
 		</project2:view>
-	</project2:if>
-
-	<project2:if name="haveNoCriteria" mode="and">
-		<project2:regexcheck name="criteriaLength" regex="^$">
-			<apply-to source="param" name="criteria" default="" />
-		</project2:regexcheck>
-		<project2:rawview name="b-bugs">
-			<form caption="Bug Search" submit="Search" action="/search" method="get" order="2">
-				<input type="text" caption="Criteria" name="bcriteria"
-						xslvalue="/gentoo/project2:params/project2:param[@name='bcriteria']/@value" />
-			</form>
-		</project2:rawview>
-	</project2:if>
-	<project2:if name="haveBCriteria" mode="and">
-		<project2:regexcheck name="criteriaLength" regex=".+">
-			<apply-to source="param" name="bcriteria" default="" />
-		</project2:regexcheck>
 		<project2:view name="bugSearchResults" source="bugSearch" rootname="bugSearchResults" recordname="bug" filter="freeText">
 			<parameters>
-				<criteria source="param" name="bcriteria" default="" />
+				<criteria source="param" name="criteria" default="" />
 			</parameters>
 		</project2:view>
 	</project2:if>
diff --git a/gentoobrowse/present/signup.xml b/gentoobrowse/present/signup.xml
index d818016..fcf3d8c 100644
--- a/gentoobrowse/present/signup.xml
+++ b/gentoobrowse/present/signup.xml
@@ -5,7 +5,7 @@
 	<project2:rawview>
 		<form caption="Signup" submit="Signup" action="/dosignup" method="post">
 			<input type="text" name="username" caption="User name" auto="off" />
-			<input type="text" name="email" caption="Email address" auto="off" />
+			<input type="email" name="email" caption="Email address" auto="off" />
 			<input type="text" name="realname" caption="Real name" auto="off" />
 			<input type="password" name="password" caption="Password" auto="off" />
 		</form>
diff --git a/gentoobrowse/xslt/atomebuilds.xslt b/gentoobrowse/xslt/atomebuilds.xslt
index bd18e12..aa7e911 100644
--- a/gentoobrowse/xslt/atomebuilds.xslt
+++ b/gentoobrowse/xslt/atomebuilds.xslt
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8" ?>
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2" >
-  <xsl:output  encoding="utf-8" method="xml" media-type="text/xml" indent="yes"/>
+  <xsl:output  encoding="utf-8" method="html" media-type="text/xml" indent="yes"/>
   <xsl:template match="/gentoo">
 	<rss version="2.0">
 		<xsl:apply-templates match="/gentoo/newebuilds" />
diff --git a/gentoobrowse/xslt/base.xslt b/gentoobrowse/xslt/base.xslt
index 7f02a74..34f2dad 100644
--- a/gentoobrowse/xslt/base.xslt
+++ b/gentoobrowse/xslt/base.xslt
@@ -1,71 +1,94 @@
 <?xml version="1.0" encoding="UTF-8" ?>
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2" >
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template match="/*">
-	<html>
-		<head>
-			<link rel="stylesheet" href="/css/screen.css" type="text/css" />
-			<link rel="shortcut icon" href="/images/glogo-small.png" type="image/png" />
-			<link rel="start" href="/" />
-			<link rel="search" href="/search" />
-			<meta http-equiv="content-language" content="en" />
-			<xsl:call-template name="head" />
-			<script type="text/javascript" src="/js/googletracking.js" />
-		</head>
-		<body>
-			<h1>Gentoo Browse</h1>
-			<div class="tabs">
-				<a href="/">Home</a> |
-				<a href="/categories">Browse</a> |
-				<a href="/popular">Popular</a> |
-				<a href="/search" rel="nofollow">Search</a> |
-				<xsl:if test="count(/gentoo/project2:session/project2:var[@name='loggedInUserID']) = 0">
-					<a href="/login" rel="nofollow">Login</a>
-				</xsl:if>
-				<xsl:if test="count(/gentoo/project2:session/project2:var[@name='loggedInUserID']) &gt; 0">
-					<a href="/accountHome" rel="nofollow">My Account</a>
-				</xsl:if>
-			</div>
-			<table width="100%">
-				<tr>
-					<td class="colLeft">
-						<h2>News</h2>
-					</td>
-					<td class="content">
-						<xsl:call-template name="content" />
-					</td>
-				</tr>
-			</table>
-			<div class="trademark">
-				This website is not an official Gentoo website.
-				The name "Gentoo" and the "g" logo are trademarks of the Gentoo Foundation, Inc.
-			</div>
-			<div class="poweredby">
-				Powered by |
-				<xsl:for-each select="/gentoo/power/by">
-					<a>
-						<xsl:attribute name="href"><xsl:value-of select="url" /></xsl:attribute>
-						<xsl:value-of select="name" />
-					</a> |
-				</xsl:for-each>
-				Many thanks.
-			</div>
-		</body>
-	</html>
+		<xsl:text disable-output-escaping="yes">&lt;!DOCTYPE html&gt;&#10;</xsl:text>
+		<html>
+			<head>
+				<link rel="stylesheet" href="/css/screen.css" type="text/css" />
+				<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Salsa" type="text/css" />
+        <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,700" type="text/css" />
+				<link rel="shortcut icon" href="/images/glogo-small.png" type="image/png" />
+				<link rel="start" href="/" />
+				<link rel="search" href="/search" />
+				<meta http-equiv="content-language" content="en" />
+				<script src="/js/js.js" />
+				<script src="/js/googletracking.js" />
+				<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" />
+				<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" />
+				<xsl:call-template name="head" />
+			</head>
+			<body>
+				<header>
+					<h1>Gentoo Browse</h1>
+				</header>
+				<nav>
+					<ul>
+						<li><a href="/">Home</a></li>
+						<li><a href="/categories">Browse</a></li>
+						<li><a href="/popular">Popular</a></li>
+						<li><a href="JavaScript: void(0);" onclick="toggleForm('#search');" rel="nofollow">Search</a></li>
+						<xsl:if test="count(/gentoo/project2:session/project2:var[@name='loggedInUserID']) = 0">
+							<li><a href="JavaScript: void(0);" onclick="toggleForm('#login');" rel="nofollow">Login</a></li>
+						</xsl:if>
+						<xsl:if test="count(/gentoo/project2:session/project2:var[@name='loggedInUserID']) &gt; 0">
+							<li><a href="/accountHome" rel="nofollow">My Account</a></li>
+						</xsl:if>
+					</ul>
+					<form id="search" class="popup" action="/search" method="get">
+						<h1>Site search</h1>
+						<input type="search" name="criteria" placeholder="Search criteria" required="required" autofocus="autofocus">
+							<xsl:attribute name="value"><xsl:value-of select="/gentoo/project2:params/project2:param[@name='criteria']/@value" /></xsl:attribute>
+						</input>
+						<input type="submit" value="Search" class="submit" />
+						<input type="submit" value="Cancel" class="submit" onclick="return hideForm('#search');" />
+					</form>
+					<form id="login" class="popup" action="/dologin" method="post">
+						<h1>Login</h1>
+						<input type="text" name="username" placeholder="Username" required="required" autofocus="autofocus" />
+						<input type="password" name="password" placeholder="Password" required="required" />
+						<input type="submit" value="Login" class="submit" />
+						<input type="submit" value="Cancel" class="submit" onclick="return hideForm('#login');" />
+					</form>
+				</nav>
+				<aside id="news">
+					<h2>News</h2>
+					<ul>
+						<li>Gone all HTML5 and jQuery etc etc</li>
+					</ul>
+				</aside>
+				<article id="content">
+					<xsl:call-template name="content" />
+				</article>
+				<footer>
+					<p class="disclaimer">This website is not an official Gentoo website. The name "Gentoo" and the "g" logo are trademarks of the Gentoo Foundation, Inc.</p>
+					<ul class="poweredby">
+						<li>Powered by</li>
+						<xsl:for-each select="/gentoo/power/by">
+							<li>
+								<a>
+									<xsl:attribute name="href"><xsl:value-of select="url" /></xsl:attribute>
+									<xsl:value-of select="name" />
+								</a>
+							</li>
+						</xsl:for-each>
+						<li>Many thanks.</li>
+					</ul>
+				</footer>
+			</body>
+		</html>
   </xsl:template>
   <xsl:template name="head">
-	<title>Gentoo Browse</title>
+		<title>Gentoo Browse</title>
   </xsl:template>
   <xsl:template match="package">
   	<li>
-		<a>
-			<xsl:attribute name="href">/package/<xsl:value-of select="catname" />/<xsl:value-of select="pkgname" /></xsl:attribute>
-			<xsl:attribute name="title"><xsl:value-of select="description" /></xsl:attribute>
-			<xsl:value-of select="catname" />/<xsl:value-of select="pkgname" />
-		</a> - <xsl:value-of select="description" />
-	</li>
+			<a>
+				<xsl:attribute name="href">/package/<xsl:value-of select="catname" />/<xsl:value-of select="pkgname" /></xsl:attribute>
+				<xsl:attribute name="title"><xsl:value-of select="description" /></xsl:attribute>
+				<xsl:value-of select="catname" />/<xsl:value-of select="pkgname" />
+			</a> - <xsl:value-of select="description" />
+		</li>
   </xsl:template>
 </xsl:stylesheet>
diff --git a/gentoobrowse/xslt/categories.xslt b/gentoobrowse/xslt/categories.xslt
index 95ebd9e..f791237 100644
--- a/gentoobrowse/xslt/categories.xslt
+++ b/gentoobrowse/xslt/categories.xslt
@@ -2,31 +2,28 @@
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2" >
 	<xsl:import href="base.xslt" />
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template name="head">
-	<title>Category List - Gentoo Browse</title>
-	<meta name="description" content="Complete list of Gentoo Linux package categories" />
+		<title>Category List - Gentoo Browse</title>
+		<meta name="description" content="Complete list of Gentoo Linux package categories" />
   </xsl:template>
   <xsl:template name="content">
-	<xsl:apply-templates select="/gentoo/categories" />
+		<xsl:apply-templates select="/gentoo/categories" />
   </xsl:template>
 	<xsl:template match="/gentoo/categories">
-  	<h2>Package categories</h2>
-	<ul>
-		<xsl:apply-templates select="/gentoo/categories/category" />
-	</ul>
+		<h2>Package categories</h2>
+		<section id="categories">
+			<ul>
+				<xsl:apply-templates select="/gentoo/categories/category" />
+			</ul>
+		</section>
   </xsl:template>
   <xsl:template match="/gentoo/categories/category">
   	<li>
-		<a>
-			<xsl:attribute name="href">/category/<xsl:value-of select="catname" /></xsl:attribute>
-			<xsl:value-of select="catname" />
-		</a>
-		-
-		<xsl:value-of select="summary" />
-		(<xsl:value-of select="packages" /> packages)
-	</li>
+			<a>
+				<xsl:attribute name="href">/category/<xsl:value-of select="catname" /></xsl:attribute>
+				<xsl:value-of select="catname" />
+			</a> - <xsl:value-of select="summary" /> (<xsl:value-of select="packages" /> packages)
+		</li>
   </xsl:template>
 </xsl:stylesheet>
diff --git a/gentoobrowse/xslt/category.xslt b/gentoobrowse/xslt/category.xslt
index e6fd355..16ec138 100644
--- a/gentoobrowse/xslt/category.xslt
+++ b/gentoobrowse/xslt/category.xslt
@@ -2,23 +2,23 @@
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2" >
 	<xsl:import href="base.xslt" />
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template name="head">
-	<title><xsl:value-of select="/gentoo/project2:uriElems/project2:uriElem[2]" /> Package List - Gentoo Browse</title>
-	<meta name="description">
-		<xsl:attribute name="content">Complete list of Gentoo Linux packages in the <xsl:value-of select="/gentoo/project2:uriElems/project2:uriElem[2]" /> category</xsl:attribute>
-	</meta>
-	<link rel="contents" href="/categories" />
+		<title><xsl:value-of select="/gentoo/project2:uriElems/project2:uriElem[2]" /> Package List - Gentoo Browse</title>
+		<meta name="description">
+			<xsl:attribute name="content">Complete list of Gentoo Linux packages in the <xsl:value-of select="/gentoo/project2:uriElems/project2:uriElem[2]" /> category</xsl:attribute>
+		</meta>
+		<link rel="contents" href="/categories" />
   </xsl:template>
   <xsl:template name="content">
-	<xsl:apply-templates select="/gentoo/packages" />
+		<xsl:apply-templates select="/gentoo/packages" />
   </xsl:template>
   <xsl:template match="/gentoo/packages">
   	<h2>Packages</h2>
-	<ul>
-		<xsl:apply-templates select="/gentoo/packages/package" />
-	</ul>
+		<section id="packages">
+			<ul>
+				<xsl:apply-templates select="/gentoo/packages/package" />
+			</ul>
+		</section>
   </xsl:template>
 </xsl:stylesheet>
diff --git a/gentoobrowse/xslt/error.xslt b/gentoobrowse/xslt/error.xslt
index ac4a316..57dab84 100644
--- a/gentoobrowse/xslt/error.xslt
+++ b/gentoobrowse/xslt/error.xslt
@@ -2,9 +2,7 @@
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 		xmlns:project2="http://project2.randomdan.homeip.net">
 	<xsl:import href="base.xslt" />
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template name="head">
 	<title>Argh! Error! - Gentoo Browse</title>
 	<meta name="google-site-verification" content="f2uqzTiSxj7gbzzRzf4nOCB3WfQuWV9Knfjb9ju69jU" />
diff --git a/gentoobrowse/xslt/form.xslt b/gentoobrowse/xslt/form.xslt
index 7bcdc1f..5a415cc 100644
--- a/gentoobrowse/xslt/form.xslt
+++ b/gentoobrowse/xslt/form.xslt
@@ -2,9 +2,7 @@
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2"
 	xmlns:dyn="http://exslt.org/dynamic" extension-element-prefixes="dyn">
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template match="para">
   	<xsl:copy-of select="*" />
   </xsl:template>
diff --git a/gentoobrowse/xslt/herd.xslt b/gentoobrowse/xslt/herd.xslt
index 7e02a9c..02ede25 100644
--- a/gentoobrowse/xslt/herd.xslt
+++ b/gentoobrowse/xslt/herd.xslt
@@ -2,9 +2,7 @@
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2" >
 	<xsl:import href="base.xslt" />
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template name="head">
 	<title>Packages in the <xsl:value-of select="/gentoo/project2:uriElems/project2:uriElem[2]" /> herd - Gentoo Browse</title>
 	<meta name="description">
diff --git a/gentoobrowse/xslt/home.xslt b/gentoobrowse/xslt/home.xslt
index 00d4497..b40b44b 100644
--- a/gentoobrowse/xslt/home.xslt
+++ b/gentoobrowse/xslt/home.xslt
@@ -1,38 +1,31 @@
 <?xml version="1.0" encoding="UTF-8" ?>
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml">
 	<xsl:import href="base.xslt" />
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template name="head">
-	<title>Newest ebuilds - Gentoo Browse</title>
-	<meta name="google-site-verification" content="f2uqzTiSxj7gbzzRzf4nOCB3WfQuWV9Knfjb9ju69jU" />
-	<meta name="description" content="List of newest released package ebuilds for Gentoo Linux" />
+		<title>Newest ebuilds - Gentoo Browse</title>
+		<meta name="google-site-verification" content="f2uqzTiSxj7gbzzRzf4nOCB3WfQuWV9Knfjb9ju69jU" />
+		<meta name="description" content="List of newest released package ebuilds for Gentoo Linux" />
   </xsl:template>
   <xsl:template name="content">
-	<xsl:apply-templates select="/gentoo/newebuilds" />
+		<xsl:apply-templates select="/gentoo/newebuilds" />
   </xsl:template>
   <xsl:template match="/gentoo/newebuilds">
-  	<h2>Newest ebuilds</h2>
-	<table class="newebuilds">
-		<tr>
-			<xsl:for-each select="/gentoo/syncs/sync">
-				<th>
-					<span class="syncdate"><xsl:value-of select="substring-before(synctime, 'T')" /></span>
-					<span class="synctime"><xsl:value-of select="substring-after(synctime, 'T')" /></span>
-				</th>
-			</xsl:for-each>
-		</tr>
-		<tr>
-			<xsl:for-each select="/gentoo/syncs/sync">
-				<td valign="top">
-					<ul>
-						<xsl:apply-templates select="/gentoo/newebuilds/ebuild[sync = current()/synctime]" />
-					</ul>
-				</td>
-			</xsl:for-each>
-		</tr>
-	</table>
+		<h2>Newest ebuilds</h2>
+		<xsl:for-each select="/gentoo/syncs/sync">
+			<section class="newebuilds">
+				<h3>
+					<time>
+						<xsl:attribute name="datetime"><xsl:value-of select="synctime" /></xsl:attribute>
+						<span class="syncdate"><xsl:value-of select="synctime/@date" /></span>
+						<span class="synctime"><xsl:value-of select="synctime/@time" /></span>
+					</time>
+				</h3>
+				<ul>
+					<xsl:apply-templates select="/gentoo/newebuilds/ebuild[sync = current()/synctime]" />
+				</ul>
+			</section>
+		</xsl:for-each>
   </xsl:template>
   <xsl:template match="/gentoo/newebuilds/ebuild">
   	<li>
@@ -46,8 +39,7 @@
 			</a>
 			v<xsl:value-of select="version" />
 			<xsl:if test="position() = last() or following-sibling::ebuild[1]/packageid != packageid or following-sibling::ebuild[1]/sync != sync">
-				<br/>
-				<xsl:value-of select="description" />
+				<p><xsl:value-of select="description" /></p>
 			</xsl:if>
 		</li>
   </xsl:template>
diff --git a/gentoobrowse/xslt/login.xslt b/gentoobrowse/xslt/login.xslt
index 8f9d4d1..979dda5 100644
--- a/gentoobrowse/xslt/login.xslt
+++ b/gentoobrowse/xslt/login.xslt
@@ -4,9 +4,7 @@
 	xmlns:dyn="http://exslt.org/dynamic" extension-element-prefixes="dyn">
 	<xsl:import href="base.xslt" />
 	<xsl:import href="form.xslt" />
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template name="content">
   	<xsl:apply-templates select="form|para|trackedebuilds" />
   </xsl:template>
diff --git a/gentoobrowse/xslt/package.xslt b/gentoobrowse/xslt/package.xslt
index 9f3df4a..e1b02fc 100644
--- a/gentoobrowse/xslt/package.xslt
+++ b/gentoobrowse/xslt/package.xslt
@@ -2,218 +2,235 @@
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2" >
 	<xsl:import href="base.xslt" />
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template name="head">
 		<title><xsl:value-of select="/gentoo/summary/package/pkgname" /> (in <xsl:value-of select="/gentoo/summary/package/catname" />) Package Details - Gentoo Browse</title>
 		<meta name="description">
 			<xsl:attribute name="content">Gentoo Linux package details for <xsl:value-of select="/gentoo/summary/package/catname" />/<xsl:value-of select="/gentoo/summary/package/pkgname" />: <xsl:value-of select="/gentoo/summary/package/description" /></xsl:attribute>
 		</meta>
-  	<script language="JavaScript" type="text/javascript" src="/js/tabs.js" />
+		<script type="text/javascript">
+			$(function() {
+				$("section#pkgdetails").tabs();
+			})
+		</script>
 		<xsl:if test="count(/gentoo/project2:session/project2:var[@name='loggedInUserID']) != 0">
 			<script type="text/javascript" src="/js/pkgtracking.js" />
 		</xsl:if>
   </xsl:template>
   <xsl:template name="content">
-	<xsl:apply-templates select="/gentoo/summary/package" />
-  </xsl:template>
-  <xsl:template match="/gentoo/summary/package/versions">
-  	<div class="tabvisible" id="versions">
-		<ul>
-			<xsl:apply-templates select="version" />
-		</ul>
-	</div>
-  </xsl:template>
-  <xsl:template match="/gentoo/summary/package/versions/version">
-  	<li>
-		<span class="ver">v<xsl:value-of select="version" /></span>
-		(<i>Modified :</i> <xsl:value-of select="moddate" /><xsl:text> </xsl:text>
-		<i>Slot :</i> <xsl:value-of select="slot" />
-		<xsl:if test="license"><xsl:text> </xsl:text>
-			<i>License :</i> <xsl:value-of select="license" />
-		</xsl:if>)
-		<xsl:if test="count(../../maskstatus/mask[ebuildid=current()/ebuildid]) &gt; 0">
-			<span class="masked">(Masked
-				<xsl:for-each select="../../maskstatus/mask[ebuildid=current()/ebuildid]">
-					<xsl:value-of select="setno" />
-				</xsl:for-each>)
-			</span>
-		</xsl:if>
-		<ul>
-			<li>
-				<xsl:for-each select="../../versionArchs/arch[ebuildid=current()/ebuildid]">
-					<xsl:sort select="arch" />
-					<xsl:value-of select="arch" />
-					<xsl:text> </xsl:text>
-				</xsl:for-each>
-			</li>
-			<li>
-				<xsl:for-each select="../../versionUses/use[ebuildid=current()/ebuildid]">
-					<xsl:sort select="use" />
-					<xsl:value-of select="use" />
-					<xsl:text> </xsl:text>
-				</xsl:for-each>
-			</li>
-		</ul>
-	</li>
+		<xsl:apply-templates select="/gentoo/summary/package" />
   </xsl:template>
   <xsl:template match="/gentoo/summary/package">
-	<xsl:apply-templates select="packageUrls" />
-  	<h2>
-		<a>
-			<xsl:attribute name="href">/category/<xsl:value-of select="catname" /></xsl:attribute>
-			<xsl:attribute name="title">Other packages in the <xsl:value-of select="catname" /> category</xsl:attribute>
-			<xsl:value-of select="catname" />
-		</a>/<xsl:value-of select="pkgname" />
-		<xsl:if test="herd != 'no-herd'">
-			- <small>(<a>
-					<xsl:attribute name="href">/herd/<xsl:value-of select="herd" /></xsl:attribute>
-					<xsl:attribute name="title">Other packages in the <xsl:value-of select="herd" /> herd</xsl:attribute>
-					<xsl:value-of select="herd" />
-				</a>)</small>
-		</xsl:if>
-		<xsl:if test="count(/gentoo/project2:session/project2:var[@name='loggedInUserID']) != 0">
-			<a id="dotrack">
-				<xsl:attribute name="href">javascript:track(<xsl:value-of select="/gentoo/summary/package/packageid" />);</xsl:attribute>
-				<xsl:if test="count(tracks/track) = 1">
-					<xsl:attribute name="style">display: none</xsl:attribute>
-				</xsl:if>(Track)</a>
-			<a id="dountrack">
-				<xsl:attribute name="href">javascript:untrack(<xsl:value-of select="/gentoo/summary/package/packageid" />);</xsl:attribute>
-				<xsl:if test="count(tracks/track) = 0">
-					<xsl:attribute name="style">display: none</xsl:attribute>
-				</xsl:if>(Untrack)</a>
-		</xsl:if>
-	</h2>
-	<h3>
-		<xsl:value-of select="description" />
-	</h3>
-	<xsl:if test="summary != description and summary != ''">
-		<p class="summary">
-			<xsl:value-of select="summary" />
-		</p>
-	</xsl:if>
-	<div class="tabstrip">
-		<!-- handles -->
-		<h3 class="tabhandle"><a href="javascript:showTab('versions');">Versions</a></h3>
-		<xsl:if test="count(/gentoo/summary/package/deps/package) &gt; 0">
-			<h3 class="tabhandle"><a href="javascript:showTab('deps');">Dependencies</a></h3>
-		</xsl:if>
-		<xsl:if test="count(/gentoo/summary/package/rdeps/package) &gt; 0">
-			<h3 class="tabhandle"><a href="javascript:showTab('rdeps');">Runtime dependencies</a></h3>
-		</xsl:if>
-		<xsl:if test="count(/gentoo/summary/package/depees/package) &gt; 0">
-			<h3 class="tabhandle"><a href="javascript:showTab('depees');">Dependees</a></h3>
-		</xsl:if>
-		<xsl:if test="count(/gentoo/summary/package/packageBugs/bug) &gt; 0">
-			<h3 class="tabhandle"><a href="javascript:showTab('bugs');">Open bugs</a></h3>
-		</xsl:if>
-		<xsl:if test="count(/gentoo/summary/package/maskdetails/mask) &gt; 0">
-			<h3 class="tabhandle"><a href="javascript:showTab('masks');">Masks</a></h3>
-		</xsl:if>
-		<xsl:if test="count(/gentoo/summary/package/changelog/entry) &gt; 0">
-			<h3 class="tabhandle"><a href="javascript:showTab('changelog');">Change log</a></h3>
-		</xsl:if>
-	</div>
-	<div class="tabbox" id="tabcontainer">
-		<!-- content -->
-		<xsl:apply-templates select="versions" />
-		<xsl:apply-templates select="deps" />
-		<xsl:apply-templates select="rdeps" />
-		<xsl:apply-templates select="depees" />
-		<xsl:apply-templates select="packageBugs" />
-		<xsl:apply-templates select="maskdetails" />
-		<xsl:apply-templates select="changelog" />
-		<div style="clear: both" />
-	</div>
+		<xsl:apply-templates select="packageUrls" />
+		<section id="pkgsummary">
+			<h2>
+				<a>
+					<xsl:attribute name="href">/category/<xsl:value-of select="catname" /></xsl:attribute>
+					<xsl:attribute name="title">Other packages in the <xsl:value-of select="catname" /> category</xsl:attribute>
+					<xsl:value-of select="catname" />
+				</a>/<xsl:value-of select="pkgname" />
+				<xsl:if test="herd != 'no-herd' and herd != ''">
+					<small><xsl:text> </xsl:text>(<a>
+						<xsl:attribute name="href">/herd/<xsl:value-of select="herd" /></xsl:attribute>
+						<xsl:attribute name="title">Other packages in the <xsl:value-of select="herd" /> herd</xsl:attribute>
+						<xsl:value-of select="herd" />
+					</a>)</small>
+				</xsl:if>
+				<xsl:if test="count(/gentoo/project2:session/project2:var[@name='loggedInUserID']) != 0">
+					<a id="dotrack">
+						<xsl:attribute name="href">javascript:track(<xsl:value-of select="/gentoo/summary/package/packageid" />);</xsl:attribute>
+						<xsl:if test="count(tracks/track) = 1">
+							<xsl:attribute name="style">display: none</xsl:attribute>
+						</xsl:if>(Track)</a>
+					<a id="dountrack">
+						<xsl:attribute name="href">javascript:untrack(<xsl:value-of select="/gentoo/summary/package/packageid" />);</xsl:attribute>
+						<xsl:if test="count(tracks/track) = 0">
+							<xsl:attribute name="style">display: none</xsl:attribute>
+						</xsl:if>(Untrack)</a>
+				</xsl:if>
+			</h2>
+			<h3>
+				<xsl:value-of select="description" />
+			</h3>
+			<xsl:if test="summary != description and summary != ''">
+				<p class="summary">
+					<xsl:value-of select="summary" />
+				</p>
+			</xsl:if>
+		</section>
+		<section id="pkgdetails">
+			<!-- handles -->
+			<ul>
+				<li><a href="#versions">Versions</a></li>
+				<xsl:if test="count(/gentoo/summary/package/deps/package) &gt; 0">
+					<li><a href="#deps">Dependencies</a></li>
+				</xsl:if>
+				<xsl:if test="count(/gentoo/summary/package/rdeps/package) &gt; 0">
+					<li><a href="#rdeps">Runtime dependencies</a></li>
+				</xsl:if>
+				<xsl:if test="count(/gentoo/summary/package/depees/package) &gt; 0">
+					<li><a href="#depees">Dependees</a></li>
+				</xsl:if>
+				<xsl:if test="count(/gentoo/summary/package/packageBugs/bug) &gt; 0">
+					<li><a href="#bugs">Open bugs</a></li>
+				</xsl:if>
+				<xsl:if test="count(/gentoo/summary/package/maskdetails/mask) &gt; 0">
+					<li><a href="#masks">Masks</a></li>
+				</xsl:if>
+				<xsl:if test="count(/gentoo/summary/package/changelog/entry) &gt; 0">
+					<li><a href="#changelog">Change log</a></li>
+				</xsl:if>
+			</ul>
+			<!-- content -->
+			<xsl:apply-templates select="versions" />
+			<xsl:apply-templates select="deps" />
+			<xsl:apply-templates select="rdeps" />
+			<xsl:apply-templates select="depees" />
+			<xsl:apply-templates select="packageBugs" />
+			<xsl:apply-templates select="maskdetails" />
+			<xsl:apply-templates select="changelog" />
+		</section>
   </xsl:template>
 
   <!-- Package URLs -->
   <xsl:template match="/gentoo/summary/package/packageUrls">
-  	<div class="urls">
-	  <xsl:for-each select="url">
-		<a>
-			<xsl:attribute name="href"><xsl:value-of select="url" /></xsl:attribute>
-			<xsl:value-of select="url" />
-		</a>
-	  </xsl:for-each>
-	</div>
+  	<section id="urls">
+			<xsl:for-each select="url">
+			<a>
+				<xsl:attribute name="href"><xsl:value-of select="url" /></xsl:attribute>
+				<xsl:value-of select="url" />
+			</a>
+			</xsl:for-each>
+		</section>
+  </xsl:template>
+
+	<!-- Versions -->
+  <xsl:template match="/gentoo/summary/package/versions">
+  	<section id="versions">
+			<ul>
+				<xsl:apply-templates select="version" />
+			</ul>
+		</section>
+  </xsl:template>
+  <xsl:template match="/gentoo/summary/package/versions/version">
+  	<li>
+			<span class="ver">v<xsl:value-of select="version" /></span>
+			(<i>Modified :</i><time><xsl:value-of select="moddate" /></time><xsl:text> </xsl:text>
+			<i>Slot :</i> <xsl:value-of select="slot" />
+			<xsl:if test="license"><xsl:text> </xsl:text>
+				<i>License :</i> <xsl:value-of select="license" />
+			</xsl:if>)
+			<xsl:if test="count(../../maskstatus/mask[ebuildid=current()/ebuildid]) &gt; 0">
+				<span class="masked">(Masked
+					<xsl:for-each select="../../maskstatus/mask[ebuildid=current()/ebuildid]">
+						<xsl:value-of select="setno" />
+					</xsl:for-each>)
+				</span>
+			</xsl:if>
+			<ul>
+				<li>
+					<xsl:for-each select="../../versionArchs/arch[ebuildid=current()/ebuildid]">
+						<xsl:sort select="arch" />
+						<xsl:value-of select="arch" />
+						<xsl:text> </xsl:text>
+					</xsl:for-each>
+				</li>
+				<li>
+					<xsl:for-each select="../../versionUses/use[ebuildid=current()/ebuildid]">
+						<xsl:sort select="use" />
+						<xsl:value-of select="use" />
+						<xsl:text> </xsl:text>
+					</xsl:for-each>
+				</li>
+			</ul>
+		</li>
   </xsl:template>
 
   <!-- Package bugs -->
   <xsl:template match="/gentoo/summary/package/packageBugs">
   	<xsl:if test="count(/gentoo/summary/package/packageBugs/bug) &gt; 0">
-		<ul class="tabhidden" id="bugs">
-		  <xsl:for-each select="bug">
-			<li>
-				<a>
-					<xsl:attribute name="href">http://bugs.gentoo.org/<xsl:value-of select="bugid" /></xsl:attribute>
-					<xsl:attribute name="title"><xsl:value-of select="summary" /></xsl:attribute>
-					<xsl:value-of select="bugid" />
-				</a>
-				- <xsl:value-of select="summary" />
-			</li>
-		  </xsl:for-each>
-		</ul>
-	</xsl:if>
+			<section id="bugs">
+				<ul>
+					<xsl:for-each select="bug">
+						<li>
+							<a>
+								<xsl:attribute name="href">http://bugs.gentoo.org/<xsl:value-of select="bugid" /></xsl:attribute>
+								<xsl:attribute name="title"><xsl:value-of select="summary" /></xsl:attribute>
+								<xsl:value-of select="bugid" />
+							</a>
+							- <xsl:value-of select="summary" />
+						</li>
+					</xsl:for-each>
+				</ul>
+			</section>
+		</xsl:if>
   </xsl:template>
 
   <!-- Change log -->
   <xsl:template match="/gentoo/summary/package/changelog">
   	<xsl:if test="count(/gentoo/summary/package/changelog/entry) &gt; 0">
-		<ul class="tabhidden" id="changelog">
-		  <xsl:for-each select="entry">
-		  	<li><xsl:value-of select="substring-before(date, 'T')" /></li>
-			<li>
-			  <ul>
-				<li><xsl:value-of select="person" /> &lt;<xsl:value-of select="email" />&gt;</li>
-				<li><xsl:value-of select="comment" /></li>
-			  </ul>
-			</li>
-		  </xsl:for-each>
-		</ul>
-	</xsl:if>
+			<section id="changelog">
+				<ul>
+					<xsl:for-each select="entry">
+						<li><time><xsl:value-of select="date/@date" /></time></li>
+						<li>
+							<ul>
+								<li><xsl:value-of select="person" /> &lt;<xsl:value-of select="email" />&gt;</li>
+								<li><xsl:value-of select="comment" /></li>
+							</ul>
+						</li>
+					</xsl:for-each>
+				</ul>
+			</section>
+		</xsl:if>
   </xsl:template>
 
   <!-- Package dependencies -->
   <xsl:template match="/gentoo/summary/package/deps">
   	<xsl:if test="count(/gentoo/summary/package/deps/package) &gt; 0">
-		<ul class="tabhidden" id="deps">
-			<xsl:apply-templates match="/gentoo/summary/package/deps/package" />
-		</ul>
-	</xsl:if>
+			<section id="deps">
+				<ul>
+					<xsl:apply-templates match="/gentoo/summary/package/deps/package" />
+				</ul>
+			</section>
+		</xsl:if>
   </xsl:template>
 
   <!-- Package runtime dependencies -->
   <xsl:template match="/gentoo/summary/package/rdeps">
   	<xsl:if test="count(/gentoo/summary/package/rdeps/package) &gt; 0">
-		<ul class="tabhidden" id="rdeps">
-			<xsl:apply-templates match="/gentoo/summary/package/rdeps/package" />
-		</ul>
-	</xsl:if>
+			<section id="rdeps">
+				<ul>
+					<xsl:apply-templates match="/gentoo/summary/package/rdeps/package" />
+				</ul>
+			</section>
+		</xsl:if>
   </xsl:template>
 
   <!-- Package dependees -->
   <xsl:template match="/gentoo/summary/package/depees">
   	<xsl:if test="count(/gentoo/summary/package/depees/package) &gt; 0">
-		<ul class="tabhidden" id="depees">
-			<xsl:apply-templates match="/gentoo/summary/package/depees/package" />
-		</ul>
-	</xsl:if>
+			<section id="depees">
+				<ul>
+					<xsl:apply-templates match="/gentoo/summary/package/depees/package" />
+				</ul>
+			</section>
+		</xsl:if>
   </xsl:template>
 
   <!-- Package mask details -->
   <xsl:template match="/gentoo/summary/package/maskdetails">
   	<xsl:if test="count(/gentoo/summary/package/maskdetails/mask) &gt; 0">
-		<ol class="tabhidden" id="masks">
-			<xsl:for-each select="mask">
-				<li>
-					<xsl:value-of select="person" /> (<i>Added: </i><xsl:value-of select="dateadded" />)
-					<ul><li><xsl:value-of select="message" /></li></ul>
-				</li>
-			</xsl:for-each>
-		</ol>
-	</xsl:if>
+			<section id="masks">
+				<ol>
+					<xsl:for-each select="mask">
+						<li>
+							<xsl:value-of select="person" /> (<i>Added: </i><xsl:value-of select="dateadded" />)
+							<ul><li><xsl:value-of select="message" /></li></ul>
+						</li>
+					</xsl:for-each>
+				</ol>
+			</section>
+		</xsl:if>
   </xsl:template>
 </xsl:stylesheet>
diff --git a/gentoobrowse/xslt/popular.xslt b/gentoobrowse/xslt/popular.xslt
index 53b88ef..06d0011 100644
--- a/gentoobrowse/xslt/popular.xslt
+++ b/gentoobrowse/xslt/popular.xslt
@@ -2,22 +2,22 @@
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2" >
 	<xsl:import href="base.xslt" />
-  <xsl:output  encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
   <xsl:template name="head">
-	<title>Popular Package List - Gentoo Browse</title>
-	<meta name="description">
-		<xsl:attribute name="content">List of Gentoo Linux packages track by users</xsl:attribute>
-	</meta>
+		<title>Popular Package List - Gentoo Browse</title>
+		<meta name="description">
+			<xsl:attribute name="content">List of Gentoo Linux packages track by users</xsl:attribute>
+		</meta>
   </xsl:template>
   <xsl:template name="content">
-	<xsl:apply-templates select="/gentoo/packages" />
+		<xsl:apply-templates select="/gentoo/packages" />
   </xsl:template>
   <xsl:template match="/gentoo/packages">
   	<h2>Popular Packages</h2>
-	<ul>
-		<xsl:apply-templates select="/gentoo/packages/package" />
-	</ul>
+		<section id="popular">
+			<ul>
+				<xsl:apply-templates select="/gentoo/packages/package" />
+			</ul>
+		</section>
   </xsl:template>
 </xsl:stylesheet>
diff --git a/gentoobrowse/xslt/search.xslt b/gentoobrowse/xslt/search.xslt
index cd5cb6a..feb3bfa 100644
--- a/gentoobrowse/xslt/search.xslt
+++ b/gentoobrowse/xslt/search.xslt
@@ -2,50 +2,43 @@
 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:project2="http://project2.randomdan.homeip.net" exclude-result-prefixes="project2" >
   <xsl:import href="base.xslt" />
-  <xsl:import href="form.xslt" />
-  <xsl:output encoding="utf-8"  method="xml" media-type="text/html" indent="yes"
-    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
-    doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" />
+  <xsl:output encoding="utf-8" method="html" media-type="text/html" indent="yes" />
+  <xsl:template name="head">
+		<title>Search results for &quot;<xsl:value-of select="/gentoo/project2:params/project2:param[@name='criteria']/@value"/>&quot; - Gentoo Browse</title>
+		<script type="text/javascript">
+			$(function() {
+				$("article#content").accordion({ autoHeight: false, header: 'h3', collapsible: true });
+			})
+		</script>
+  </xsl:template>
   <xsl:template name="content">
-  	<xsl:apply-templates select="/gentoo/form">
-			<xsl:sort select="@order" />
-  	</xsl:apply-templates>
+		<h2>Search results for &quot;<xsl:value-of select="/gentoo/project2:params/project2:param[@name='criteria']/@value"/>&quot;</h2>
 		<xsl:apply-templates select="/gentoo/searchResults" />
 		<xsl:apply-templates select="/gentoo/bugSearchResults" />
   </xsl:template>
   <xsl:template match="/gentoo/searchResults">
-		<xsl:if test="/gentoo/project2:params/project2:param[@name='criteria']/@value != ''">
-			<xsl:if test="count(/gentoo/searchResults/package) &gt; 0">
-				<h2>Search Results for &quot;<xsl:value-of select="/gentoo/project2:params/project2:param[@name='criteria']/@value"/>&quot;</h2>
-				<ul>
-					<xsl:apply-templates select="/gentoo/searchResults/package" />
-				</ul>
-			</xsl:if>
-			<xsl:if test="count(/gentoo/searchResults/package) = 0">
-				<p class="warning">Nothing found</p>
-			</xsl:if>
-		</xsl:if>
+		<section id="packages" class="accordionpane">
+			<h3><a href="#">Packages</a> (<xsl:value-of select="count(package)" />)</h3>
+			<ul>
+				<xsl:apply-templates select="package" />
+			</ul>
+		</section>
   </xsl:template>
   <xsl:template match="/gentoo/bugSearchResults">
-		<xsl:if test="/gentoo/project2:params/project2:param[@name='bcriteria']/@value != ''">
-			<xsl:if test="count(/gentoo/bugSearchResults/bug) &gt; 0">
-				<h2>Search Results for &quot;<xsl:value-of select="/gentoo/project2:params/project2:param[@name='bcriteria']/@value"/>&quot;</h2>
-				<ul>
-					<xsl:for-each select="/gentoo/bugSearchResults/bug">
-						<li>
-							<a>
-								<xsl:attribute name="href">http://bugs.gentoo.org/<xsl:value-of select="bugid" /></xsl:attribute>
-								<xsl:attribute name="title"><xsl:value-of select="summary" /></xsl:attribute>
-								<xsl:value-of select="bugid" />
-							</a>
-							- <xsl:value-of select="summary" />
-						</li>
-					</xsl:for-each>
-				</ul>
-			</xsl:if>
-			<xsl:if test="count(/gentoo/bugSearchResults/bug) = 0">
-				<p class="warning">Nothing found</p>
-			</xsl:if>
-		</xsl:if>
+		<section id="bugs" class="accordionpane">
+			<h3><a href="#">Bugs</a> (<xsl:value-of select="count(bug)" />)</h3>
+			<ul>
+				<xsl:for-each select="bug">
+					<li>
+						<a>
+							<xsl:attribute name="href">http://bugs.gentoo.org/<xsl:value-of select="bugid" /></xsl:attribute>
+							<xsl:attribute name="title"><xsl:value-of select="summary" /></xsl:attribute>
+							<xsl:value-of select="bugid" />
+						</a>
+						- <xsl:value-of select="summary" />
+					</li>
+				</xsl:for-each>
+			</ul>
+		</section>
   </xsl:template>
 </xsl:stylesheet>