tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-06-29 16:09:23 +02:00
Code Issues Projects Releases Wiki Activity

MINOR Simpler field alignment of OptionsetField (and some specifics for member-profile-form)

Browse Source
This commit is contained in:
Ingo Schommer 2012-01-06 20:44:34 +01:00
parent ce795b6d8a
commit aff72e766e
3 changed files with 57 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
admin/css/screen.css
View File

@ -89,7 +89,7 @@ form.nostyle .middleColumn { margin-left: 0; }
.field { display: block; padding: 10px 0; border-bottom: 1px solid rgba(201, 205, 206, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -o-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); padding: 0 0 7px 0; margin: 0 0 8px 0; *zoom: 1; } .field { display: block; padding: 10px 0; border-bottom: 1px solid rgba(201, 205, 206, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -o-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); padding: 0 0 7px 0; margin: 0 0 8px 0; *zoom: 1; }
.field:after { content: "\0020"; display: block; height: 0; clear: both; overflow: hidden; visibility: hidden; } .field:after { content: "\0020"; display: block; height: 0; clear: both; overflow: hidden; visibility: hidden; }
.field.nolabel .middleColumn { margin-left: 0; } .field.nolabel .middleColumn { margin-left: 0; }
.field label.left { float: left; display: block; width: 168px; padding: 8px 8px 8px 0; line-height: 16px; font-weight: bold; text-shadow: 1px 1px 0 white; } .field label.left { float: left; display: block; width: 176px; padding: 8px 8px 8px 0; line-height: 16px; font-weight: bold; text-shadow: 1px 1px 0 white; }
.field label.right { cursor: pointer; } .field label.right { cursor: pointer; }
.field .middleColumn { margin-left: 184px; } .field .middleColumn { margin-left: 184px; }
.field span.readonly { padding-top: 8px; line-height: 16px; display: block; } .field span.readonly { padding-top: 8px; line-height: 16px; display: block; }
@ -157,11 +157,19 @@ form.stacked .field .middleColumn, .field.stacked .middleColumn { margin-left: 0
.field.checkbox { padding-left: 184px; margin-bottom: 8px; } .field.checkbox { padding-left: 184px; margin-bottom: 8px; }
.field.checkbox input { margin-left: 0; } .field.checkbox input { margin-left: 0; }
input.checkbox { margin-left: 0; }
/** ---------------------------------------------------- Radiobutton Field ---------------------------------------------------- */
.field.radio { padding-left: 184px; margin-bottom: 8px; }
.field.radio input { margin-left: 0; }
input.radio { margin-left: 0; }
/** ---------------------------------------------------- Optionsets and Checkboxsets ---------------------------------------------------- */ /** ---------------------------------------------------- Optionsets and Checkboxsets ---------------------------------------------------- */
.optionset { overflow: hidden; padding-bottom: 8px; } .optionset { padding-bottom: 8px; }
.optionset li { float: left; display: block; width: 216px; padding: 8px 8px 0; line-height: 16px; list-style: none; position: relative; } .optionset li { float: left; display: block; width: 216px; padding-bottom: 8px; line-height: 16px; list-style: none; }
.optionset li input { position: absolute; top: 9px; left: 2px; margin: 0; } .optionset li input { display: inline-block; padding-right: 0; margin-right: 0; }
.optionset li label { display: block; cursor: pointer; padding: 0 0 0 16px; } .optionset li label { display: inline; cursor: pointer; padding-left: 8px; }
/** ---------------------------------------------------- HTML Text ---------------------------------------------------- */ /** ---------------------------------------------------- HTML Text ---------------------------------------------------- */
.htmleditor textarea { visibility: hidden; } .htmleditor textarea { visibility: hidden; }
@ -317,13 +325,14 @@ body.cms { overflow: hidden; }
form.member-profile-form #CsvFile .middleColumn { background: none !important; } form.member-profile-form #CsvFile .middleColumn { background: none !important; }
form.member-profile-form .advanced h4 { margin-bottom: .5em; } form.member-profile-form .advanced h4 { margin-bottom: .5em; }
form.member-profile-form .Actions { text-align: left; border: 0; } form.member-profile-form .Actions { text-align: left; border: 0; }
form.member-profile-form input.customFormat { border: 1px solid #ccc !important; padding: 3px; display: inline; margin-left: 15px; position: relative; } form.member-profile-form input.customFormat { width: 80px; border: 1px solid #ccc !important; padding: 3px; display: inline-block; margin-left: 1em; }
form.member-profile-form .formattingHelpToggle { display: block; font-size: 11px; margin-top: 10px; margin-left: 15px; } form.member-profile-form .formattingHelpToggle { display: block; font-size: 11px; }
form.member-profile-form .formattingHelpText { margin: 5px 0 0 -5px; color: #333; padding: 5px 10px; background: #fff; border: 1px solid #ccc; } form.member-profile-form .formattingHelpText { margin: 5px 0 0 -5px; color: #333; padding: 5px 10px; background: #fff; border: 1px solid #ccc; }
form.member-profile-form .formattingHelpText ul { padding: 0; } form.member-profile-form .formattingHelpText ul { padding: 0; }
form.member-profile-form .formattingHelpText li { font-size: 11px; color: #333; margin-bottom: 2px; float: none; width: auto; } form.member-profile-form .formattingHelpText li { font-size: 11px; color: #333; margin-bottom: 2px; padding-bottom: 0; float: none; width: auto; }
form.member-profile-form #Groups .middleColumn { margin-left: 0; width: 100%; } form.member-profile-form #Groups .middleColumn { margin-left: 0; width: 100%; }
form.member-profile-form #Groups .middleColumn .TreeDropdownField { width: 90%; max-width: 90%; } form.member-profile-form #Groups .middleColumn .TreeDropdownField { width: 90%; max-width: 90%; }
form.member-profile-form #Permissions .optionset li { float: none; width: auto; }
.cms .cms-content { border-right: 1px solid rgba(201, 205, 206, 0.8); -moz-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.15); -o-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.15); box-shadow: 3px 0 4px rgba(0, 0, 0, 0.15); -moz-border-radius: 0; -webkit-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; } .cms .cms-content { border-right: 1px solid rgba(201, 205, 206, 0.8); -moz-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.15); -o-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.15); box-shadow: 3px 0 4px rgba(0, 0, 0, 0.15); -moz-border-radius: 0; -webkit-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; }
.cms .cms-content-fields { /* always show a y scroll bar as popups like TreeDropdowns can trigger longer pages and the extra scroll bar doesn't fire our sizing bar */ overflow-y: auto; overflow-x: auto; background: none; } .cms .cms-content-fields { /* always show a y scroll bar as popups like TreeDropdowns can trigger longer pages and the extra scroll bar doesn't fire our sizing bar */ overflow-y: auto; overflow-x: auto; background: none; }

