Made a thorough pass over the css. Included todo's throughout to track what still needs to be done.

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

12 files changed, 88 insertions, 15 deletions

diff --git a/views/default/css/elements/base.php b/views/default/css/elements/base.php
index 56a692c63..af050deac 100644
--- a/views/default/css/elements/base.php
+++ b/views/default/css/elements/base.php
@@ -6,6 +6,7 @@
 
 ?>
 
+<?php //@todo move to helpers.php ?>
 .clearfloat { clear:both; }
 
 /* Clearfix! */
@@ -23,6 +24,7 @@
 	margin:0 auto;
 }
 
+<?php //@todo move to core.php ?>
 /**
  * elgg-body fills the space available to it.
  * It uses hidden text to expand itself. The combination of auto width, overflow
diff --git a/views/default/css/elements/chrome.php b/views/default/css/elements/chrome.php
index 974dcc2e6..ef66fe9c8 100644
--- a/views/default/css/elements/chrome.php
+++ b/views/default/css/elements/chrome.php
@@ -77,7 +77,7 @@ h2 {
 	padding-bottom:5px;
 }
 
-
+<?php //@todo deprecated ?>
 .listing .icon { float: left; margin-right: 10px; }
 .listing .icon img { width: auto }
 .listing .info { display: table-cell; }
@@ -99,6 +99,8 @@ h2 {
 	-webkit-border-radius: 8px;
 	-moz-border-radius: 8px;
 }
+
+<?php //@todo deprecated ?>
 .margin-none {
 	margin:0;
 }
@@ -106,6 +108,7 @@ h2 {
 	margin-top:10px;
 }
 
+<?php //@todo lists.php ?>
 .elgg-tags {
 	background-image:url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png);
 	background-repeat: no-repeat;
@@ -132,21 +135,18 @@ h2 {
 .elgg-discover:hover .elgg-discoverable {
 	display: block;
 }
+
+<?php //@todo move to helpers.php ?>
+<?php //@todo convert to hyphen-separated ?>
 .elgg_hrt {
 	border-top: 1px solid #CCCCCC;
 }
 .elgg_hrb {
 	border-bottom: 1px solid #CCCCCC;
 }
-
-
-
 .elgg-border-plain {
 	border: 1px solid #eeeeee;
 }
-
-
-
 .elgg-rss {
 	float: right;
 }
diff --git a/views/default/css/elements/core.php b/views/default/css/elements/core.php
index 597313f0c..06bbb97c4 100644
--- a/views/default/css/elements/core.php
+++ b/views/default/css/elements/core.php
@@ -17,6 +17,8 @@
 	float: left;
 	margin-right: 5px;
 }
+
+<?php //@todo is this the best way to do it?  Perhaps elgg-image-alt would be cleaner... ?>
 .elgg-image-block .elgg-image.elgg-alt {
 	float: right;
 	margin-left: 5px;
@@ -25,7 +27,7 @@
 	List
 *************************************** */
 .elgg-list {
-    border-top: 1px dotted #CCCCCC;
+	border-top: 1px dotted #CCCCCC;
 	margin: 5px 0;
 	clear: both;
 }
@@ -63,6 +65,7 @@
 /* ***************************************
 	Modules
 *************************************** */
+
 .elgg-aside-module {
 	margin-bottom: 20px;
 }
@@ -71,6 +74,7 @@
 	margin-bottom: 5px;
 	padding-bottom: 5px;
 }
+
 .elgg-group-module {
 	margin-bottom: 20px;
 }
@@ -83,6 +87,7 @@
 .elgg-group-module .elgg-head h3 {
 	color: #333333;
 }
+
 .elgg-info-module {
 	margin-bottom: 20px;
 }
@@ -93,9 +98,12 @@
 	-webkit-border-radius: 3px;
 	-moz-border-radius: 3px;
 }
+
+<?php //@todo should not assume h3 ?>
 .elgg-info-module .elgg-head h3 {
 	color: #333333;
 }
