1 |
.page |
---|
2 |
/* Defines the page style. |
---|
3 |
- Basic usage sets the background colour. */ |
---|
4 |
{ |
---|
5 |
background-color: #eeeeee; |
---|
6 |
} |
---|
7 |
|
---|
8 |
.layoutTable |
---|
9 |
/* Defines the style of the main layout table. |
---|
10 |
- Basic usage sets the background colour, which acts as an outline. |
---|
11 |
- Every popup must use a table with 1 column and as many rows as are |
---|
12 |
needed for the popup. Basic popups with an OK or CANCEL button would |
---|
13 |
use a layout table with 2 rows, while more advanced popups like the |
---|
14 |
SEARCH popup use 3 rows, one for the search, one for the results, |
---|
15 |
and one for the OK, CANCEL buttons */ |
---|
16 |
{ |
---|
17 |
background-color: #666666; |
---|
18 |
} |
---|
19 |
|
---|
20 |
.titleArea |
---|
21 |
/* Defines the style for the title table. |
---|
22 |
- Every popup has a title table as the first table within the layout table*/ |
---|
23 |
{ |
---|
24 |
background-color: #aaaaaa; |
---|
25 |
border-top-width: 1px; |
---|
26 |
border-right-width: 1px; |
---|
27 |
border-bottom-width: 1px; |
---|
28 |
border-left-width: 1px; |
---|
29 |
border-top-style: solid; |
---|
30 |
border-right-style: solid; |
---|
31 |
border-bottom-style: solid; |
---|
32 |
border-left-style: solid; |
---|
33 |
border-top-color: #FFFFFF; |
---|
34 |
border-right-color: #999999; |
---|
35 |
border-bottom-color: #999999; |
---|
36 |
border-left-color: #FFFFFF; |
---|
37 |
} |
---|
38 |
|
---|
39 |
.title |
---|
40 |
/* Defines the style for the title text. |
---|
41 |
- Every popup has a title this sets the font, size, colour etc.*/ |
---|
42 |
{ |
---|
43 |
font-family: Arial, Helvetica, sans-serif; |
---|
44 |
font-size: 15px; |
---|
45 |
font-weight: bold; |
---|
46 |
color: #000000; |
---|
47 |
vertical-align: middle; |
---|
48 |
text-align: left; |
---|
49 |
} |
---|
50 |
|
---|
51 |
.contentArea |
---|
52 |
/* Defines the style of content layout tables. |
---|
53 |
- Basic usage sets the background colour of the content areas. |
---|
54 |
- Every popup must use at least 1 content layout table, but often use 2, |
---|
55 |
one for the help text, and one to layout the popup's input elements. |
---|
56 |
- For best results this table should have cellspacing="0" otherwise the |
---|
57 |
colour of the page or layoutTable will show through. */ |
---|
58 |
{ |
---|
59 |
background-color: #D9D9D9; |
---|
60 |
border-top-width: 1px; |
---|
61 |
border-right-width: 1px; |
---|
62 |
border-bottom-width: 1px; |
---|
63 |
border-left-width: 1px; |
---|
64 |
border-top-style: solid; |
---|
65 |
border-right-style: solid; |
---|
66 |
border-bottom-style: solid; |
---|
67 |
border-left-style: solid; |
---|
68 |
border-top-color: #FFFFFF; |
---|
69 |
border-right-color: #999999; |
---|
70 |
border-bottom-color: #999999; |
---|
71 |
border-left-color: #FFFFFF; |
---|
72 |
} |
---|
73 |
|
---|
74 |
.contentArea2 |
---|
75 |
/* Defines the style of content layout tables. |
---|
76 |
- Basic usage sets the background colour of the content areas. |
---|
77 |
- Every popup must use at least 1 content layout table, but often use 2, |
---|
78 |
one for the help text, and one to layout the popup's input elements. |
---|
79 |
- For best results this table should have cellspacing="0" otherwise the |
---|
80 |
colour of the page or layoutTable will show through. */ |
---|
81 |
{ |
---|
82 |
background-color: #F0F0F0; |
---|
83 |
border-top-width: 1px; |
---|
84 |
border-right-width: 1px; |
---|
85 |
border-bottom-width: 1px; |
---|
86 |
border-left-width: 1px; |
---|
87 |
border-top-style: solid; |
---|
88 |
border-right-style: solid; |
---|
89 |
border-bottom-style: solid; |
---|
90 |
border-left-style: solid; |
---|
91 |
border-top-color: #FFFFFF; |
---|
92 |
border-right-color: #999999; |
---|
93 |
border-bottom-color: #999999; |
---|
94 |
border-left-color: #FFFFFF; |
---|
95 |
} |
---|
96 |
|
---|
97 |
.subLayoutTable |
---|
98 |
/* Defines the style of secondary (nested) layout tables. |
---|
99 |
- Basic usage sets the background colour, which acts as an outline; |
---|
100 |
similar in usage to layoutTable. |
---|
101 |
- This allows for more advanced designs like the layer browser dialogue. */ |
---|
102 |
{ |
---|
103 |
background-color: #666666; |
---|
104 |
} |
---|
105 |
|
---|
106 |
.subContentArea1 |
---|
107 |
/* Defines the style of tables or cells in secondary layout tables. |
---|
108 |
- Basic usage sets the background colour of a sub content areas. |
---|
109 |
- This allows for more advanced designs and is intended to be used |
---|
110 |
with subLayoutTable (either styling cells, or nested-tables). */ |
---|
111 |
{ |
---|
112 |
background-color: #ffffff; |
---|
113 |
border-top-width: 1px; |
---|
114 |
border-right-width: 1px; |
---|
115 |
border-bottom-width: 1px; |
---|
116 |
border-left-width: 1px; |
---|
117 |
border-top-style: solid; |
---|
118 |
border-right-style: solid; |
---|
119 |
border-bottom-style: solid; |
---|
120 |
border-left-style: solid; |
---|
121 |
border-top-color: #999999; |
---|
122 |
border-right-color: #FFFFFF; |
---|
123 |
border-bottom-color: #FFFFFF; |
---|
124 |
border-left-color: #999999; |
---|
125 |
} |
---|
126 |
|
---|
127 |
.subContentArea2 |
---|
128 |
/* Defines an alternate style of tables or cells in secondary layout tables. |
---|
129 |
- Used in the same way as subContentArea1. */ |
---|
130 |
{ |
---|
131 |
background-color: #D9D9D9; |
---|
132 |
border-top-width: 1px; |
---|
133 |
border-right-width: 1px; |
---|
134 |
border-bottom-width: 1px; |
---|
135 |
border-left-width: 1px; |
---|
136 |
border-top-style: solid; |
---|
137 |
border-right-style: solid; |
---|
138 |
border-bottom-style: solid; |
---|
139 |
border-left-style: solid; |
---|
140 |
border-top-color: #999999; |
---|
141 |
border-right-color: #FFFFFF; |
---|
142 |
border-bottom-color: #FFFFFF; |
---|
143 |
border-left-color: #999999; |
---|
144 |
} |
---|
145 |
|
---|
146 |
.helpArea |
---|
147 |
/* Defines the style of the help area. |
---|
148 |
- Basic useage sets the styling of the <p> that surrounds the help text. */ |
---|
149 |
{ |
---|
150 |
font-family: Arial, Helvetica, sans-serif; |
---|
151 |
font-size: 10px; |
---|
152 |
color: #666666; |
---|
153 |
background-color: #FFFFFF; |
---|
154 |
border: 1px solid #666666; |
---|
155 |
width: 400px; |
---|
156 |
text-align: left; |
---|
157 |
} |
---|
158 |
|
---|
159 |
.label |
---|
160 |
/* Defines the style of text labels. |
---|
161 |
- Basic useage sets the size, colour and font of any labels of input |
---|
162 |
elements. */ |
---|
163 |
{ |
---|
164 |
font-family: Arial, Helvetica, sans-serif; |
---|
165 |
font-size: 12px; |
---|
166 |
color: #000000; |
---|
167 |
} |
---|
168 |
|
---|
169 |
.note |
---|
170 |
/* Defines the style of text notes. |
---|
171 |
- Basic useage sets the size, colour and font of any small notes |
---|
172 |
Also used in the legend for small text. */ |
---|
173 |
{ |
---|
174 |
font-family: Arial, Helvetica, sans-serif; |
---|
175 |
font-size: 9px; |
---|
176 |
color: #333333; |
---|
177 |
} |
---|
178 |
|
---|
179 |
.text |
---|
180 |
/* Defines the style of text blocks. |
---|
181 |
- Basic useage sets the size, colour and font of <p>, <span> or |
---|
182 |
<div> tags. */ |
---|
183 |
{ |
---|
184 |
font-family: Arial, Helvetica, sans-serif; |
---|
185 |
font-size: 12px; |
---|
186 |
color: #000000; |
---|
187 |
} |
---|
188 |
|
---|
189 |
.list |
---|
190 |
/* Defines the style of ordered and unordered lists. |
---|
191 |
- Basic useage sets the size, colour and font of any <ul>, <ol> tag. */ |
---|
192 |
{ |
---|
193 |
font-family: Arial, Helvetica, sans-serif; |
---|
194 |
font-size: 12px; |
---|
195 |
color: #000000; |
---|
196 |
} |
---|
197 |
|
---|
198 |
.listItem |
---|
199 |
/* Defines the style of list items. |
---|
200 |
- Basic useage sets the size, colour and font of any <li> tag. |
---|
201 |
Normally would be the same as list, but more advanced techniques |
---|
202 |
can be used as well.*/ |
---|
203 |
{ |
---|
204 |
font-family: Arial, Helvetica, sans-serif; |
---|
205 |
font-size: 12px; |
---|
206 |
color: #000000; |
---|
207 |
} |
---|
208 |
|
---|
209 |
.inputBox |
---|
210 |
/* Defines the style of text input elements. |
---|
211 |
- Basic useage sets the font and size of any input elements' text. |
---|
212 |
- More advanced useage sets the styling of the input area as well. */ |
---|
213 |
{ |
---|
214 |
font-family: Arial, Helvetica, sans-serif; |
---|
215 |
font-size: 11px; |
---|
216 |
color: #000000; |
---|
217 |
background-color: #FFFFFF; |
---|
218 |
padding: 3px; |
---|
219 |
border: 1px solid #666666; |
---|
220 |
} |
---|
221 |
|
---|
222 |
.inputList |
---|
223 |
/* Defines the style of list input elements. |
---|
224 |
- Basic useage sets the font and size of any input elements' text. |
---|
225 |
- More advanced useage sets the styling of the input area as well. */ |
---|
226 |
{ |
---|
227 |
font-family: Arial, Helvetica, sans-serif; |
---|
228 |
font-size: 11px; |
---|
229 |
color: #000000; |
---|
230 |
background-color: #FFFFFF; |
---|
231 |
} |
---|
232 |
|
---|
233 |
.nnInputWrap |
---|
234 |
/* Workaround to define the style of input elements for nn4.x. |
---|
235 |
- Sets the font and size of input elements' text. */ |
---|
236 |
{ |
---|
237 |
font-family: Arial, Helvetica, sans-serif; |
---|
238 |
font-size: 11px; |
---|
239 |
color: #000000; |
---|
240 |
} |
---|