simple default theme as a starting point

git-svn-id: https://code.elgg.org/elgg/trunk@714 36083f99-b078-4883-b0ff-0f9b5a30f544

4 files changed, 215 insertions, 257 deletions

diff --git a/views/default/css.php b/views/default/css.php
index cb626e115..c27ec5da2 100644
--- a/views/default/css.php
+++ b/views/default/css.php
@@ -16,132 +16,103 @@
 

 ?>

 

-/*

-    Default Elgg CSS

-*/

-

-/*

-  Globals

-*/

+<?php

+  include("reset.css");

+?>

 

-* {

-	/* border: 0; */

-	margin: 0;

-	padding: 0;

-}

 

 body {

-    background:#ffffff; /* url(<?php echo $vars['url']; ?>/_graphics/header.gif) repeat-x; */

-	color:#697C83;

-	font-family:'Trebuchet MS','Lucida Grande', Arial, sans-serif;

 	text-align:left;

 	margin:0 auto;

 	padding:0;

-	font-size: 80%;

-	line-height:1.6em;

-}

-

-p {

-	color:#555;

-	margin:0 0 10px 0;

+	background: #42afdc url(<?php echo $vars['url']; ?>/_graphics/pagebackground.gif) repeat-x;

+	font: 75%/170% Arial, Helvetica, sans-serif;

+	padding: 0px;

+	margin: 0px;

+	color: #333333;

 }

 

+/* ***************************************

+	DEFAULT BASE STYLES

+*************************************** */

 a {

-	text-decoration:none;

-	color:#336699;

+	color: #3399cc;

+	text-decoration: none;

+}

+a:visited {

+	color: #336699;

 }

-

 a:hover {

-	text-decoration:underline;

+	text-decoration: underline;

 }

-

-ol, ul {

-	color:#697C83;

+p {

+	margin: 0px 0px 15px;

 }

-

-h1 {

-	font-size:130%;

+img {

+	border: none;

 }

-

-h2, h3, h4, h5 {

-	font-size:100%;

+ul {

+	margin: 5px 0px 15px;

+	padding-left: 20px;

 }

-

-input { vertical-align:middle; }

-

-blockquote{

-	background: #EEE url(<?php echo $vars['url']; ?>/_graphics/blockquote.png) no-repeat bottom left;

-	padding: 10px;

-	padding-bottom: 40px;

-	margin: 1em;

+ul li {

+	margin: 0px;

 }

-

-/******* End of globals *************/

-

-/*

-	TABLES IN ELGG

-*/

-

-td {

-	border:1px solid #eee;

-	padding:0;

-	margin:0;

+ol {

+	margin: 5px 0px 15px;

+	padding-left: 20px;

 }

-

-td h4, h3, h5 {

-	padding:0;

-	margin:0;

+ul li {

+	margin: 0px;

+}

+form {

+	margin: 0px;

+	padding: 0px;

+}

+small {

+	font-size: 90%;

 }

 

-/******** end tables **************/

-

-/*

-	CONTAINER: WRAPS THE HEADER AND MAIN CONTENT AREA BELOW THE USER TOOLBAR

-*/

-

+/* CONTAINER: WRAPS THE HEADER AND MAIN CONTENT AREA BELOW THE USER TOOLBAR */

 div#container {

-	width:970px;

-	margin:0 auto;

-	padding:0;

+	/* width:90%; */

+	padding:0 40px 0 40px;

+	background: url(<?php echo $vars['url']; ?>/_graphics/pagebackground.jpg) no-repeat center top;

+	min-height: 600px;

 }

 

-/*

-	HEADER: THE HEADER INCLUDES THE LOGO AND SEARCH BAR

-*/

+/* ***************************************

+	HEADER

+*************************************** */

 

 div#header {

 	margin:0 0 10px 0;

-	padding:5px;

 	text-align:left;

 	position:relative;

-	background:#006699;

 	width:100%;

-	height:50px;

+	height:60px;

+	border-bottom:1px solid white;

 }

 

 div#header h1 {

-	font-size:20px;

-	padding:0;

-	margin:0;

+	font: 160%/100% "Lucida Grande", Arial, sans-serif;

+	padding:10px 0 0 0;

+	color:#ffffff;

 }

 

 div#header h2 {

-	font-size:16px;

-	padding:5px 0 0 0;

-	margin:0;

+	font: 150%/100% "Lucida Grande", Arial, sans-serif;

 	color:#ffffff;

 }

 

 div#header h1 a{

-	color:#fff;

-	/* font-family:Helvetica, "Myriad Web", Arial, sans-serif;*/

+	color:#ffffff;

 }

 

-/**** End header ****/

 

-/*

+/* ***************************************

   Topmenu

-*/

+*************************************** */

 

 #topmenu {

     position:absolute;

@@ -165,35 +136,29 @@ div#header h1 a{
 	float:right;

 }

 

