stylistic 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/.gitignore +3 -0
- data/0.0.1 +0 -0
- data/Gemfile +4 -0
- data/Rakefile +2 -0
- data/lib/generators/stylistic/USAGE +10 -0
- data/lib/generators/stylistic/stylistic_generator.rb +101 -0
- data/lib/generators/stylistic/templates/960.css +1 -0
- data/lib/generators/stylistic/templates/blueprint/ie.css +36 -0
- data/lib/generators/stylistic/templates/blueprint/print.css +29 -0
- data/lib/generators/stylistic/templates/blueprint/screen.css +265 -0
- data/lib/generators/stylistic/templates/html5-reset.css +57 -0
- data/lib/generators/stylistic/templates/jquery.min.js +167 -0
- data/lib/generators/stylistic/templates/jquery.ui.min.js +404 -0
- data/lib/generators/stylistic/templates/less.css +153 -0
- data/lib/generators/stylistic/templates/rails.js +159 -0
- data/lib/generators/stylistic/templates/squaregrid.css +39 -0
- data/lib/generators/stylistic/templates/stylistic-scaffold.css +176 -0
- data/lib/stylistic.rb +26 -0
- data/lib/stylistic/version.rb +3 -0
- data/readme.md +10 -0
- data/stylistic.gemspec +21 -0
- metadata +85 -0
@@ -0,0 +1,153 @@
|
|
1
|
+
/* Less Framework 3
|
2
|
+
by Joni Korpi
|
3
|
+
http://lessframework.com */
|
4
|
+
|
5
|
+
|
6
|
+
/* Resets
|
7
|
+
------ */
|
8
|
+
|
9
|
+
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6,
|
10
|
+
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em,
|
11
|
+
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i,
|
12
|
+
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
|
13
|
+
table, caption, tbody, tfoot, thead, tr, th, td,
|
14
|
+
article, aside, canvas, details, figure, figcaption, hgroup,
|
15
|
+
menu, footer, header, nav, section, summary, time, mark, audio, video {
|
16
|
+
margin: 0;
|
17
|
+
padding: 0;
|
18
|
+
border: 0;
|
19
|
+
}
|
20
|
+
|
21
|
+
article, aside, canvas, figure, figure img, figcaption, hgroup,
|
22
|
+
footer, header, nav, section, audio, video {
|
23
|
+
display: block;
|
24
|
+
}
|
25
|
+
|
26
|
+
a img {border: 0;}
|
27
|
+
|
28
|
+
figure {position: relative;}
|
29
|
+
figure img {width: 100%;}
|
30
|
+
|
31
|
+
|
32
|
+
/* Typography presets
|
33
|
+
------------------ */
|
34
|
+
|
35
|
+
.gigantic {
|
36
|
+
font-size: 110px;
|
37
|
+
line-height: 120px;
|
38
|
+
letter-spacing: -2px;
|
39
|
+
}
|
40
|
+
|
41
|
+
.huge, h1 {
|
42
|
+
font-size: 68px;
|
43
|
+
line-height: 72px;
|
44
|
+
letter-spacing: -1px;
|
45
|
+
}
|
46
|
+
|
47
|
+
.large, h2 {
|
48
|
+
font-size: 42px;
|
49
|
+
line-height: 48px;
|
50
|
+
}
|
51
|
+
|
52
|
+
.big, h3 {
|
53
|
+
font-size: 26px;
|
54
|
+
line-height: 36px;
|
55
|
+
}
|
56
|
+
|
57
|
+
.normal, body {
|
58
|
+
font: 16px/24px Helvetica, Arial, sans-serif;
|
59
|
+
}
|
60
|
+
|
61
|
+
.small {
|
62
|
+
font-size: 13px;
|
63
|
+
line-height: 18px;
|
64
|
+
}
|
65
|
+
|
66
|
+
|
67
|
+
/* Default 8-column layout
|
68
|
+
60 px columns, 24 px gutters, 60 px margins, 768 px total
|
69
|
+
---------------------------------------------------------
|
70
|
+
1 2 3 4 5 6 7 8
|
71
|
+
60px 144px 228px 312px 396px 480px 564px 648px */
|
72
|
+
|
73
|
+
body {
|
74
|
+
background: rgb(232,232,232);
|
75
|
+
padding: 84px 60px 0;
|
76
|
+
width: 648px;
|
77
|
+
-webkit-tap-highlight-color: rgb(255,255,0);
|
78
|
+
}
|
79
|
+
|
80
|
+
::selection {background: rgb(255,255,0);}
|
81
|
+
::-moz-selection {background: rgb(255,255,0);}
|
82
|
+
img::selection {background: transparent;}
|
83
|
+
img::-moz-selection {background: transparent;}
|
84
|
+
|
85
|
+
#example {
|
86
|
+
height: 600px;
|
87
|
+
background: rgb(60,97,158);
|
88
|
+
}
|
89
|
+
|
90
|
+
|
91
|
+
/* 13-column layout
|
92
|
+
60 px columns, 24 px gutters, 72 px margins, 1212 px total (extra space for scrollbars)
|
93
|
+
---------------------------------------------------------------------------------------
|
94
|
+
1 2 3 4 5 6 7 8 9 10 11 12 13
|
95
|
+
60px 144px 228px 312px 396px 480px 564px 648px 732px 816px 900px 984px 1068px */
|
96
|
+
|
97
|
+
@media only screen and (min-width: 1212px) {
|
98
|
+
|
99
|
+
body {
|
100
|
+
padding: 96px 72px 0;
|
101
|
+
width: 1068px;
|
102
|
+
}
|
103
|
+
|
104
|
+
}
|
105
|
+
|
106
|
+
|
107
|
+
/* 5-column layout
|
108
|
+
60 px columns, 24 px gutters, 42 px margins, 480 px total
|
109
|
+
---------------------------------------------------------
|
110
|
+
1 2 3 4 5
|
111
|
+
60px 144px 228px 312px 396px */
|
112
|
+
|
113
|
+
@media only screen and (max-width: 767px) and (min-width: 480px) {
|
114
|
+
|
115
|
+
body {
|
116
|
+
padding: 60px 42px 0;
|
117
|
+
width: 396px;
|
118
|
+
-webkit-text-size-adjust: 100%;
|
119
|
+
}
|
120
|
+
|
121
|
+
}
|
122
|
+
|
123
|
+
|
124
|
+
/* 3-column layout
|
125
|
+
60 px columns, 24 px gutters, 46 px margins, 320 px total
|
126
|
+
---------------------------------------------------------
|
127
|
+
1 2 3
|
128
|
+
60px 144px 228px */
|
129
|
+
|
130
|
+
@media only screen and (max-width: 479px) {
|
131
|
+
|
132
|
+
body {
|
133
|
+
padding: 48px 46px 0;
|
134
|
+
width: 228px;
|
135
|
+
-webkit-text-size-adjust: 100%;
|
136
|
+
}
|
137
|
+
|
138
|
+
}
|
139
|
+
|
140
|
+
|
141
|
+
/* Overrides for iPhone 4
|
142
|
+
and other high device-pixel-ratio devices
|
143
|
+
----------------------------------------- */
|
144
|
+
|
145
|
+
@media
|
146
|
+
only screen and (-webkit-min-device-pixel-ratio: 2),
|
147
|
+
only screen and (min-device-pixel-ratio: 2) {
|
148
|
+
|
149
|
+
#example {
|
150
|
+
background: rgb(255,158,97);
|
151
|
+
}
|
152
|
+
|
153
|
+
}
|
@@ -0,0 +1,159 @@
|
|
1
|
+
/*
|
2
|
+
* jquery-ujs
|
3
|
+
*
|
4
|
+
* http://github.com/rails/jquery-ujs/blob/master/src/rails.js
|
5
|
+
*
|
6
|
+
* This rails.js file supports jQuery 1.4.3 and 1.4.4 .
|
7
|
+
*
|
8
|
+
*/
|
9
|
+
|
10
|
+
jQuery(function ($) {
|
11
|
+
var csrf_token = $('meta[name=csrf-token]').attr('content'),
|
12
|
+
csrf_param = $('meta[name=csrf-param]').attr('content');
|
13
|
+
|
14
|
+
$.fn.extend({
|
15
|
+
/**
|
16
|
+
* Triggers a custom event on an element and returns the event result
|
17
|
+
* this is used to get around not being able to ensure callbacks are placed
|
18
|
+
* at the end of the chain.
|
19
|
+
*/
|
20
|
+
triggerAndReturn: function (name, data) {
|
21
|
+
var event = new $.Event(name);
|
22
|
+
this.trigger(event, data);
|
23
|
+
|
24
|
+
return event.result !== false;
|
25
|
+
},
|
26
|
+
|
27
|
+
/**
|
28
|
+
* Handles execution of remote calls. Provides following callbacks:
|
29
|
+
*
|
30
|
+
* - ajax:beforeSend - is executed before firing ajax call
|
31
|
+
* - ajax:success - is executed when status is success
|
32
|
+
* - ajax:complete - is executed when the request finishes, whether in failure or success
|
33
|
+
* - ajax:error - is execute in case of error
|
34
|
+
*/
|
35
|
+
callRemote: function () {
|
36
|
+
var el = this,
|
37
|
+
method = el.attr('method') || el.attr('data-method') || 'GET',
|
38
|
+
url = el.attr('action') || el.attr('href'),
|
39
|
+
dataType = el.attr('data-type') || ($.ajaxSettings && $.ajaxSettings.dataType);
|
40
|
+
|
41
|
+
if (url === undefined) {
|
42
|
+
throw "No URL specified for remote call (action or href must be present).";
|
43
|
+
} else {
|
44
|
+
var $this = $(this), data = el.is('form') ? el.serializeArray() : [];
|
45
|
+
|
46
|
+
$.ajax({
|
47
|
+
url: url,
|
48
|
+
data: data,
|
49
|
+
dataType: dataType,
|
50
|
+
type: method.toUpperCase(),
|
51
|
+
beforeSend: function (xhr) {
|
52
|
+
if ($this.triggerHandler('ajax:beforeSend') === false) {
|
53
|
+
return false;
|
54
|
+
}
|
55
|
+
// if user has used jQuery.ajaxSetup then call beforeSend callback
|
56
|
+
var beforeSendGlobalCallback = $.ajaxSettings && $.ajaxSettings.beforeSend;
|
57
|
+
if (beforeSendGlobalCallback !== undefined) {
|
58
|
+
beforeSendGlobalCallback(xhr);
|
59
|
+
}
|
60
|
+
},
|
61
|
+
success: function (data, status, xhr) {
|
62
|
+
el.trigger('ajax:success', [data, status, xhr]);
|
63
|
+
},
|
64
|
+
complete: function (xhr) {
|
65
|
+
el.trigger('ajax:complete', xhr);
|
66
|
+
},
|
67
|
+
error: function (xhr, status, error) {
|
68
|
+
el.trigger('ajax:error', [xhr, status, error]);
|
69
|
+
}
|
70
|
+
});
|
71
|
+
}
|
72
|
+
}
|
73
|
+
});
|
74
|
+
|
75
|
+
/**
|
76
|
+
* confirmation handler
|
77
|
+
*/
|
78
|
+
$('body').delegate('a[data-confirm], button[data-confirm], input[data-confirm]', 'click.rails', function () {
|
79
|
+
var el = $(this);
|
80
|
+
if (el.triggerAndReturn('confirm')) {
|
81
|
+
if (!confirm(el.attr('data-confirm'))) {
|
82
|
+
return false;
|
83
|
+
}
|
84
|
+
}
|
85
|
+
});
|
86
|
+
|
87
|
+
|
88
|
+
|
89
|
+
/**
|
90
|
+
* remote handlers
|
91
|
+
*/
|
92
|
+
$('form[data-remote]').live('submit.rails', function (e) {
|
93
|
+
$(this).callRemote();
|
94
|
+
e.preventDefault();
|
95
|
+
});
|
96
|
+
|
97
|
+
$('a[data-remote],input[data-remote]').live('click.rails', function (e) {
|
98
|
+
$(this).callRemote();
|
99
|
+
e.preventDefault();
|
100
|
+
});
|
101
|
+
|
102
|
+
/**
|
103
|
+
* <%= link_to "Delete", user_path(@user), :method => :delete, :confirm => "Are you sure?" %>
|
104
|
+
*
|
105
|
+
* <a href="/users/5" data-confirm="Are you sure?" data-method="delete" rel="nofollow">Delete</a>
|
106
|
+
*/
|
107
|
+
$('a[data-method]:not([data-remote])').live('click.rails', function (e){
|
108
|
+
var link = $(this),
|
109
|
+
href = link.attr('href'),
|
110
|
+
method = link.attr('data-method'),
|
111
|
+
form = $('<form method="post" action="'+href+'"></form>'),
|
112
|
+
metadata_input = '<input name="_method" value="'+method+'" type="hidden" />';
|
113
|
+
|
114
|
+
if (csrf_param !== undefined && csrf_token !== undefined) {
|
115
|
+
metadata_input += '<input name="'+csrf_param+'" value="'+csrf_token+'" type="hidden" />';
|
116
|
+
}
|
117
|
+
|
118
|
+
form.hide()
|
119
|
+
.append(metadata_input)
|
120
|
+
.appendTo('body');
|
121
|
+
|
122
|
+
e.preventDefault();
|
123
|
+
form.submit();
|
124
|
+
});
|
125
|
+
|
126
|
+
/**
|
127
|
+
* disable-with handlers
|
128
|
+
*/
|
129
|
+
var disable_with_input_selector = 'input[data-disable-with]',
|
130
|
+
disable_with_form_remote_selector = 'form[data-remote]:has(' + disable_with_input_selector + ')',
|
131
|
+
disable_with_form_not_remote_selector = 'form:not([data-remote]):has(' + disable_with_input_selector + ')';
|
132
|
+
|
133
|
+
var disable_with_input_function = function () {
|
134
|
+
$(this).find(disable_with_input_selector).each(function () {
|
135
|
+
var input = $(this);
|
136
|
+
input.data('enable-with', input.val())
|
137
|
+
.attr('value', input.attr('data-disable-with'))
|
138
|
+
.attr('disabled', 'disabled');
|
139
|
+
});
|
140
|
+
};
|
141
|
+
|
142
|
+
$(disable_with_form_remote_selector).live('ajax:before.rails', disable_with_input_function);
|
143
|
+
$(disable_with_form_not_remote_selector).live('submit.rails', disable_with_input_function);
|
144
|
+
|
145
|
+
$(disable_with_form_remote_selector).live('ajax:complete.rails', function () {
|
146
|
+
$(this).find(disable_with_input_selector).each(function () {
|
147
|
+
var input = $(this);
|
148
|
+
input.removeAttr('disabled')
|
149
|
+
.val(input.data('enable-with'));
|
150
|
+
});
|
151
|
+
});
|
152
|
+
|
153
|
+
var jqueryVersion = $().jquery;
|
154
|
+
|
155
|
+
if (!( (jqueryVersion === '1.4.3') || (jqueryVersion === '1.4.4'))){
|
156
|
+
alert('This rails.js does not support the jQuery version you are using. Please read documentation.');
|
157
|
+
}
|
158
|
+
|
159
|
+
});
|
@@ -0,0 +1,39 @@
|
|
1
|
+
/* RESET CSS by http://meyerweb.com/eric/tools/css/reset/ */
|
2
|
+
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
|
3
|
+
body {line-height:1;}
|
4
|
+
ol, ul {list-style:none;}
|
5
|
+
blockquote, q {quotes:none;}
|
6
|
+
blockquote:before, blockquote:after, q:before, q:after {content:''; content:none;}
|
7
|
+
:focus {outline:0;} /* remember to define focus styles! */
|
8
|
+
ins {text-decoration:none;} /* remember to highlight inserts somehow! */
|
9
|
+
del {text-decoration:line-through;}
|
10
|
+
table {border-collapse:collapse; border-spacing:0;} /* tables still need 'cellspacing="0"' in the markup */
|
11
|
+
.clear { clear:both; display:block; overflow:hidden; visibility:hidden; width:0; height:0;} /* source: http://sonspring.com/journal/clearing-floats */
|
12
|
+
|
13
|
+
/* BEGIN SQUARE GRID CODE */
|
14
|
+
body {background-color:#f4f4f4; font-size:62.5%; line-height:28px; /* for RTL add: 'direction: rtl;' */ }
|
15
|
+
|
16
|
+
/* your main wrapping div */
|
17
|
+
#wrapper{ margin: 0 auto; position:relative; overflow: hidden; width: 994px;background:#fff url(../images/sg_grid_sub.png) center top repeat; }
|
18
|
+
#container{width:1008px; /* essential */ margin-left:-7px;}
|
19
|
+
|
20
|
+
/* global styling to apply to all columns */
|
21
|
+
.sg-1, .sg-2, .sg-3, .sg-4, .sg-5, .sg-6, .sg-7, .sg-8, .sg-9, .sg-10, .sg-11, .sg-12, .sg-13, .sg-14, .sg-15, .sg-16, .sg-17, .sg-18, .sg-19, .sg-20, .sg-21, .sg-22, .sg-23, .sg-24, .sg-25, .sg-26, .sg-27, .sg-28, .sg-29, .sg-30, .sg-31, .sg-32, .sg-33, .sg-34, .sg-35
|
22
|
+
{margin:0px 14px 28px 14px; float:left; /* for RTL change float to 'right' */ }
|
23
|
+
|
24
|
+
/* if you want to have a div as a parent with divs inside - add this class to parent div */
|
25
|
+
.sgParent{margin:0px;}
|
26
|
+
|
27
|
+
/* essential: width for all columns */
|
28
|
+
.sg-1{width:28px} .sg-2{width:56px} .sg-3{width:84px} .sg-4{width:112px} .sg-5{width:140px} .sg-6{width:168px} .sg-7{width:196px} .sg-8{width:224px} .sg-9{width:252px} .sg-10{width:280px} .sg-11{width:308px} .sg-12{width:336px} .sg-13{width:364px} .sg-14{width:392px} .sg-15{width:420px} .sg-16{width:448px} .sg-17{width:476px} .sg-18{width:504px} .sg-19{width:532px} .sg-20{width:560px} .sg-21{width:588px} .sg-22{width:616px} .sg-23{width:644px} .sg-24{width:672px} .sg-25{width:700px} .sg-26{width:728px} .sg-27{width:756px} .sg-28{width:784px} .sg-29{width:812px} .sg-30{width:840px} .sg-31{width:868px} .sg-32{width:896px} .sg-33{width:924px} .sg-34{width:952px} .sg-35{width:980px}
|
29
|
+
|
30
|
+
/* add a dividing border to the right or left simply by addiing one of these classes to a div */
|
31
|
+
.borderRight{border-right:1px solid #222; margin-right:0px; padding-right:13px;}
|
32
|
+
.borderLeft {border-left:1px solid #222; margin-left:0px; padding-left:13px;}
|
33
|
+
|
34
|
+
/* CONTROLLER - optional */
|
35
|
+
#controller{position:fixed; top:14px; right:14px; z-index:9999;}
|
36
|
+
#controller ul{border-color:#222; border-style:solid; border-width:0px 1px;}
|
37
|
+
#controller ul li a{color:#222; display:block; font:14px/26px Verdana ; height:26px; width:26px; margin:1px; text-align:center; text-decoration:none;}
|
38
|
+
#controller ul li a:hover{font-weight:bold;}
|
39
|
+
#controller ul li.selected a{background-color:#222; color:#fff; font-weight:bold;}
|
@@ -0,0 +1,176 @@
|
|
1
|
+
body {
|
2
|
+
|
3
|
+
background-color: #eee;
|
4
|
+
margin: 12px;
|
5
|
+
|
6
|
+
}
|
7
|
+
|
8
|
+
/* Typography (baseline grid should be divisible by 12px) */
|
9
|
+
|
10
|
+
body, form, input, textarea, select, select option {
|
11
|
+
|
12
|
+
font: 16px/1.5 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
13
|
+
color: #333;
|
14
|
+
|
15
|
+
}
|
16
|
+
|
17
|
+
h1, h2, h3, h4, h5, h6, lh {
|
18
|
+
|
19
|
+
font-weight: bold;
|
20
|
+
text-shadow: 0 1px 0 #fff;
|
21
|
+
|
22
|
+
}
|
23
|
+
|
24
|
+
h1 {
|
25
|
+
|
26
|
+
font-size: 3.5em;
|
27
|
+
line-height: 1.3;
|
28
|
+
letter-spacing: -.05em;
|
29
|
+
margin-bottom: .43em;
|
30
|
+
|
31
|
+
}
|
32
|
+
|
33
|
+
h2 {
|
34
|
+
|
35
|
+
font-size: 2.5em;
|
36
|
+
line-height: 1.2;
|
37
|
+
letter-spacing: -.025em;
|
38
|
+
margin-bottom: .6em;
|
39
|
+
|
40
|
+
}
|
41
|
+
|
42
|
+
h3, lh {
|
43
|
+
|
44
|
+
font-size: 1.875em;
|
45
|
+
line-height: 1.2;
|
46
|
+
margin-bottom: .8em;
|
47
|
+
|
48
|
+
}
|
49
|
+
|
50
|
+
h4 {
|
51
|
+
|
52
|
+
font-size: 1.625em;
|
53
|
+
line-height: 1.4;
|
54
|
+
margin-bottom: .95em;
|
55
|
+
|
56
|
+
}
|
57
|
+
|
58
|
+
h5 {
|
59
|
+
|
60
|
+
font-size: 1em;
|
61
|
+
margin-bottom: 1.5em;
|
62
|
+
|
63
|
+
}
|
64
|
+
|
65
|
+
h6 {
|
66
|
+
|
67
|
+
font-size: 0.875em;
|
68
|
+
line-height: 1.75em;
|
69
|
+
margin-bottom: 1.75em;
|
70
|
+
|
71
|
+
}
|
72
|
+
|
73
|
+
p {
|
74
|
+
|
75
|
+
margin-bottom: 1.5em;
|
76
|
+
|
77
|
+
}
|
78
|
+
|
79
|
+
hr {
|
80
|
+
|
81
|
+
border: 0;
|
82
|
+
border-bottom: 1px solid #fff;
|
83
|
+
height: 1px;
|
84
|
+
background-color: #ccc;
|
85
|
+
|
86
|
+
}
|
87
|
+
|
88
|
+
|
89
|
+
/* Form styles */
|
90
|
+
|
91
|
+
div.field, div.actions {
|
92
|
+
|
93
|
+
margin-bottom: 12px;
|
94
|
+
|
95
|
+
}
|
96
|
+
|
97
|
+
label {
|
98
|
+
|
99
|
+
font-size: .875em;
|
100
|
+
font-weight: bold;
|
101
|
+
color: #555;
|
102
|
+
|
103
|
+
}
|
104
|
+
|
105
|
+
input[type="text"], input[type="email"], input[type="password"], textarea {
|
106
|
+
|
107
|
+
border: 1px solid #aaa;
|
108
|
+
padding: 3px 6px;
|
109
|
+
|
110
|
+
}
|
111
|
+
|
112
|
+
|
113
|
+
/* Rails scaffold flash messages and errors */
|
114
|
+
|
115
|
+
#notice, .success {
|
116
|
+
|
117
|
+
background-color: #ccffcc;
|
118
|
+
color: #006600;
|
119
|
+
border: 1px solid #006600;
|
120
|
+
padding: 6px 12px;
|
121
|
+
|
122
|
+
}
|
123
|
+
|
124
|
+
#alert, .notice {
|
125
|
+
|
126
|
+
background-color: #ffff99;
|
127
|
+
color: #996633;
|
128
|
+
border: 1px solid #996633;
|
129
|
+
padding: 6px 12px;
|
130
|
+
|
131
|
+
}
|
132
|
+
|
133
|
+
.field_with_errors {
|
134
|
+
|
135
|
+
display: inline;
|
136
|
+
|
137
|
+
}
|
138
|
+
|
139
|
+
.field_with_errors input {
|
140
|
+
|
141
|
+
padding: 2px;
|
142
|
+
background-color: #ffcccc;
|
143
|
+
border: 1px solid #990000;
|
144
|
+
|
145
|
+
}
|
146
|
+
|
147
|
+
#error_explanation {
|
148
|
+
|
149
|
+
width: 450px;
|
150
|
+
border: 2px solid red;
|
151
|
+
padding: 7px;
|
152
|
+
padding-bottom: 0;
|
153
|
+
margin-bottom: 20px;
|
154
|
+
background-color: #f0f0f0;
|
155
|
+
|
156
|
+
}
|
157
|
+
|
158
|
+
#error_explanation h2 {
|
159
|
+
|
160
|
+
text-align: left;
|
161
|
+
font-weight: bold;
|
162
|
+
padding: 5px 5px 5px 15px;
|
163
|
+
font-size: 12px;
|
164
|
+
margin: -7px;
|
165
|
+
margin-bottom: 0px;
|
166
|
+
background-color: #c00;
|
167
|
+
color: #fff;
|
168
|
+
|
169
|
+
}
|
170
|
+
|
171
|
+
#error_explanation ul li {
|
172
|
+
|
173
|
+
font-size: 12px;
|
174
|
+
list-style: square;
|
175
|
+
|
176
|
+
}
|