Ticket #1498 - CSS clean up, use margin reset and remove excess margin 0 and padding 0

git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/trunk@44273 467b73ca-7a2a-4603-9d3b-597d59a354a9

css/cms_left.css

@@ -194,6 +194,14 @@ ul.tree .deleted {
 	color: red;
 	text-decoration: line-through;
 }
+
+#publication_key {
+	border-bottom: 1px solid #ccc;
+	background: #eee;
+	padding: 3px;
+	text-align: center;
+}
+
 /* Created on stage, never published */
 ul.tree ins,
 #publication_key ins {

css/cms_right.css

@@ -1,3 +1,10 @@
+/**
+ * General
+ */
+#right p {
+	margin: 7px 0;
+}
+
 /**
  * Forms
  */
@@ -51,7 +58,7 @@
 #Form_EditorToolbarImageForm fieldset span,
 #Form_EditorToolbarLinkForm fieldset span {
 	float: left;
-	width: 350px;
+	width: 278px;
 	background: none;
 }
 #Form_EditorToolbarLinkForm fieldset li span,
@@ -176,7 +183,7 @@ div.Actions input {
 }
 
 .ajaxActions input:hover,
-div.Actions input {
+div.Actions input:hover {
 	background: #fff;
 }
 
@@ -284,8 +291,8 @@ input.loading {
 	z-index: 200;
 	margin: 0;
 	padding: 10px;	
-	
 }
+
 #right form.actionparams div.field {
 	margin-left: 6em;
 }

css/layout.css

@@ -1,18 +1,24 @@
-html {
+* {
 	margin: 0;
-	height: 100%;
+	padding: 0;
-	overflow:hidden;
+	list-style: none;
-}
+	font-family: Arial, Helvetica, sans-serif;
-body {
-	height: 100%;
-	margin: 0;
-	background-color: #ccdef3;
 }
 
+html {
+	height: 100%;
+	overflow: hidden;
+}
+
+body {
+	height: 100%;
+	background: #ccdef3;
+}
+
+/* Overrides - TODO Find a better place to put them */
 form#Form_EditForm fieldset {
 	height: 100%;
 }
-
 body.stillLoading select {
 	display: none;
 }
@@ -21,7 +27,6 @@ body.stillLoading select {
 #top {
 	font-size: 14px;
 	height: 33px;
-	padding: 0;
 	background: #474855 url(../images/mainmenu/top-bg.gif) top left repeat-x;
 	color: #fff;
 	overflow: hidden;
@@ -100,11 +105,10 @@ body.stillLoading select {
 }
 
 #left h2 {
-	margin: 0;
 	background-image:url(../images/textures/obar-18.gif);
 	height: 18px;
 	line-height: 18px;
-	color: white;
+	color: #fff;
 	font-size: 12px;
 	padding-left: 3px;
 }
@@ -112,13 +116,9 @@ body.stillLoading select {
 /** TOP PANEL **/
 #top #MainMenu {
 	margin: 0 0 0 6px;
-	padding: 0;
 }
 #top #MainMenu li {
-	margin: 0px 4px;
+	margin: 0 4px;
-	padding-top: 0;
-	padding-bottom: 0;
-	list-style-type: none;
 	float: left;
 	height: 33px;
 	cursor: pointer;
@@ -158,27 +158,24 @@ body.stillLoading select {
 #top #Logo {
 	float: right;
 }
-#top #Logo a {
+	#top #Logo a {
-	margin: 0;
+		margin: 0;
-	display: block; 
+		display: block; 
-	font-size: 14px;
+		font-size: 14px;
-	text-decoration: none;
+		text-decoration: none;
-	height: 26px; 
+		height: 26px; 
-	line-height: 22px;
+		line-height: 22px;
-	position: absolute; 
+		position: absolute; 
-	top: 5px; 
+		top: 5px; 
-	right: 8px;
+		right: 8px;
-	padding-right: 34px;
+		padding-right: 34px;
-	background: url(../images/mainmenu/logo.gif) right top no-repeat;
+		background: url(../images/mainmenu/logo.gif) right top no-repeat;
-}
+		color: #fff;
+	}
 	html > body #top #Logo {
 		padding-bottom: 0;
 	}
 	