-/**** end top menu ****/

-

-/*

+/* ***************************************

     sidebar menu

-*/

+*************************************** */

 

 #sidebar_menu {

 	width: 150px;

-	margin:0;

-	padding:0;

 	float: left;

-	background:#f5f5f5; /* url(<?php echo $vars['url']; ?>/_graphics/sidebar-top.gif) no-repeat top;*/

+	background: #ffffff;

 }

 

 #sidebar_right {

 	width:380px;

 	min-height: 380px;

 	float:right;

-	margin: 0;

-	padding: 0;

-	border-top:1px solid white;

+	border-top:1px solid black;

+	background: #ffffff;

 }

 

 #mainContent {

-    margin:0 0 0 160px;

-    width:810px;

-    min-height: 380px;

-    padding:0;

-    border-top:1px solid white;

+    margin:0 0 0 165px;

+    padding:10px 20px 20px 20px;

+    min-height: 480px;

+    background: #ffffff;

 }

 

 #login-box {

@@ -201,23 +166,21 @@ div#header h1 a{
     border:1px solid #ddd;

     width:300px;

     padding:10px;

+    background: #ffffff;

 }

 

-/*

+/* ***************************************

 	FOOTER

-*/

+*************************************** */

 

 div#footer {

 	clear: both;

 	position: relative;

 	font-size:1em;

-	height:26px;

-	margin:20px 0 0 0;

-	color:#174764;

+	height:40px;

+	margin:20px 40px 20px 40px;

 	font-weight:bold;

-	width:100%;

-	padding:3px 0 0 0;

-	background:url(<?php echo $vars['url']; ?>/_graphics/footer.gif) repeat-x;

+	background: #ffffff;

 }

 

 div#footer img {

@@ -242,43 +205,22 @@ div#footer a:link, div#footer a:visited {
 	text-align:right;

 }

 

-/*

+/* ***************************************

   System messages

-*/

+*************************************** */

 

 .messages {

     border:1px solid #D3322A;

     background:#F7DAD8;

     color:#000;

-    padding:3px 50px;

-    margin:20px 20px 10px 20px;

-}

-

-/*

-  Forms

-*/

-

-.input-text,

-.input-tags,

-.input-url,

-.input-textarea {

-	/* width: 600px;*/

-	width:95%;

-	font-weight: inherit;

-	font-style: inherit;

-	font-size: 100%;

-	line-height: 1.4;

-	font-family: inherit;

-	padding:5px;

+    padding:3px 10px 3px 10px;

+    margin:10px 0px 10px 0px;

 }

 

-.input-textarea {

-	height: 200px;

-}

 

-/* 

+/* ***************************************

 	elgg toolbar

-*/

+*************************************** */

 

 .elggtoolbar ul.drawers {

 	width: 150px;

@@ -298,149 +240,125 @@ div#footer a:link, div#footer a:visited {
 	padding: 3px 3px 3px 10px;

 }

 

+.elggtoolbar li {

+	background: #e4ecf5;

+}

+

 .elggtoolbar li a {

 	text-decoration: none;

-	color: #666;

+	color: #3399cc;

 	line-height:0.5em;

 }

 .elggtoolbar li a:hover {

 	text-decoration: underline;

+	color: #003366;

 }

 

 .elggtoolbar h2.drawer-handle {

 	margin: 0;

 	padding: 1px 1px 1px 10px;

-	background-color: #e5e5e5;

+	background-color: #ffffff;

+	border-bottom: 1px solid #0099cc;

 	cursor: pointer;

 	font-size: 100%;

 }

 

 .elggtoolbar h2.drawer-handle.open {

 	color:#ffffff;

-	background-color: #666666;

+	background-color: #003366;

+	border-bottom: 1px solid #003366;

 }

 

-/* 

-	rounded corner widget boxes

-*/	