36
admin/scss/_forms.scss
View File

@ -118,7 +118,7 @@ form.nostyle {
&.left { &.left {
float: left; float: left;
display: block; display: block;
width: $grid-horizontal * 21; width: $grid-horizontal * 22;
padding: $grid-vertical $grid-horizontal $grid-vertical 0; padding: $grid-vertical $grid-horizontal $grid-vertical 0;
line-height: $grid-vertical * 2; line-height: $grid-vertical * 2;
font-weight: bold; font-weight: bold;
@ -444,33 +444,49 @@ form.stacked .field, .field.stacked {
margin-left: 0; 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 * Optionsets and Checkboxsets
* ---------------------------------------------------- */ * ---------------------------------------------------- */
.optionset { .optionset {
overflow: hidden;
padding-bottom: 8px; padding-bottom: 8px;
li { li {
float: left; float: left;
display: block; display: block;
width: $grid-horizontal * 27; width: $grid-horizontal * 27;
padding: $grid-vertical $grid-horizontal 0; padding-bottom: $grid-horizontal;
line-height: $grid-vertical * 2; line-height: $grid-vertical * 2;
list-style: none; list-style: none;
position: relative;
input { input {
position: absolute; display: inline-block;
top: $grid-vertical + 1; // used to get the input off the edge, the overflow padding-right: 0;
left: 2px; // hidden crops the glow. margin-right: 0;
margin: 0;
} }
label { label {
display: block; display: inline;
cursor: pointer; cursor: pointer;
padding: 0 0 0 $grid-vertical * 2; padding-left: $grid-vertical;
} }
} }

19
admin/scss/_style.scss
View File

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