+
 .elgg-popup-module {
 	background-color: white;
 	border: 1px solid #cccccc;
@@ -106,12 +114,15 @@
 	-webkit-box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.5);
 	-moz-box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.5);
 }
+
+<?php //@todo core.php? ?>
 .elgg-owner-block {
 	margin-bottom: 20px;
 }
 /* ***************************************
 	WIDGETS
 *************************************** */
+
 .elgg-widgets {
 	float: right;
 	min-height: 30px;
@@ -126,6 +137,8 @@
 	background: #dedede;
 	border: 2px solid #cccccc;
 }
+
+<?php //@todo location-dependent style: make an extension of elgg-gallery ?>
 .elgg-widgets-add-panel ul {
 	padding: 0;
 	margin: 0;
@@ -143,6 +156,8 @@
 .elgg-widgets-add-panel li a {
 	display: block;
 }
+
+<?php //@todo Convert to elgg-state-*? ?>
 .elgg-widget-available {
 	color: #333333;
 	cursor: pointer;
@@ -153,6 +168,8 @@
 .elgg-widget-unavailable {
 	color: #888888;
 }
+
+<?php //@todo extend elgg-module.  Still too many location-dependent/overly-qualified styles ?>
 .elgg-widget {
 	background-color: #dedede;
 	padding: 2px;
@@ -221,6 +238,7 @@ a.elgg-widget-edit-button:hover, a.elgg-widget-delete-button:hover {
 	margin-bottom: 15px;
 }
 
+<?php //@todo push into page.php ?>
 /* ***************************************
 	SYSTEM MESSAGES
 *************************************** */
@@ -247,6 +265,7 @@ a.elgg-widget-edit-button:hover, a.elgg-widget-delete-button:hover {
 	margin:0;
 }
 
+<?php //@todo move to icons.php ?>
 /* ***************************************
 	AVATAR ICONS
 *************************************** */
diff --git a/views/default/css/elements/forms.php b/views/default/css/elements/forms.php
index ca03afd10..67e21974b 100644
--- a/views/default/css/elements/forms.php
+++ b/views/default/css/elements/forms.php
@@ -37,6 +37,8 @@ input[type="text"]:focus, input[type="password"]:focus {
 	background: #e4ecf5;
 	color:#333333;
 }
+
+<?php //@todo prefix with "elgg-" ?>
 textarea.monospace {
 	font-family: Monaco,"Courier New",Courier,monospace;
 	font-size: 13px;
@@ -45,6 +47,8 @@ a.longtext-control {
 	float:right;
 	margin-left:14px;
 }
+
+
 .elgg-input-access {
 	margin:5px 0 0 0;
 }
@@ -134,6 +138,7 @@ input[type="submit"]:hover,
 	border: 1px solid #999999;
 }
 /*
+<?php //@todo elgg-state-disabled? ?>
 .elgg-submit-button.disabled {
 	background-color:#999999;
 	border-color:#999999;
@@ -224,6 +229,7 @@ a.elgg-action-button:focus {
 
 */
 
+<?php //@todo prefix with elgg- ?>
 /* small round delete button */
 .delete-button {
 	width:14px;
diff --git a/views/default/css/elements/grid.php b/views/default/css/elements/grid.php
index 522f9fbc0..f7d23a6f0 100644
--- a/views/default/css/elements/grid.php
+++ b/views/default/css/elements/grid.php
@@ -4,6 +4,8 @@
  *
  * @package Elgg.Core
  * @subpackage UI
+ * 
+ * @todo last column needs to be elgg-body style to absorb subpixel rounding discrepancies
  */
 ?>
 /* ***************************************
diff --git a/views/default/css/elements/icons.php b/views/default/css/elements/icons.php
index 39c3ab148..b847bfadc 100644
--- a/views/default/css/elements/icons.php
+++ b/views/default/css/elements/icons.php
@@ -64,6 +64,7 @@
 	background-position: -249px 1px;
 }
 
+<?php //@todo prefix with elgg- ?>
 .ajax-loader {
 	background-color: white;
 	background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/ajax_loader_bw.gif);
diff --git a/views/default/css/elements/layout.php b/views/default/css/elements/layout.php
index 63e1dc1c8..6b4a98ae9 100644
--- a/views/default/css/elements/layout.php
+++ b/views/default/css/elements/layout.php
@@ -7,6 +7,7 @@
 /* ***************************************
 	PAGE LAYOUT
 *************************************** */
+<?php //@todo should be in base/reset ?>
 body {
 	background-color: white;
 }
@@ -24,6 +25,8 @@ body {
 .elgg-page-topbar > .elgg-inner {
 	padding: 2px 10px 2px 8px;
 }
+
+<?php //@todo location-dependent styles ?>
 .elgg-page-topbar a {
 	color: #eeeeee;
 	float: left;
@@ -62,12 +65,16 @@ body {
 	background-repeat: repeat-x;
 	background-position: bottom left;
 }
+
+<?php //@todo Put all elgg-classic styles together ?>
 .elgg-classic .elgg-page-header > .elgg-inner {
 	width: 990px;
 	margin: 0 auto;
 	height: 90px;
 	position: relative;
 }
+
+<?php //@todo location-dependent styles ?>
 .elgg-page-header h1 a {
 	font-size: 2em;
 	line-height: 1.4em;
@@ -87,6 +94,8 @@ body {
 	width: 990px;
 	margin: 0 auto;
 }
+
+<?php //@todo layout object is different from page object -- put in separate files? ?>
 #elgg-layout-one-column {
 	padding: 10px 0;
 }
@@ -123,9 +132,11 @@ body {
 }
 
 .elgg-main .elgg-header {
-    border-bottom: 1px solid #CCCCCC;
-    padding-bottom: 3px;
+	border-bottom: 1px solid #CCCCCC;
+	padding-bottom: 3px;
 }
+
+<?php //@todo location-dependent styles ?>
 .elgg-main .elgg-header h2 {
 	float: left;
 	max-width: 530px;
@@ -148,6 +159,8 @@ body {
 	padding: 5px 0;
 	border-top: 1px solid #DEDEDE;
 }
+
+<?php //@todo location-dependent styles ?>
 .elgg-page-footer a {
 	float: left;
 }
diff --git a/views/default/css/elements/misc.php b/views/default/css/elements/misc.php
index f5dd78821..297becefe 100644
--- a/views/default/css/elements/misc.php
+++ b/views/default/css/elements/misc.php
@@ -4,6 +4,11 @@
  */
 
 ?>
+/* ***************************************
+	PRIMITIVES
+*************************************** */
+.right {float:right}
+.left {float:left}
 
 /* ***************************************
 	LIKES
@@ -29,10 +34,10 @@
 	margin-right: 20px;
 }
 .elgg-river-timestamp {
-    color: #666666;
-    font-size: 85%;
-    font-style: italic;
-    line-height: 1.2em;
+	color: #666666;
+	font-size: 85%;
+	font-style: italic;
+	line-height: 1.2em;
 }
 .elgg-river-content {
 	border-left: 1px solid #CCCCCC;
@@ -41,6 +46,8 @@
 	margin: 8px 0 5px 0;
 	padding-left: 5px;
 }
+
+<?php //@todo location-dependent styles ?>
 .elgg-river-content .elgg-user-icon {
 	float: left;
 }
@@ -49,6 +56,7 @@
 	margin: 10px 0;
 }
 
+<?php //@todo do we need another elgg-tabs extension? ?>
 .elgg-river-comments-tab {
 	display: block;
 	background-color: #EEEEEE;
@@ -63,6 +71,8 @@
 	-webkit-border-top-left-radius: 5px;
 	-webkit-border-top-right-radius: 5px;
 }
+
+<?php //@todo lists.php ?>
 .elgg-river-comments {
 	margin: 0;
 	border-top: none;
@@ -94,6 +104,8 @@
 	font-size: 85%;
 	margin-bottom: 2px;
 }
+
+<?php //@todo location-dependent styles ?>
 .elgg-river-item form {
 	background-color: #EEEEEE;
 	padding: 4px 4px;
@@ -114,6 +126,7 @@
 	clear: both;
 }
 
+<?php //@todo needs revamp: elgg-login-form, elgg-register-form? ?>
 /* ***************************************
 	LOGIN / REGISTER
 *************************************** */
@@ -246,6 +259,7 @@
 /* ***************************************
 	USER SETTINGS
 *************************************** */
+<?php //@todo prefix with elgg-.  Move to chrome.php ?>
 table.styled {
 	width:100%;
 }
@@ -263,6 +277,7 @@ table.styled tr:hover {
 	background: #E4E4E4;
 }
 
+<?php //@todo needs revamp ?>
 /* ***************************************
 	FRIENDS PICKER
 *************************************** */
diff --git a/views/default/css/elements/navigation.php b/views/default/css/elements/navigation.php
index 52e8bd1d4..deee015a0 100644
--- a/views/default/css/elements/navigation.php
+++ b/views/default/css/elements/navigation.php
@@ -33,10 +33,14 @@
 	color: white;
 	text-decoration: none;
 }
+
+<?php //@todo use "disabled" on the li ?>
 .elgg-pagination .inactive {
 	color: #CCCCCC;
 	border-color: #CCCCCC;
 }
+
+<?php //@todo Choose b/w elgg-state-active or elgg-state-selected ?>
 .elgg-pagination .active {
 	color: #555555;
 	border-color: #555555;
@@ -51,11 +55,14 @@
 	display:table;
 	width:100%;
 }
+
+<?php //@todo reset rules like this should no longer be needed? ?>
 .elgg-tabs ul {
 	list-style: none;
 	padding: 0;
 	margin: 0;
 }
+
 .elgg-tabs li {
 	float: left;
 	border: 2px solid #cccccc;
@@ -279,6 +286,8 @@
 	color: white;
 	background-color: red;
 }
+
+<?php //@todo needs revamp ?>
 .avatar_menu_button {
 	width:15px;
 	height:15px;
diff --git a/views/default/css/elements/reset.php b/views/default/css/elements/reset.php
index f8d7b16bc..05682dac1 100644
--- a/views/default/css/elements/reset.php
+++ b/views/default/css/elements/reset.php
@@ -6,6 +6,8 @@
  * @subpackage UI
  */
 ?>
+
+<?php //@todo * { ... }? ?>
 /* ***************************************
 	RESET CSS
 *************************************** */
@@ -47,7 +49,7 @@ ins {
 del {
 	text-decoration:line-through;
 }
-strong {
+strong, b {
 	font-weight:bold;
 }
 table {
diff --git a/views/default/css/elements/spacing.php b/views/default/css/elements/spacing.php
index 3dd2ad41d..8cab342be 100644
--- a/views/default/css/elements/spacing.php
+++ b/views/default/css/elements/spacing.php
@@ -4,6 +4,8 @@
  *
  * @package Elgg.Core
  * @subpackage UI
+ * 
+ * @todo use variables so people can adjust the numbers easily if they want?
  */
 ?>
 
diff --git a/views/default/css/elements/typography.php b/views/default/css/elements/typography.php
index aece7a49d..a550058e8 100644
--- a/views/default/css/elements/typography.php
+++ b/views/default/css/elements/typography.php
@@ -34,3 +34,5 @@ h3 { font-size: 1.2em; }
 h4 { font-size: 1.0em; }
 h5 { font-size: 0.9em; }
 h6 { font-size: 0.8em; }
+
+<?php //@todo many location-dependent styles are for styling headings.  Move those here and make them into non-location-dependent classes ?>
\ No newline at end of file