source: VirtualCollectionRegistry/trunk/VirtualCollectionRegistry/src/main/webapp/css/_wizard.scss @ 5574

Last change on this file since 5574 was 5574, checked in by Twan Goosen, 10 years ago

Styling of the wizard
Refs #594

File size: 5.7 KB
Line 
1/*
2Copyright (C) 2014 CLARIN
3
4This program is free software: you can redistribute it and/or modify
5it under the terms of the GNU General Public License as published by
6the Free Software Foundation, either version 3 of the License, or
7(at your option) any later version.
8
9This program is distributed in the hope that it will be useful,
10but WITHOUT ANY WARRANTY; without even the implied warranty of
11MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
12GNU General Public License for more details.
13
14You should have received a copy of the GNU General Public License
15along with this program.  If not, see <http://www.gnu.org/licenses/>.
16*/
17
18div.wizard {
19
20    .wicketExtensionsWizardHeaderTitle {
21        padding: 0px 10px;
22        font-size: 16px;
23        font-weight: bold;
24    }
25
26    .wicketExtensionsWizardHeaderSummary {
27        padding: 5px 10px 0 10px;
28        font-style: italics;
29    }
30
31    .wizardHeader {
32        border-bottom: 1px solid #000000;
33        margin: 0 0 10px 0;
34        padding: 0 0 10px 0;
35    }
36
37    .wizardFeedback {
38        // redundant because of global feedback, suppress
39        display: none !important;
40    }
41
42}
43
44form.wizard {
45    margin: 5px 4px;
46    padding: 0;
47    font-size: 100%;
48    width: 978px;
49    min-width: 978px;
50}
51
52form.wizard fieldset,
53div.wizard div.fieldset {
54    clear: both;
55    font-size: 100%;
56    border: none;
57    padding: 0 10px 0 10px;
58    margin: 0 0 0 0;
59}
60
61form.wizard div,
62div.editDialog div {
63    clear: left;
64    display: block;
65    /*  width: 354px;
66      zoom: 1;
67      margin: 5px 0 0 0;
68      padding: 1px 3px;
69    */
70}
71
72form.wizard .extrainfo {
73    margin-left: 50px;
74}
75
76$help-icon-size: 16px;
77
78form.wizard .extrainfo a.extrainfotoggle {
79    display: inline-block;
80    float: right;
81    vertical-align: top;
82    width: $help-icon-size;
83    height: $help-icon-size;
84    /* icon from GLYPHICONS.com */
85    background-image: url(../icons/glyphicons_194_circle_question_mark.png);
86    background-size: $help-icon-size;
87    background-repeat: no-repeat;
88}
89
90form.wizard {
91
92    .extrainfo a.extrainfotoggle span {
93        display: none;
94    }
95
96    div.notes, div.sidenotes {
97        display: inline-block;
98        height: auto;
99        padding: 5px;
100        border: 1px solid #666666;
101        background-color: #ffffe1;
102        color: #666666;
103    }
104
105    div.notes {
106        width: 80%;
107        margin: 0 0 10px 70px;
108    }
109
110    div.sidenotes {
111        float: right;
112        width: 198px;
113        margin: 0 0 10px 10px;
114    }
115
116    div.notes h4 {
117        /*
118        background-image: url(/images/icon_info.gif);
119        background-repeat: no-repeat;
120        background-position: top left;
121        */
122        text-align: center;
123        padding: 3px 0 3px 0; /*27px; */
124        margin: 0 0 3px 0;
125        border-width: 0 0 1px 0;
126        border-style: solid;
127        border-color: #666666;
128        color: #666666;
129        font-size: 100%;
130    }
131
132    div.notes p {
133        margin: 0em 0em 0.5em 0em;
134        color: #666666;
135        font-size: 80%;
136    }
137
138    div.notes p.last {
139        margin: 0em;
140    }
141
142    div label {
143        display: block;
144        float: left;
145        width: 140px;
146        padding: 3px 10px;
147        margin: 0 0 5px 0;
148        text-align: right;
149        font-weight: normal;
150    }
151
152
153    textarea {
154        font-family: Verdana, sans-serif;
155        font-size: 100%;
156        width: 570px;
157        overflow: auto;
158        margin-bottom: 5px;
159    }
160
161    .wizardButtons {
162        border-top: 1px solid #000000;
163        margin: 10px 0 0 0;
164        clear: both;
165    }
166
167    .buttonbar {
168        margin: 10px 220px 0 0;
169        padding: 0 10px 0 0;
170        text-align: right; 
171    }
172} //form.wizard
173
174
175form.wizard .buttonbar, div.modalDialog div.modalDialogButtons {
176
177    input.button:hover {
178        color: #AE0000;
179        background-color: #E9EEF7;
180    }
181
182    input.button[disabled],input.button[disabled]:hover {
183        color: #AFAFAF;
184        border-color: #EFEFEF;
185    }
186}
187
188div.required label,
189label.required {
190    font-weight: bold !important;
191}
192
193/*
194 * modal dialog
195 */
196div.modalDialog {
197    margin: 0;
198    padding: 0;
199
200    div.modalDialogContent {
201        margin: 10px;
202       
203        p {
204            margin: 1em;
205        }
206    }
207
208    div.modalDialogButtons {
209        border-top: 1px solid #BBBBBB;
210        margin: 0 5px 5px 5px;
211        padding: 5px 0 0 0;
212        text-align: center;
213    }
214}
215
216
217div.confirmationDialog {
218    text-align: center;
219}
220
221div.longConfirmationDialog {
222    text-align: left;
223}
224
225div.editDialog fieldset {
226    border: none;
227    margin: 0;
228    padding: 0;
229}
230
231div.editDialog fieldset label {
232    display: block;
233    float: left;
234    /* width: 100px; */
235    padding: 3px 5px 3px 0;
236    margin: 0 0 5px 0;
237    text-align: right;
238}
239
240/*
241 * dialog customizations
242 */
243div.editCreatorDialog fieldset {
244
245    label {
246        width: 7em;
247    }
248
249    input, textarea {
250        width: 17em;
251    }
252}
253
254div.editResourceDialog fieldset {
255
256    label {
257        width: 6em;
258    }
259
260    input, textarea {
261        width: 30em;
262    }
263}
264
265div.addResourcesDialog fieldset {
266
267    label {
268        width: 6em;
269    }
270
271    input, textarea {
272        width: 30em;
273    }
274}
275
276div.addKeywordDialog fieldset input {
277    width: 20em;
278}
279
280/*
281 * create virtual collection wizard
282 */
283div.wizard a {
284    font-weight: normal;
285}
286
287div.keywordsList {
288    clear: none !important;
289    width: 602px;
290    margin-left: 160px;
291    padding: 3px 0;
292
293
294    div {
295        clear: none;
296    }
297
298    ul {
299        list-style-type: square;
300        margin: 0;
301        padding: 0 0 0 16px;
302
303        li {
304            margin-top: 2px;
305        }
306
307        li.first {
308            margin-top: 0;
309        }
310    }
311}
312
313
314input.button {
315    padding: 1px 4px;
316    margin: 0 2px;
317    color: #000000;
318    background-color: #E9EEF7;
319    border: 2px solid #D4DEEF;
320    border-radius: 4px;
321    -moz-border-radius: 4px;
322}
Note: See TracBrowser for help on using the repository browser.