MINOR Simpler field alignment of OptionsetField (and some specifics f…

…or member-profile-form)
silverstripe · Jan 9, 2012 · aff72e7 · aff72e7
1 parent ce795b6
commit aff72e7
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 23 deletions.
diff --git a/admin/css/screen.css b/admin/css/screen.css
diff --git a/admin/scss/_forms.scss b/admin/scss/_forms.scss
@@ -118,7 +118,7 @@ form.nostyle {
 		&.left {
 			float: left;
 			display: block;
-			width: $grid-horizontal * 21;
+			width: $grid-horizontal * 22;
 			padding: $grid-vertical $grid-horizontal $grid-vertical 0;
 			line-height: $grid-vertical * 2;
 			font-weight: bold;
@@ -444,33 +444,49 @@ form.stacked .field, .field.stacked {
 		margin-left: 0;
 	}
 }
+input.checkbox {
+	margin-left: 0
+}
+
+/** ----------------------------------------------------
+ * Radiobutton Field
+ * ---------------------------------------------------- */
+.field.radio {
+	padding-left: $grid-horizontal * 23;
+	margin-bottom: $grid-vertical;
+
+	input {
+		margin-left: 0;
+	}
+}
+input.radio {
+	margin-left: 0
+}
+
 /** ----------------------------------------------------
  * Optionsets and Checkboxsets
  * ---------------------------------------------------- */
 .optionset {
-	overflow: hidden;
 	padding-bottom: 8px;
 
 	li {
 		float: left;
 		display: block;
 		width: $grid-horizontal * 27;
-		padding: $grid-vertical $grid-horizontal 0;
+		padding-bottom: $grid-horizontal;
 		line-height: $grid-vertical * 2;
 		list-style: none;
-		position: relative;
 
 		input {
-			position: absolute;
-			top: $grid-vertical + 1; // used to get the input off the edge, the overflow
-			left: 2px; // hidden crops the glow.
-			margin: 0;
+			display: inline-block;
+			padding-right: 0;
+			margin-right: 0;
 		}
 
 		label {
-			display: block;
+			display: inline;
 			cursor: pointer;
-			padding: 0 0 0 $grid-vertical * 2;
+			padding-left: $grid-vertical;
 		}
 
 	}

diff --git a/admin/scss/_style.scss b/admin/scss/_style.scss
@@ -689,17 +689,15 @@ form.member-profile-form {
 	}
 
 	input.customFormat {
+		width: $grid-horizontal * 10;
 		border: 1px solid #ccc !important;
 		padding: 3px;
-		display: inline;
-		margin-left: 15px;
-		position: relative;
+		display: inline-block;
+		margin-left: 1em;
 	}
 	.formattingHelpToggle {
 		display: block;
 		font-size: 11px;
-		margin-top: 10px;
-		margin-left: 15px;
 	}
 	.formattingHelpText {
 		margin: 5px 0 0 -5px;
@@ -715,6 +713,7 @@ form.member-profile-form {
 		font-size: 11px;
 		color: #333;
 		margin-bottom: 2px;
+		padding-bottom: 0;
 		float: none;
 		width: auto;
 	}
@@ -726,6 +725,16 @@ form.member-profile-form {
 			max-width: 90%;
 		}
 	}
+
+	// Same rules in .SecurityAdmin
+	#Permissions {
+		.optionset {
+			li {
+				float: none;
+				width: auto;
+			}	
+		}
+	}
 }
 
 .cms {