-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathSpryValidationTextarea.css
62 lines (50 loc) · 2.34 KB
/
SpryValidationTextarea.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
@charset "UTF-8";
/* SpryFormValidation.css - Revision: Spry Preview Release 1.4 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/* These are the classes applied on the error messages
* which prevent them from being displayed by default.
*/
.textareaRequiredMsg,
.textareaMinCharsMsg,
.textareaMaxCharsMsg,
.textareaValidMsg {
display:none;
}
/* These selectors change the way messages look when the widget is in one of the error states.
* These classes set a default red border and color for the error text.
* The state class (e.g. .textareaRequiredState) is applied on the top-level container for the widget,
* and this way only the specific error message can be shown by setting the display property to "inline".
*/
.textareaRequiredState .textareaRequiredMsg,
.textareaMinCharsState .textareaMinCharsMsg,
.textareaMaxCharsState .textareaMaxCharsMsg
{
display: inline;
color: #CC3333;
border: 0px solid #CC3333;
}
/* The next three group selectors control the way the core element (TEXTAREA) looks like when the widget is in one of the states: * focus, required / minChars / maxChars , valid
* There are two selectors for each state, to cover the two main usecases for the widget:
* - the widget id is placed on the top level container for the TEXTAREA
* - the widget id is placed on the TEXTAREA element itself (there are no error messages)
*/
/* When the widget is in the valid state the TEXTAREA has a green background applied on it. */
.textareaValidState textarea, textarea.textareaValidState {
background-color:#B8F5B1;
}
/* When the widget is in an invalid state the TEXTAREA has a red background applied on it. */
textarea.textareaRequiredState, .textareaRequiredState textarea,
textarea.textareaMinCharsState, .textareaMinCharsState textarea,
textarea.textareaMaxCharsState, .textareaMaxCharsState textarea {
background-color:#FF9F9F;
}
/* When the widget has received focus, the TEXTAREA has a yellow background applied on it. */
.textareaFocusState textarea, textarea.textareaFocusState {
background-color:#FFFFCC;
}
/* This class applies only for a short period of time and changes the way the text in the textarea looks like.
* It applies only when the widget has enforce max chars enabled and the user tries to type some more.
*/
.textareaFlashState textarea, textarea.textareaFlashState{
color:red !important;
}