tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-10-22 14:05:37 +02:00
Code Issues Projects Releases Wiki Activity

Form.scss reformatting (no functional changes)

Browse Source
This commit is contained in:
Ingo Schommer 2013-06-15 11:24:22 +02:00
parent 7c3e1a43e3
commit 1fd8a55012
2 changed files with 115 additions and 133 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
css/Form.css
View File

@ -1,42 +1,22 @@
/** Fields */
form { /** Messages */ }
form * { font-size: 12px; }
form fieldset { margin: 0; padding: 0; border-style: none; }
form .field { clear: both; padding: 0.2em; margin: 0 0 0 10em; vertical-align: middle; }
form p.checkbox { margin: 0 0 0 8.5em; }
form .field.nolabel { margin-left: 0; }
form label.left { float: left; width: 10em; margin-left: -10em; }
form input.maxlength { width: auto; }
form .actions { float: right; }
form .validation, form .error, form .required { border: 1px solid #f00; background: #fcc; padding: 0.5em; width: 50%; }
form .field span.readonly { border: 1px #CCC dotted; background-color: #F7F7F7; display: block; width: 98%; padding: 3px; margin: 5px 0; }
form .indicator.inline { display: inline; margin-left: 5px; vertical-align: middle; }
form .indicator.block { display: inline; }
/* Emulating link styling for actions requiring lesser attention, e.g. "cancel" FormActions */
form button.minorAction { background: none; padding: 0; border: 0; color: #0074C6; text-decoration: underline; }
/** Messages */
form .message.notice { background-color: #FCFFDF; border-color: #FF9300; }
form .message { margin: 1em 0; padding: 0.5em; font-weight: bold; border: 1px black solid; background-color: #B9FFB9; border-color: #00FF00; }
form .message.notice { background-color: #FCFFDF; border-color: #FF9300; }
form .message.warning { background-color: #FFD2A6; border-color: #FF9300; }
form .message.bad { background-color: #FF8080; border-color: #FF0000; }
form .message.required, form .message.validation { display: block; margin-top: 5px; color: #FF9300; width: 240px; border-color: #FF9300; }
form .message.validation { color: #FF4040; width: 240px; border-color: #FF4040; }
.typography .ss-tabset ul { margin: 0; }

62
scss/Form.scss
View File

@ -1,55 +1,52 @@
/**
* Fields
*/
form * {
form {
* {
font-size: 12px;
}
form fieldset {
fieldset {
margin: 0;
padding: 0;
border-style: none;
}
form .field {
.field {
clear: both;
padding: 0.2em;
margin: 0 0 0 10em;
vertical-align: middle;
}
form p.checkbox {
p.checkbox {
margin: 0 0 0 8.5em;
}
form .field.nolabel {
.field.nolabel {
margin-left: 0;
}
form label.left {
label.left {
float: left;
width: 10em;
margin-left: -10em;
}
form input.maxlength {
input.maxlength {
width: auto;
}
form .actions{
.actions{
float : right;
}
form .validation,
form .error,
form .required
{
.validation, .error, .required {
border: 1px solid #f00;
background: #fcc;
padding: 0.5em;
width: 50%;
}
form .field span.readonly {
.field span.readonly {
border: 1px #CCC dotted;
background-color: #F7F7F7;
display: block;
@ -58,18 +55,18 @@ form .field span.readonly {
margin:5px 0;
}
form .indicator.inline {
.indicator.inline {
display: inline;
margin-left: 5px;
vertical-align: middle;
}
form .indicator.block {
.indicator.block {
display: inline;
}
/* Emulating link styling for actions requiring lesser attention, e.g. "cancel" FormActions */
form button.minorAction {
// Emulating link styling for actions requiring lesser attention, e.g. "cancel" FormActions
button.minorAction {
background: none;
padding: 0;
border: 0;
@ -80,39 +77,44 @@ form button.minorAction {
/**
* Messages
*/
form .message.notice {
background-color: #FCFFDF;
border-color: #FF9300;
}
form .message {
.message {
margin: 1em 0;
padding: 0.5em;
font-weight: bold;
border: 1px black solid;
background-color: #B9FFB9;
border-color: #00FF00;
&.notice {
background-color: #FCFFDF;
border-color: #FF9300;
}
form .message.warning {
&.warning {
background-color: #FFD2A6;
border-color: #FF9300;
}
form .message.bad {
&.bad {
background-color: #FF8080;
border-color: #FF0000;
}
form .message.required,
form .message.validation {
&.required, &.validation {
display:block;
margin-top:5px;
color:#FF9300;
width:240px;
border-color: #FF9300;
}
form .message.validation {
&.validation {
color:#FF4040;
width:240px;
border-color: #FF4040;
}
}
}
.typography .ss-tabset ul {
margin: 0;