UseMod Wiki: Tarquin/SampleTemplate

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head lang="en">
	<title>%windowtitle%</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
	<link rel="stylesheet" type="text/css" media="screen"
		href="%url%template-default.css">
	<link rel="stylesheet" type="text/css" media="screen"
		href="%contentstyles%">
	<link rel="stylesheet" type="text/css" media="screen"
		href="%url%stylebase.structural.css">
	<!--[if IE 6]>
			<style>
			/* dirty hack for IE6. */
			#quickbar {
				position: absolute;
				}
			</style>
	<![endif]-->
  <link rel="start" href="http://wiki.beyondunreal.com/">
  <link rel="glossary"  href="http://wiki.beyondunreal.com/wiki/Terminology">
  <link rel="help"  href="http://wiki.beyondunreal.com/wiki/Using_The_Wiki">
</head>
<body class="default">
<div id="scrolling"><!-- contains all except the fixed sidebar -->
<div id="topbar"  class="bar">
	<div class="righthalf">
		<form class="inline" method="post" action="/wiki" enctype="application/x-www-form-urlencoded"><input type="text" name="search"  size="20" /> <input type="submit" name="search" value="search" /></form>
	</div>
	<div class="lefthalf">
		<script type="text/javascript"><!--
			menuAlignRight = false;
		//--></script>
		<span>%toc%</span> | %home% | %recent% | %prefs%
	</div>
</div>

<div id="content"><!-- contains the title and article -->
	<h1 class='pagetitle'>%title%</h1>
	%content%
</div>

<div id="footer" class="bar">
	<p>%footer%
	</p>
	<p>%quip%</p>
</div>
</div><!-- close of "scrolling" div -->

<div id="quickbar">
	<div id="logo"><a href="http://wiki.beyondunreal.com/"><img src="%logo%" width="143" height="100" border="0"></a>
		</div>
	<div class="qbsitename">
		<p>The Unreal Engine Documentation Site</p>
	</div>
	%sidebar%
</div>

</body></html>

CSS

body { margin: 0px; padding: 0px; }
/* special text */
h1.pagetitle {
	font-family:Arial, Helvetica, sans-serif;
	font-size:2.25em;
	margin:0em;
	padding:0em;
	margin-bottom:0.25em;
	font-size:1.75em;
	}
h1.pagetitle a {
	text-decoration:none;
	color:#609;
	}
h1.pagetitle a:hover {
	color:#f04;
	}
/* set colour for: top bar links; quickbar links; QuickNav text */	
#topbar span , #topbar a , #quickbar a {
	color:#00a;
	text-decoration:none;
	}
#topbar span:hover , #topbar a:hover , #quickbar a:hover {
	color:#c08;
	text-decoration:underline;
	}
/* ******************************************* structural */
#scrolling {
	/* container div for all scrolling content 
	-- that is, everything except the sidebar 
	this is just to set the left margin (= quickbar width) in only one place */
	margin-left: 9em; /* !! QB WIDTH */
}

/* ======================== HEADER BAR */
div.bar {
	/* sets colour for both header and footer */
	background:#eee;
	padding: 0.5em;
	}
#topbar {
	padding-top:0.25em;
	min-height:18px;
	}
#topbar div.lefthalf {
	text-align:left;
	}
#topbar div.righthalf {
	float:right;
	}
#topbar form.inline { display: inline; padding:1px;
	}
	
/* ======================== FOOTER */
#footer {
	text-align:center;
	}
 
/* ======================== CONTENT */
#content {
	padding: 0.5em;
	}
/* ======================== SIDEBAR */
#quickbar {
	width: 9em; /* !! QB WIDTH */
	top: 0px;	left: 0px;	
	height:100%;
	padding: 0em;
	overflow:hidden;
	background:#CFE7FF;
	}
/* hack zone for position:fixed */
#quickbar {
	position: absolute; /* all */
	position/* */:/**/fixed;
	position: /**/fixed;
	}
#quickbar p {
	margin: 0em;
	padding:0em;
	}
#logo {
	position:relative;
	margin:0px;
	padding:0px;
	width:143px;
	margin-top: 5px;
	margin-bottom: 5px;
	}
/* hack zone for logo centering */
#logo {
	/* these break Opera 6 */
	left: 50%;
	margin-left: -72px;
	}
/* be nice to Opera... um, maybe not. */
html>body #logo {
	left: 0px;
	margin-left: 0px;
	}
/* the Owen hack -- http://www.albin.net/CSS/OwenHack.html */
head:first-child+body #logo {
	left: 50%;
	margin-left: -72px;
}
	
#quickbar div.qbsitename {
	text-align:center;
	line-height:1em;
	padding-bottom:0.5em;
	}
#quickbar div.qbsitename h1 {
	margin: 0em;
	padding:0em;
	font-size:1.125em;
	font-weight:bold;
	color:#800;
	}
#quickbar div.qbsitename p {
	font-size:0.85em;
	line-height:1em;
	color:#c03;
	}
#quickbar .fontsizer {
	padding:1px;
	font-size:0.6em;
}
#quickbar div.qbsection {
	margin: 0em;
	padding: 0.5em;
	border-top: 1px solid #fff;
	font-size:0.9em;
	}