-	#top #Logo a {
-		color: #fff;
-	}
-
 #bottom {
 	width: 100%;
 	position: absolute;
@@ -191,9 +188,7 @@ body.stillLoading select {
 
 #bottom .holder {
 	text-align: center;
-	padding-top: 5px;
+	padding: 5px 6px 0 3px;
-	padding-left: 3px;
-	padding-right: 6px;
 	font-size: 10px;
 	color: #fff;
 }
@@ -201,14 +196,16 @@ body.stillLoading select {
 #bottom #logInStatus {
 	float: right;
 }
-	#bottom #logInStatus a {
+	#bottom #logInStatus a,
-		color: #FFF;
-		text-decoration: underline;
-	}
 	#bottom #logInStatus a:hover {
 		color: #fff;
-		text-decoration: none;
 	}
+		#bottom #logInStatus a {
+			text-decoration: underline;
+		}
+		#bottom #logInStatus a:hover {
+			text-decoration: none;
+		}
 	#bottom #logInStatus #LogoutLink {
 		background: url(../images/logout.gif) no-repeat right center;
 		padding-right: 20px;
@@ -257,12 +254,10 @@ body.stillLoading select {
 	}
 
 div.spacer, li.spacer {
-	list-style-type: none;
 	float: none;
 	clear: both;
 	background-color: transparent;
 	border-style: none;
-	padding: 0;
 	margin: -1px 0 0 0;
 	height: 1px;
 	font-size: 1px;
@@ -271,13 +266,8 @@ div.spacer, li.spacer {
 /** RIGHT PANEL **/
 .mceToolbarExternal {
 	background-color: #eee;
-	/*border-bottom: 1px #CCC solid;*/
-	/*position: absolute;
-	top: 23px;
-	left: 0;*/
 	display: block;
 }
-
 	.mceToolbarExternal a {
 		text-decoration: none;
 		border: 0 !important;
@@ -286,12 +276,11 @@ div.spacer, li.spacer {
 			border: none;
 		}
 
-
 #right form#Form_EditorToolbarLinkForm,
 #right form#Form_EditorToolbarImageForm,
 #right form#Form_EditorToolbarFlashForm {
-	background-color: #EEE;
+	background: #eee;
-	border-bottom: 1px #CCC solid;
+	border-bottom: 1px solid #ccc;
 	display: none;
 	margin: 1px 0 0 0;
 	padding: 5px;
@@ -307,8 +296,8 @@ div.spacer, li.spacer {
 
 #right form#Form_EditorToolbarLinkForm ul.optionset {
 	height: 1em;
-	margin: 0;
 }
+
 #right form#Form_EditorToolbarLinkForm ul.optionset li {
 	float: left;
 }
@@ -322,12 +311,6 @@ div.spacer, li.spacer {
 	border: 1px solid #aaa;
 }
 
-.thumbnailstrip ul {
-	margin: 0;
-	padding: 0;
-	list-style: none;
-}
-
 .thumbnailstrip li {
 	float: left;
 	margin-right: 4px;
@@ -335,12 +318,12 @@ div.spacer, li.spacer {
 
 /* CMS specific icons for the tree */
 ul.tree li.Root span.Root span.c a {
-	background-image : url(../../cms/images/treeicons/root.png) !important;
+	background-image: url(../../cms/images/treeicons/root.png) !important;
 }
 .TreeDropdownField {
 	background: #ff0;
 }
 /* Misc Styling */
 iframe {
-	border : none;
+	border: none;
 }

css/typography.css

@@ -11,6 +11,7 @@ h1 {
 	font-size: 20px;
 	color: #0074C6;
 }
+
 h2 {
 	font-size: 18px;
 	color: #0074C6;

templates/Includes/AssetAdmin_right.ss

@@ -1,5 +1,3 @@
-<!-- <div class="title"><div >Folder contents</div></div> -->
-
 <div id="form_actions_right" class="ajaxActions">
 </div>
 

templates/Includes/BulkLoaderAdmin_right.ss

@@ -1,5 +1,3 @@
-<!-- <div class="title"><div>Bulk loader</div></div> -->
-
 <form id="Form_EditForm" action="admin/bulkload?executeForm=EditForm" method="post" enctype="multipart/form-data">
 	<iframe style="width: 100%; height: 100%" src="admin/bulkload/iframe/$Class"></iframe>
 </form>

templates/Includes/CMSMain_left.ss

@@ -88,17 +88,18 @@
 			</form>
 			<% end_control %>
 
-			<div id="publication_key" style="border-bottom: 1px #CCC solid; background-color: #EEE; padding: 3px;">
-				<% _t('KEY','Key:') %>
-				<ins style="cursor: help" title="<% _t('ADDEDNOTPUB','Added to the draft site and not published yet') %>"><% _t('NEW','new') %></ins>
-				<del style="cursor: help" title="<% _t('DELETEDSTILLLIVE','Deleted from the draft site but still on the live site') %>"><% _t('DEL','deleted') %></del>
-				<span style="cursor: help" title="<% _t('EDITEDNOTPUB','Edited on the draft site and not published yet') %>" class="modified"><% _t('CHANGED','changed') %></span>
-			</div>
-
 			<div id="sitetree_ul">
 				$SiteTreeAsUL
 			</div>
 		</div>
+
+		<div id="publication_key">
+			<% _t('KEY','Key:') %>
+			<ins style="cursor: help" title="<% _t('ADDEDNOTPUB','Added to the draft site and not published yet') %>"><% _t('NEW','new') %></ins>
+			<del style="cursor: help" title="<% _t('DELETEDSTILLLIVE','Deleted from the draft site but still on the live site') %>"><% _t('DEL','deleted') %></del>
+			<span style="cursor: help" title="<% _t('EDITEDNOTPUB','Edited on the draft site and not published yet') %>" class="modified"><% _t('CHANGED','changed') %></span>
+		</div>		
+		
 		<div id="LangSelector_holder" <% if MultipleLanguages %><% else %> class="onelang"<% end_if %>>
 			Language: $LangSelector
 		</div>

templates/Includes/CMSMain_right.ss

@@ -1,5 +1,5 @@
-<!-- <div class="title"><div style="background-image : url(cms/images/panels/EditPage.png)">Edit Page</div></div> -->
 <% include Editor_toolbar %>
+
 <span id="Translating_Message" class="translatingMessage <% if EditingLang %><% else %>nonTranslating<% end_if %>"></span>
 
 <div id="form_actions_right" class="ajaxActions">

templates/Includes/GenericDataAdmin_right.ss

@@ -1,4 +1,3 @@
-<!-- <div class="title"><div style="background-image : url(cms/images/panels/EditPage.png)">Edit Page</div></div> -->
 <% include Editor_toolbar %>
 
 <% if EditForm %>
@@ -12,5 +11,4 @@
 	</form>
 <% end_if %>
 
-
 <p id="statusMessage" style="visibility:hidden"></p>

templates/Includes/NewsletterAdmin_right.ss

@@ -1,11 +1,8 @@
-<!-- <div class="title"><div>Edit Content</div></div> -->
-
 <% include Editor_toolbar %>
 
 <div id="form_actions_right" class="ajaxActions">
 </div>
 
-
 <form class="actionparams" id="action_send_options" style="display:none" action="admin/newsletter/sendnewsletter">
 	<fieldset>
 	<input type="hidden" name="NewsletterID" />

templates/Includes/ReportAdmin_right.ss

@@ -1,5 +1,3 @@
-<!-- <div class="title"><div>Report Details</div></div> -->
-
 <% if EditForm %>
 	$EditForm
 <% else %>

templates/Includes/SecurityAdmin_right.ss

@@ -1,5 +1,3 @@
-<!-- <div class="title"><div>Users in this Group</div></div> -->
-
 <div id="form_actions_right" class="ajaxActions">
 </div>
 

templates/Includes/StatisticsAdmin_right.ss

@@ -1,5 +1,3 @@
-<!-- <div class="title"><div>Statistics</div></div> -->
-
 <form id="Form_EditForm" action="" method="post" enctype="multipart/form-data">
 <% if EditForm %>
 	$EditForm