-.ui-sortable { color:#222; margin:0; padding:0 10px 10px; }

-.ui-sortable h2 {color:#555; font-size:11px; margin:0; line-height:2; padding:0; }

 

-.ui-sortable-helper {

-	/* width:150px !important; */

-}

 

-.placeholder {

-	border:2px dashed #AAA;

-	margin-left:-12px;

+/* ***************************************

+	GENERAL FORM ELEMENTS

+*************************************** */

+label {

+	font-weight: bold;

+	color:#666;

+	font-size: 100%;

 }

-

-

-.sort {

-	margin:10px 0;

-	position:relative;

-	/* margin:0px auto;*/

-	z-index:1;

-	margin-left:12px; /* default, width of left corner */

-	margin-bottom:0.5em; /* spacing under box */

-}

-

-.sort h1 { 

-	color:#5d9ed6;

-	font-size:14px;

-	margin:0 43px 0 0; /* margin so edit buttons are not obscured */

-	cursor:move;

-	height:1.8em;

-	padding:8px 0 0 0;

-	position:relative;

+input {

+	font: 110% Arial, Helvetica, sans-serif;

+	width: 220px;

+	padding: 5px 3px 3px 7px;

+	border: 1px solid #cccccc;

+}

+textarea {

+	font: 110% Arial, Helvetica, sans-serif;

+	width: 480px;

+	height: 140px;

+	border: solid 1px #cccccc;

+	padding: 5px 3px 3px 7px;

+}

+.submit_button {

+	font: 12px/100% Arial, Helvetica, sans-serif;

+	color: #000000;

+	border: none;

+	width: 135px;

+	height: 25px;

+	padding-bottom: 6px;

+	margin:10px 0 10px 0;

+	cursor: pointer;

 }

-

-.sort .content,

-.sort .t,

-.sort .b,

-.sort .b div {

-	background:transparent url(<?php echo $vars['url']; ?>/_graphics/box.png) no-repeat top right;

-	_background-image:url(<?php echo $vars['url']; ?>/_graphics/box.gif); /* for ie 6 as can't use AlphaImageLoader due to div width/height not being known */

-    /* _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src='images/box.png', sizingMethod='crop'); */

+.submit_button:hover {

+	background: #e4ecf5;

 }

-

-.sort .content {

-	position:relative;

-	zoom:1;

-	_overflow-y:hidden;

-	padding:0 12px 0 0;

+textarea:focus, input[type="text"]:focus {

+	border: solid 1px #3b9acc;

+	background: #e4ecf5;

 }

 

-.sort .t {

-	/* top+left vertical slice */

-	position:absolute;

-	left:0px;

-	top:0px;

-	width:12px; /* top slice width */

-	margin-left:-12px;

-	height:100%;

-	_height:1600px; /* arbitrary long height, IE 6 */

-	background-position:top left;

+.input-text,

+.input-tags,

+.input-url,

+.input-textarea {

+	width:95%;

 }

 

-.sort .b {

-	/* bottom */

-	position:relative;

-	width:100%;

+.input-textarea {

+	height: 200px;

 }

 

-.sort .b,

-.sort .b div {

-	height:6px; /* height of bottom round */

-	font-size:1px;

-}

 

-.sort .b {

-	background-position:bottom right;

+/* ***************************************

+	MAIN CONTENT ELEMENTS

+*************************************** */

+#mainContent h1 {

+	color: #333333;

+	margin: 3px 0 2px;

+	padding-bottom: 4px;

+	font: normal 160%/100% "Lucida Grande", Arial, sans-serif;

+	border-bottom: dotted 1px #CCCCCC;

 }

-

-.sort .b div {

-	position:relative;

-	width:12px; /* bottom corner width */

-	margin-left:-12px;

-	background-position:bottom left;

+#mainContent h1 a, #mainContent h1 a:visited {

+	color: #333333;

+	text-decoration: none;

 }

-

-.sort p {

-	margin:0px;

-	padding:0.5em 0px 0.5em 0px;

-	line-height: 1.4em;

-	color:#555;

+#mainContent h1 a:hover {

+	color: #44a1d0;

+	text-decoration: none;

 }

-

-.editpanel {

-	background: #cccccc;

-	height: 100px;

-	display: none;

+#mainContent h2 {

+	color: #333333;

+	margin: 3px 0 2px;

+	padding-bottom: 4px;

+	font: normal 150%/100% "Lucida Grande", Arial, sans-serif;

+	border-bottom: dotted 1px #CCCCCC;

 }

-.button_editpanel {

-	z-index:1;

-	float:right;

-	/* background: url(images/ todo - add arrow graphic ) no-repeat right -50px; */

-	text-align: right;

-	padding: 10px 0 0 0;

-	cursor:pointer;

-	color: #cccccc;

+#mainContent h2 a, #mainContent h2 a:visited {

+	color: #333333;

 	text-decoration: none;

-	outline: none;

-	-moz-outline-style: none;

 }

-.active {

-	/* background-position: right 12px;*/

+#mainContent h2 a:hover {

+	color: #44a1d0;

+	text-decoration: none;

+}

+#mainContent h3 {

 	color: #666666;

+	margin: 5px 0px 5px;

+	font: bold 110%/110% "Lucida Grande", Arial, sans-serif;

 }

-a.togglepanel {

-	color: #cccccc;

-	cursor:pointer;

-	text-decoration:none;

-	float:right;

-	padding: 9px 0 0 8px;

-	font-weight: bold;

-	outline: none;

-	-moz-outline-style: none;

-}
\ No newline at end of file
+

+

diff --git a/views/default/navigation/toolbox.php b/views/default/navigation/toolbox.php
index 549efc5ad..2a96d34b2 100644
--- a/views/default/navigation/toolbox.php
+++ b/views/default/navigation/toolbox.php
@@ -37,7 +37,7 @@
 					foreach($item->children as $subitem) {

 ?>

 		<li>

-			<a href="<?php echo $subitem->value ?>"><?php echo $subitem->name; ?></a> |

+			<a href="<?php echo $subitem->value ?>"><?php echo $subitem->name; ?></a>

 		</li>

 <?php

 					}

@@ -65,15 +65,13 @@
 

 <script type="text/javascript">

 $(document).ready(function () {

-  $('li.drawer ul:not(:first)').hide(); // hide all ULs inside LI.drawer except the first one

-	$('h2.drawer-handle').click(function () {

-	// hide all the drawer contents

-	$('li.drawer ul:visible').slideUp().prev().removeClass('open');

-	// show the associated drawer content to 'this' (this is the current H2 element)

-	// since the drawer content is the next element after the clicked H2, we find

-	// it and show it using this:

-	$(this).addClass('open').next().slideDown();

-  });

+	$('li.drawer ul:not(:first)').hide();

+	

+	$('h2.drawer-handle').click(function () {	

+		$('li.drawer ul:visible').slideUp('medium').prev().removeClass('open');

+		$(this).addClass('open').next().slideDown('fast');

+	return false;

+	});

 });

 </script>

 

diff --git a/views/default/page_elements/header.php b/views/default/page_elements/header.php
index 56bc98101..e293b65f0 100644
--- a/views/default/page_elements/header.php
+++ b/views/default/page_elements/header.php
@@ -34,12 +34,7 @@
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

 		<title><?php echo $title; ?></title>

 		<!-- include links to jQuery here? -->

-		<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/jquery-1.2.4a.js"></script>

-		<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/ui.base.js"></script>

-		<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/ui.draggable.js"></script>

-		<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/ui.droppable.js"></script>

-		<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/ui.sortable.js"></script>

-		<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/init.js"></script>

+		<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/jquery-1.2.6.pack.js"></script>

 		<!-- include the default css file -->

 		<link rel="stylesheet" href="<?php echo $vars['url']; ?>_css/css.css" type="text/css" />

 	</head>

diff --git a/views/default/reset.css b/views/default/reset.css
new file mode 100755
index 000000000..0cf92e978
--- /dev/null
+++ b/views/default/reset.css
@@ -0,0 +1,47 @@
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, font, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	outline: 0;
+	font-weight: inherit;
+	font-style: inherit;
+	font-size: 100%;
+	font-family: inherit;
+	vertical-align: baseline;
+}
+/* remember to define focus styles! */
+:focus {
+	outline: 0;
+}
+body {
+	line-height: 1;
+	color: black;
+	background: white;
+}
+ol, ul {
+	list-style: none;
+}
+/* tables still need 'cellspacing="0"' in the markup */
+table {
+	border-collapse: separate;
+	border-spacing: 0;
+}
+caption, th, td {
+	text-align: left;
+	font-weight: normal;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+	content: "";
+}
+blockquote, q {
+	quotes: "" "";
+}
\ No newline at end of file