|
1 /**************************************************************************** |
|
2 ** |
|
3 ** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). |
|
4 ** All rights reserved. |
|
5 ** Contact: Nokia Corporation (qt-info@nokia.com) |
|
6 ** |
|
7 ** This file is part of the documentation of the Qt Toolkit. |
|
8 ** |
|
9 ** $QT_BEGIN_LICENSE:LGPL$ |
|
10 ** No Commercial Usage |
|
11 ** This file contains pre-release code and may not be distributed. |
|
12 ** You may use this file in accordance with the terms and conditions |
|
13 ** contained in the Technology Preview License Agreement accompanying |
|
14 ** this package. |
|
15 ** |
|
16 ** GNU Lesser General Public License Usage |
|
17 ** Alternatively, this file may be used under the terms of the GNU Lesser |
|
18 ** General Public License version 2.1 as published by the Free Software |
|
19 ** Foundation and appearing in the file LICENSE.LGPL included in the |
|
20 ** packaging of this file. Please review the following information to |
|
21 ** ensure the GNU Lesser General Public License version 2.1 requirements |
|
22 ** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. |
|
23 ** |
|
24 ** In addition, as a special exception, Nokia gives you certain additional |
|
25 ** rights. These rights are described in the Nokia Qt LGPL Exception |
|
26 ** version 1.1, included in the file LGPL_EXCEPTION.txt in this package. |
|
27 ** |
|
28 ** If you have questions regarding the use of this file, please contact |
|
29 ** Nokia at qt-info@nokia.com. |
|
30 ** |
|
31 ** |
|
32 ** |
|
33 ** |
|
34 ** |
|
35 ** |
|
36 ** |
|
37 ** |
|
38 ** $QT_END_LICENSE$ |
|
39 ** |
|
40 ****************************************************************************/ |
|
41 |
|
42 //! [0] |
|
43 QLineEdit { background: yellow } |
|
44 QCheckBox { color: red } |
|
45 //! [0] |
|
46 |
|
47 |
|
48 //! [1] |
|
49 QPushButton { color: red } |
|
50 //! [1] |
|
51 |
|
52 |
|
53 //! [2] |
|
54 QPushButton, QLineEdit, QComboBox { color: red } |
|
55 //! [2] |
|
56 |
|
57 |
|
58 //! [3] |
|
59 QPushButton { color: red } |
|
60 QLineEdit { color: red } |
|
61 QComboBox { color: red } |
|
62 //! [3] |
|
63 |
|
64 |
|
65 //! [4] |
|
66 QPushButton { color: red; background-color: white } |
|
67 //! [4] |
|
68 |
|
69 |
|
70 //! [5] |
|
71 QComboBox::drop-down { image: url(dropdown.png) } |
|
72 //! [5] |
|
73 |
|
74 |
|
75 //! [6] |
|
76 QComboBox { |
|
77 margin-right: 20px; |
|
78 } |
|
79 QComboBox::drop-down { |
|
80 subcontrol-origin: margin; |
|
81 } |
|
82 //! [6] |
|
83 |
|
84 |
|
85 //! [7] |
|
86 QComboBox::down-arrow { |
|
87 image: url(down_arrow.png); |
|
88 } |
|
89 QComboBox::down-arrow:pressed { |
|
90 position: relative; |
|
91 top: 1px; left: 1px; |
|
92 } |
|
93 //! [7] |
|
94 |
|
95 |
|
96 //! [8] |
|
97 QPushButton:hover { color: white } |
|
98 //! [8] |
|
99 |
|
100 |
|
101 //! [9] |
|
102 QRadioButton:!hover { color: red } |
|
103 //! [9] |
|
104 |
|
105 |
|
106 //! [10] |
|
107 QCheckBox:hover:checked { color: white } |
|
108 //! [10] |
|
109 |
|
110 |
|
111 //! [11] |
|
112 QPushButton:hover:!pressed { color: blue; } |
|
113 //! [11] |
|
114 |
|
115 |
|
116 //! [12] |
|
117 QCheckBox:hover, QCheckBox:checked { color: white } |
|
118 //! [12] |
|
119 |
|
120 |
|
121 //! [13] |
|
122 QComboBox::drop-down:hover { image: url(dropdown_bright.png) } |
|
123 //! [13] |
|
124 |
|
125 |
|
126 //! [14] |
|
127 QPushButton#okButton { color: gray } |
|
128 QPushButton { color: red } |
|
129 //! [14] |
|
130 |
|
131 |
|
132 //! [15] |
|
133 QPushButton:hover { color: white } |
|
134 QPushButton { color: red } |
|
135 //! [15] |
|
136 |
|
137 |
|
138 //! [16] |
|
139 QPushButton:hover { color: white } |
|
140 QPushButton:enabled { color: red } |
|
141 //! [16] |
|
142 |
|
143 |
|
144 //! [17] |
|
145 QPushButton:enabled { color: red } |
|
146 QPushButton:hover { color: white } |
|
147 //! [17] |
|
148 |
|
149 |
|
150 //! [18] |
|
151 QPushButton:hover:enabled { color: white } |
|
152 QPushButton:enabled { color: red } |
|
153 //! [18] |
|
154 |
|
155 |
|
156 //! [19] |
|
157 QPushButton { color: red } |
|
158 QAbstractButton { color: gray } |
|
159 //! [19] |
|
160 |
|
161 |
|
162 //! [20] |
|
163 * {} /* a=0 b=0 c=0 -> specificity = 0 */ |
|
164 LI {} /* a=0 b=0 c=1 -> specificity = 1 */ |
|
165 UL LI {} /* a=0 b=0 c=2 -> specificity = 2 */ |
|
166 UL OL+LI {} /* a=0 b=0 c=3 -> specificity = 3 */ |
|
167 H1 + *[REL=up]{} /* a=0 b=1 c=1 -> specificity = 11 */ |
|
168 UL OL LI.red {} /* a=0 b=1 c=3 -> specificity = 13 */ |
|
169 LI.red.level {} /* a=0 b=2 c=1 -> specificity = 21 */ |
|
170 #x34y {} /* a=1 b=0 c=0 -> specificity = 100 */ |
|
171 //! [20] |
|
172 |
|
173 |
|
174 //! [21] |
|
175 qApp->setStyleSheet("QPushButton { color: white }"); |
|
176 //! [21] |
|
177 |
|
178 |
|
179 //! [22] |
|
180 myPushButton->setStyleSheet("* { color: blue }"); |
|
181 //! [22] |
|
182 |
|
183 |
|
184 //! [23] |
|
185 myPushButton->setStyleSheet("color: blue"); |
|
186 //! [23] |
|
187 |
|
188 |
|
189 //! [24] |
|
190 qApp->setStyleSheet("QGroupBox { color: red; } "); |
|
191 //! [24] |
|
192 |
|
193 |
|
194 //! [25] |
|
195 qApp->setStyleSheet("QGroupBox, QGroupBox * { color: red; }"); |
|
196 //! [25] |
|
197 |
|
198 |
|
199 //! [26] |
|
200 class MyPushButton : public QPushButton { |
|
201 // ... |
|
202 } |
|
203 |
|
204 // ... |
|
205 qApp->setStyleSheet("MyPushButton { background: yellow; }"); |
|
206 //! [26] |
|
207 |
|
208 |
|
209 //! [27] |
|
210 namespace ns { |
|
211 class MyPushButton : public QPushButton { |
|
212 // ... |
|
213 } |
|
214 } |
|
215 |
|
216 // ... |
|
217 qApp->setSytleSheet("ns--MyPushButton { background: yellow; }"); |
|
218 //! [27] |
|
219 |
|
220 |
|
221 //! [28] |
|
222 MyLabel { qproperty-pixmap: url(pixmap.png); } |
|
223 MyGroupBox { qproperty-titleColor: rgb(100, 200, 100); } |
|
224 QPushButton { qproperty-iconSize: 20px 20px; } |
|
225 //! [28] |
|
226 |
|
227 |
|
228 //! [30] |
|
229 QPushButton { background-color: red; border: none; } |
|
230 //! [30] |
|
231 |
|
232 |
|
233 //! [31] |
|
234 QToolButton { background-color: red; border: none; } |
|
235 //! [31] |
|
236 |
|
237 |
|
238 //! [32] |
|
239 void CustomWidget::paintEvent(QPaintEvent *) |
|
240 { |
|
241 QStyleOption opt; |
|
242 opt.init(this); |
|
243 QPainter p(this); |
|
244 style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this); |
|
245 } |
|
246 //! [32] |
|
247 |
|
248 |
|
249 //! [33] |
|
250 QTreeView { |
|
251 alternate-background-color: blue; |
|
252 background: yellow; |
|
253 } |
|
254 //! [33] |
|
255 |
|
256 |
|
257 //! [34] |
|
258 QTextEdit { background: yellow } |
|
259 //! [34] |
|
260 |
|
261 |
|
262 //! [35] |
|
263 QLabel { |
|
264 background-image: url(dense6pattern.png); |
|
265 background-repeat: repeat-xy; |
|
266 } |
|
267 //! [35] |
|
268 |
|
269 |
|
270 //! [36] |
|
271 QLabel { background-color: yellow } |
|
272 QLineEdit { background-color: rgb(255, 0, 0) } |
|
273 //! [36] |
|
274 |
|
275 |
|
276 //! [37] |
|
277 QFrame { background-image: url(:/images/hydro.png) } |
|
278 //! [37] |
|
279 |
|
280 |
|
281 //! [38] |
|
282 QFrame { |
|
283 background: white url(:/images/ring.png); |
|
284 background-repeat: repeat-y; |
|
285 background-position: left; |
|
286 } |
|
287 //! [38] |
|
288 |
|
289 |
|
290 //! [39] |
|
291 QFrame { |
|
292 background: url(:/images/footer.png); |
|
293 background-position: bottom left; |
|
294 } |
|
295 //! [39] |
|
296 |
|
297 |
|
298 //! [40] |
|
299 QTextEdit { |
|
300 background-image: url("leaves.png"); |
|
301 background-attachment: fixed; |
|
302 } |
|
303 //! [40] |
|
304 |
|
305 |
|
306 //! [41] |
|
307 QFrame { |
|
308 background-image: url(:/images/header.png); |
|
309 background-position: top left; |
|
310 background-origin: content; |
|
311 background-clip: padding; |
|
312 } |
|
313 //! [41] |
|
314 |
|
315 |
|
316 //! [42] |
|
317 QFrame { |
|
318 background-image: url(:/images/header.png); |
|
319 background-position: top left; |
|
320 background-origin: content; |
|
321 } |
|
322 //! [42] |
|
323 |
|
324 |
|
325 //! [43] |
|
326 QLineEdit { border: 1px solid white } |
|
327 //! [43] |
|
328 |
|
329 |
|
330 //! [44] |
|
331 QLineEdit { |
|
332 border-width: 1px; |
|
333 border-style: solid; |
|
334 border-color: white; |
|
335 } |
|
336 //! [44] |
|
337 |
|
338 |
|
339 //! [45] |
|
340 QLineEdit { |
|
341 border-width: 1px; |
|
342 border-style: solid; |
|
343 border-radius: 4px; |
|
344 } |
|
345 //! [45] |
|
346 |
|
347 |
|
348 //! [46] |
|
349 QLineEdit { |
|
350 border-width: 1px; |
|
351 border-style: solid; |
|
352 border-color: blue; |
|
353 } |
|
354 //! [46] |
|
355 |
|
356 |
|
357 //! [47] |
|
358 QLineEdit { |
|
359 border-width: 2px; |
|
360 border-style: solid; |
|
361 border-color: darkblue; |
|
362 } |
|
363 //! [47] |
|
364 |
|
365 |
|
366 //! [48] |
|
367 QSpinBox::down-button { bottom: 2px } |
|
368 //! [48] |
|
369 |
|
370 |
|
371 //! [49] |
|
372 * { button-layout: 2 } |
|
373 //! [49] |
|
374 |
|
375 |
|
376 //! [50] |
|
377 QPushButton { color: red } |
|
378 //! [50] |
|
379 |
|
380 |
|
381 //! [51] |
|
382 QDialogButtonBox { dialogbuttonbox-buttons-have-icons: 1; } |
|
383 //! [51] |
|
384 |
|
385 |
|
386 //! [52] |
|
387 * { etch-disabled-text: 1 } |
|
388 //! [52] |
|
389 |
|
390 |
|
391 //! [53] |
|
392 QCheckBox { font: bold italic large "Times New Roman" } |
|
393 //! [53] |
|
394 |
|
395 |
|
396 //! [54] |
|
397 QCheckBox { font-family: "New Century Schoolbook" } |
|
398 //! [54] |
|
399 |
|
400 |
|
401 //! [55] |
|
402 QTextEdit { font-size: 12px } |
|
403 //! [55] |
|
404 |
|
405 |
|
406 //! [56] |
|
407 QTextEdit { font-style: italic } |
|
408 //! [56] |
|
409 |
|
410 |
|
411 //! [57] |
|
412 * { gridline-color: gray } |
|
413 //! [57] |
|
414 |
|
415 |
|
416 //! [58] |
|
417 QSpinBox::down-button { height: 10px } |
|
418 //! [58] |
|
419 |
|
420 |
|
421 //! [59] |
|
422 /* implicitly sets the size of down-button to the size of spindown.png */ |
|
423 QSpinBox::down-button { image: url(:/images/spindown.png) } |
|
424 //! [59] |
|
425 |
|
426 |
|
427 //! [60] |
|
428 QSpinBox::down-button { left: 2px } |
|
429 //! [60] |
|
430 |
|
431 |
|
432 //! [61] |
|
433 * { lineedit-password-character: 9679 } |
|
434 //! [61] |
|
435 |
|
436 |
|
437 //! [62] |
|
438 QLineEdit { margin: 2px } |
|
439 //! [62] |
|
440 |
|
441 |
|
442 //! [63] |
|
443 QSpinBox { max-height: 24px } |
|
444 //! [63] |
|
445 |
|
446 |
|
447 //! [64] |
|
448 QComboBox { max-width: 72px } |
|
449 //! [64] |
|
450 |
|
451 |
|
452 //! [65] |
|
453 QMessageBox { messagebox-text-interaction-flags: 5 } |
|
454 //! [65] |
|
455 |
|
456 |
|
457 //! [66] |
|
458 QComboBox { min-height: 24px } |
|
459 //! [66] |
|
460 |
|
461 |
|
462 //! [67] |
|
463 QComboBox { min-width: 72px } |
|
464 //! [67] |
|
465 |
|
466 |
|
467 //! [68] |
|
468 QToolTip { opacity: 223 } |
|
469 //! [68] |
|
470 |
|
471 |
|
472 //! [69] |
|
473 QLineEdit { padding: 3px } |
|
474 //! [69] |
|
475 |
|
476 |
|
477 //! [70] |
|
478 QSpinBox::down-button { right: 2px } |
|
479 //! [70] |
|
480 |
|
481 |
|
482 //! [71] |
|
483 QTextEdit { selection-background-color: darkblue } |
|
484 //! [71] |
|
485 |
|
486 |
|
487 //! [72] |
|
488 QTextEdit { selection-color: white } |
|
489 //! [72] |
|
490 |
|
491 |
|
492 //! [73] |
|
493 * { show-decoration-selected: 1 } |
|
494 //! [73] |
|
495 |
|
496 |
|
497 //! [74] |
|
498 QMenuBar { spacing: 10 } |
|
499 //! [74] |
|
500 |
|
501 |
|
502 //! [75] |
|
503 QSpinBox::up-button { |
|
504 image: url(:/images/spinup.png); |
|
505 subcontrol-origin: content; |
|
506 subcontrol-position: right top; |
|
507 } |
|
508 //! [75] |
|
509 |
|
510 |
|
511 //! [76] |
|
512 QSpinBox::down-button { |
|
513 image: url(:/images/spindown.png); |
|
514 subcontrol-origin: padding; |
|
515 subcontrol-position: right bottom; |
|
516 } |
|
517 //! [76] |
|
518 |
|
519 |
|
520 //! [77] |
|
521 QPushButton { |
|
522 text-align: left; |
|
523 } |
|
524 //! [77] |
|
525 |
|
526 |
|
527 //! [78] |
|
528 QSpinBox::up-button { top: 2px } |
|
529 //! [78] |
|
530 |
|
531 |
|
532 //! [79] |
|
533 QSpinBox::up-button { width: 12px } |
|
534 //! [79] |
|
535 |
|
536 |
|
537 //! [80] |
|
538 QTextEdit { background-position: bottom center } |
|
539 //! [80] |
|
540 |
|
541 |
|
542 //! [81] |
|
543 QDialog { etch-disabled-text: 1 } |
|
544 //! [81] |
|
545 |
|
546 |
|
547 //! [82] |
|
548 QLabel { border-color: red } /* red red red red */ |
|
549 QLabel { border-color: red blue } /* red blue red blue */ |
|
550 QLabel { border-color: red blue green } /* red blue green blue */ |
|
551 QLabel { border-color: red blue green yellow } /* red blue green yellow */ |
|
552 //! [82] |
|
553 |
|
554 |
|
555 //! [83] |
|
556 QLabel { border-width: 1px } /* 1px 1px 1px 1px */ |
|
557 QLabel { border-width: 1px 2px } /* 1px 2px 1px 2px */ |
|
558 QLabel { border-width: 1px 2px 3px } /* 1px 2px 3px 2px */ |
|
559 QLabel { border-width: 1px 2px 3px 4px } /* 1px 2px 3px 4px */ |
|
560 //! [83] |
|
561 |
|
562 |
|
563 //! [84] |
|
564 QLabel { border-color: red } /* opaque red */ |
|
565 QLabel { border-color: #FF0000 } /* opaque red */ |
|
566 QLabel { border-color: rgba(255, 0, 0, 75%) } /* 75% opaque red */ |
|
567 QLabel { border-color: rgb(255, 0, 0) } /* opaque red */ |
|
568 QLabel { border-color: rgb(100%, 0%, 0%) } /* opaque red */ |
|
569 QLabel { border-color: hsv(60, 255, 255) } /* opaque yellow */ |
|
570 QLabel { border-color: hsva(240, 255, 255, 75%) } /* 75% blue */ |
|
571 //! [84] |
|
572 |
|
573 |
|
574 //! [85] |
|
575 /* linear gradient from white to green */ |
|
576 QTextEdit { |
|
577 background: qlineargradient(x1:0, y1:0, x2:1, y2:1, |
|
578 stop:0 white, stop: 0.4 gray, stop:1 green) |
|
579 } |
|
580 |
|
581 /* linear gradient from white to green */ |
|
582 QTextEdit { |
|
583 background: qlineargradient(x1:0, y1:0, x2:1, y2:1, |
|
584 stop:0 white, stop: 0.4 rgba(10, 20, 30, 40), stop:1 rgb(0, 200, 230, 200)) |
|
585 } |
|
586 |
|
587 |
|
588 /* conical gradient from white to green */ |
|
589 QTextEdit { |
|
590 background: qconicalgradient(cx:0.5, cy:0.5, angle:30, |
|
591 stop:0 white, stop:1 #00FF00) |
|
592 } |
|
593 |
|
594 /* radial gradient from white to green */ |
|
595 QTextEdit { |
|
596 background: qradialgradient(cx:0, cy:0, radius: 1, |
|
597 fx:0.5, fy:0.5, stop:0 white, stop:1 green) |
|
598 } |
|
599 //! [85] |
|
600 |
|
601 |
|
602 //! [86] |
|
603 * { |
|
604 file-icon: url(file.png), |
|
605 url(file_selected.png) selected; |
|
606 } |
|
607 |
|
608 QMessageBox { |
|
609 dialogbuttonbox-buttons-have-icons: true; |
|
610 dialog-ok-icon: url(ok.svg); |
|
611 dialog-cancel-icon: url(cancel.png), url(grayed_cancel.png) disabled; |
|
612 } |
|
613 //! [86] |
|
614 |
|
615 |
|
616 //! [87] |
|
617 QPushButton { color: palette(dark); } |
|
618 //! [87] |
|
619 |
|
620 |
|
621 //! [88] |
|
622 qApp->setStyleSheet("QLineEdit { background-color: yellow }"); |
|
623 //! [88] |
|
624 |
|
625 |
|
626 //! [89] |
|
627 myDialog->setStyleSheet("QLineEdit { background-color: yellow }"); |
|
628 //! [89] |
|
629 |
|
630 |
|
631 //! [90] |
|
632 myDialog->setStyleSheet("QLineEdit#nameEdit { background-color: yellow }"); |
|
633 //! [90] |
|
634 |
|
635 |
|
636 //! [91] |
|
637 nameEdit->setStyleSheet("background-color: yellow"); |
|
638 //! [91] |
|
639 |
|
640 |
|
641 //! [92] |
|
642 nameEdit->setStyleSheet("color: blue; background-color: yellow"); |
|
643 //! [92] |
|
644 |
|
645 |
|
646 //! [93] |
|
647 nameEdit->setStyleSheet("color: blue;" |
|
648 "background-color: yellow;" |
|
649 "selection-color: yellow;" |
|
650 "selection-background-color: blue;"); |
|
651 //! [93] |
|
652 |
|
653 |
|
654 //! [94] |
|
655 *[mandatoryField="true"] { background-color: yellow } |
|
656 //! [94] |
|
657 |
|
658 |
|
659 //! [95] |
|
660 QLineEdit *nameEdit = new QLineEdit(this); |
|
661 nameEdit->setProperty("mandatoryField", true); |
|
662 |
|
663 QLineEdit *emailEdit = new QLineEdit(this); |
|
664 emailEdit->setProperty("mandatoryField", true); |
|
665 |
|
666 QSpinBox *ageSpinBox = new QSpinBox(this); |
|
667 ageSpinBox->setProperty("mandatoryField", true); |
|
668 //! [95] |
|
669 |
|
670 |
|
671 //! [96] |
|
672 QPushButton#evilButton { background-color: red } |
|
673 //! [96] |
|
674 |
|
675 |
|
676 //! [97] |
|
677 QPushButton#evilButton { |
|
678 background-color: red; |
|
679 border-style: outset; |
|
680 border-width: 2px; |
|
681 border-color: beige; |
|
682 } |
|
683 //! [97] |
|
684 |
|
685 |
|
686 //! [98] |
|
687 QPushButton#evilButton { |
|
688 background-color: red; |
|
689 border-style: outset; |
|
690 border-width: 2px; |
|
691 border-radius: 10px; |
|
692 border-color: beige; |
|
693 font: bold 14px; |
|
694 min-width: 10em; |
|
695 padding: 6px; |
|
696 } |
|
697 //! [98] |
|
698 |
|
699 |
|
700 //! [99] |
|
701 QPushButton#evilButton { |
|
702 background-color: red; |
|
703 border-style: outset; |
|
704 border-width: 2px; |
|
705 border-radius: 10px; |
|
706 border-color: beige; |
|
707 font: bold 14px; |
|
708 min-width: 10em; |
|
709 padding: 6px; |
|
710 } |
|
711 QPushButton#evilButton:pressed { |
|
712 background-color: rgb(224, 0, 0); |
|
713 border-style: inset; |
|
714 } |
|
715 //! [99] |
|
716 |
|
717 |
|
718 //! [100] |
|
719 QPushButton#evilButton::menu-indicator { |
|
720 image: url(myindicator.png); |
|
721 } |
|
722 //! [100] |
|
723 |
|
724 |
|
725 //! [101] |
|
726 QPushButton::menu-indicator { |
|
727 image: url(myindicator.png); |
|
728 subcontrol-position: right center; |
|
729 subcontrol-origin: padding; |
|
730 left: -2px; |
|
731 } |
|
732 //! [101] |
|
733 |
|
734 |
|
735 //! [102] |
|
736 QLineEdit { color: red } |
|
737 //! [102] |
|
738 |
|
739 |
|
740 //! [103] |
|
741 QLineEdit { color: red } |
|
742 QLineEdit[readOnly="true"] { color: gray } |
|
743 //! [103] |
|
744 |
|
745 |
|
746 //! [104] |
|
747 QLineEdit { color: red } |
|
748 QLineEdit[readOnly="true"] { color: gray } |
|
749 #registrationDialog QLineEdit { color: brown } |
|
750 //! [104] |
|
751 |
|
752 |
|
753 //! [105] |
|
754 QLineEdit { color: red } |
|
755 QLineEdit[readOnly="true"] { color: gray } |
|
756 QDialog QLineEdit { color: brown } |
|
757 //! [105] |
|
758 |
|
759 |
|
760 //! [106] |
|
761 QTextEdit, QListView { |
|
762 background-color: white; |
|
763 background-image: url(draft.png); |
|
764 background-attachment: scroll; |
|
765 } |
|
766 //! [106] |
|
767 |
|
768 |
|
769 //! [107] |
|
770 QTextEdit, QListView { |
|
771 background-color: white; |
|
772 background-image: url(draft.png); |
|
773 background-attachment: fixed; |
|
774 } |
|
775 //! [107] |
|
776 |
|
777 |
|
778 //! [108] |
|
779 QCheckBox { |
|
780 spacing: 5px; |
|
781 } |
|
782 |
|
783 QCheckBox::indicator { |
|
784 width: 13px; |
|
785 height: 13px; |
|
786 } |
|
787 |
|
788 QCheckBox::indicator:unchecked { |
|
789 image: url(:/images/checkbox_unchecked.png); |
|
790 } |
|
791 |
|
792 QCheckBox::indicator:unchecked:hover { |
|
793 image: url(:/images/checkbox_unchecked_hover.png); |
|
794 } |
|
795 |
|
796 QCheckBox::indicator:unchecked:pressed { |
|
797 image: url(:/images/checkbox_unchecked_pressed.png); |
|
798 } |
|
799 |
|
800 QCheckBox::indicator:checked { |
|
801 image: url(:/images/checkbox_checked.png); |
|
802 } |
|
803 |
|
804 QCheckBox::indicator:checked:hover { |
|
805 image: url(:/images/checkbox_checked_hover.png); |
|
806 } |
|
807 |
|
808 QCheckBox::indicator:checked:pressed { |
|
809 image: url(:/images/checkbox_checked_pressed.png); |
|
810 } |
|
811 |
|
812 QCheckBox::indicator:indeterminate:hover { |
|
813 image: url(:/images/checkbox_indeterminate_hover.png); |
|
814 } |
|
815 |
|
816 QCheckBox::indicator:indeterminate:pressed { |
|
817 image: url(:/images/checkbox_indeterminate_pressed.png); |
|
818 } |
|
819 //! [108] |
|
820 |
|
821 |
|
822 //! [109] |
|
823 QComboBox { |
|
824 border: 1px solid gray; |
|
825 border-radius: 3px; |
|
826 padding: 1px 18px 1px 3px; |
|
827 min-width: 6em; |
|
828 } |
|
829 |
|
830 QComboBox:editable { |
|
831 background: white; |
|
832 } |
|
833 |
|
834 QComboBox:!editable, QComboBox::drop-down:editable { |
|
835 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
836 stop: 0 #E1E1E1, stop: 0.4 #DDDDDD, |
|
837 stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3); |
|
838 } |
|
839 |
|
840 /* QComboBox gets the "on" state when the popup is open */ |
|
841 QComboBox:!editable:on, QComboBox::drop-down:editable:on { |
|
842 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
843 stop: 0 #D3D3D3, stop: 0.4 #D8D8D8, |
|
844 stop: 0.5 #DDDDDD, stop: 1.0 #E1E1E1); |
|
845 } |
|
846 |
|
847 QComboBox:on { /* shift the text when the popup opens */ |
|
848 padding-top: 3px; |
|
849 padding-left: 4px; |
|
850 } |
|
851 |
|
852 QComboBox::drop-down { |
|
853 subcontrol-origin: padding; |
|
854 subcontrol-position: top right; |
|
855 width: 15px; |
|
856 |
|
857 border-left-width: 1px; |
|
858 border-left-color: darkgray; |
|
859 border-left-style: solid; /* just a single line */ |
|
860 border-top-right-radius: 3px; /* same radius as the QComboBox */ |
|
861 border-bottom-right-radius: 3px; |
|
862 } |
|
863 |
|
864 QComboBox::down-arrow { |
|
865 image: url(/usr/share/icons/crystalsvg/16x16/actions/1downarrow.png); |
|
866 } |
|
867 |
|
868 QComboBox::down-arrow:on { /* shift the arrow when popup is open */ |
|
869 top: 1px; |
|
870 left: 1px; |
|
871 } |
|
872 //! [109] |
|
873 |
|
874 |
|
875 //! [110] |
|
876 QComboBox QAbstractItemView { |
|
877 border: 2px solid darkgray; |
|
878 selection-background-color: lightgray; |
|
879 } |
|
880 //! [110] |
|
881 |
|
882 |
|
883 //! [111] |
|
884 QDockWidget { |
|
885 border: 1px solid lightgray; |
|
886 titlebar-close-icon: url(close.png); |
|
887 titlebar-normal-icon: url(undock.png); |
|
888 } |
|
889 |
|
890 QDockWidget::title { |
|
891 text-align: left; /* align the text to the left */ |
|
892 background: lightgray; |
|
893 padding-left: 5px; |
|
894 } |
|
895 |
|
896 QDockWidget::close-button, QDockWidget::float-button { |
|
897 border: 1px solid transparent; |
|
898 background: darkgray; |
|
899 padding: 0px; |
|
900 } |
|
901 |
|
902 QDockWidget::close-button:hover, QDockWidget::float-button:hover { |
|
903 background: gray; |
|
904 } |
|
905 |
|
906 QDockWidget::close-button:pressed, QDockWidget::float-button:pressed { |
|
907 padding: 1px -1px -1px 1px; |
|
908 } |
|
909 //! [111] |
|
910 |
|
911 |
|
912 //! [112] |
|
913 QDockWidget { |
|
914 border: 1px solid lightgray; |
|
915 titlebar-close-icon: url(close.png); |
|
916 titlebar-normal-icon: url(float.png); |
|
917 } |
|
918 |
|
919 QDockWidget::title { |
|
920 text-align: left; |
|
921 background: lightgray; |
|
922 padding-left: 35px; |
|
923 } |
|
924 |
|
925 QDockWidget::close-button, QDockWidget::float-button { |
|
926 background: darkgray; |
|
927 padding: 0px; |
|
928 icon-size: 14px; /* maximum icon size */ |
|
929 } |
|
930 |
|
931 QDockWidget::close-button:hover, QDockWidget::float-button:hover { |
|
932 background: gray; |
|
933 } |
|
934 |
|
935 QDockWidget::close-button:pressed, QDockWidget::float-button:pressed { |
|
936 padding: 1px -1px -1px 1px; |
|
937 } |
|
938 |
|
939 QDockWidget::close-button { |
|
940 subcontrol-position: top left; |
|
941 subcontrol-origin: margin; |
|
942 position: absolute; |
|
943 top: 0px; left: 0px; bottom: 0px; |
|
944 width: 14px; |
|
945 } |
|
946 |
|
947 QDockWidget::float-button { |
|
948 subcontrol-position: top left; |
|
949 subcontrol-origin: margin; |
|
950 position: absolute; |
|
951 top: 0px; left: 16px; bottom: 0px; |
|
952 width: 14px; |
|
953 } |
|
954 //! [112] |
|
955 |
|
956 |
|
957 //! [113] |
|
958 QFrame, QLabel, QToolTip { |
|
959 border: 2px solid green; |
|
960 border-radius: 4px; |
|
961 padding: 2px; |
|
962 background-image: url(images/welcome.png); |
|
963 } |
|
964 //! [113] |
|
965 |
|
966 |
|
967 //! [114] |
|
968 QGroupBox { |
|
969 background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
970 stop: 0 #E0E0E0, stop: 1 #FFFFFF); |
|
971 border: 2px solid gray; |
|
972 border-radius: 5px; |
|
973 margin-top: 1ex; /* leave space at the top for the title */ |
|
974 } |
|
975 |
|
976 QGroupBox::title { |
|
977 subcontrol-origin: margin; |
|
978 subcontrol-position: top center; /* position at the top center */ |
|
979 padding: 0 3px; |
|
980 background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
981 stop: 0 #FFOECE, stop: 1 #FFFFFF); |
|
982 } |
|
983 //! [114] |
|
984 |
|
985 |
|
986 //! [115] |
|
987 QGroupBox::indicator { |
|
988 width: 13px; |
|
989 height: 13px; |
|
990 } |
|
991 |
|
992 QGroupBox::indicator:unchecked { |
|
993 image: url(:/images/checkbox_unchecked.png); |
|
994 } |
|
995 |
|
996 /* proceed with styling just like QCheckBox */ |
|
997 //! [115] |
|
998 |
|
999 |
|
1000 //! [116] |
|
1001 QHeaderView::section { |
|
1002 background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, |
|
1003 stop:0 #616161, stop: 0.5 #505050, |
|
1004 stop: 0.6 #434343, stop:1 #656565); |
|
1005 color: white; |
|
1006 padding-left: 4px; |
|
1007 border: 1px solid #6c6c6c; |
|
1008 } |
|
1009 |
|
1010 QHeaderView::section:checked |
|
1011 { |
|
1012 background-color: red; |
|
1013 } |
|
1014 |
|
1015 /* style the sort indicator */ |
|
1016 QHeaderView::down-arrow { |
|
1017 image: url(down_arrow.png); |
|
1018 } |
|
1019 |
|
1020 QHeaderView::up-arrow { |
|
1021 image: url(up_arrow.png); |
|
1022 } |
|
1023 //! [116] |
|
1024 |
|
1025 |
|
1026 //! [117] |
|
1027 QLineEdit { |
|
1028 border: 2px solid gray; |
|
1029 border-radius: 10px; |
|
1030 padding: 0 8px; |
|
1031 background: yellow; |
|
1032 selection-background-color: darkgray; |
|
1033 } |
|
1034 //! [117] |
|
1035 |
|
1036 |
|
1037 //! [118] |
|
1038 QLineEdit[echoMode="2"] { |
|
1039 lineedit-password-character: 9679; |
|
1040 } |
|
1041 //! [118] |
|
1042 |
|
1043 |
|
1044 //! [119] |
|
1045 QLineEdit:read-only { |
|
1046 background: lightblue; |
|
1047 //! [119] |
|
1048 |
|
1049 |
|
1050 //! [120] |
|
1051 QListView { |
|
1052 alternate-background-color: yellow; |
|
1053 } |
|
1054 //! [120] |
|
1055 |
|
1056 |
|
1057 //! [121] |
|
1058 QListView { |
|
1059 show-decoration-selected: 1; /* make the selection span the entire width of the view */ |
|
1060 } |
|
1061 |
|
1062 QListView::item:alternate { |
|
1063 background: #EEEEEE; |
|
1064 } |
|
1065 |
|
1066 QListView::item:selected { |
|
1067 border: 1px solid #6a6ea9; |
|
1068 } |
|
1069 |
|
1070 QListView::item:selected:!active { |
|
1071 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1072 stop: 0 #ABAFE5, stop: 1 #8588B2); |
|
1073 } |
|
1074 |
|
1075 QListView::item:selected:active { |
|
1076 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1077 stop: 0 #6a6ea9, stop: 1 #888dd9); |
|
1078 } |
|
1079 |
|
1080 QListView::item:hover { |
|
1081 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1082 stop: 0 #FAFBFE, stop: 1 #DCDEF1); |
|
1083 } |
|
1084 //! [121] |
|
1085 |
|
1086 |
|
1087 //! [122] |
|
1088 QMainWindow::separator { |
|
1089 background: yellow; |
|
1090 width: 10px; /* when vertical */ |
|
1091 height: 10px; /* when horizontal */ |
|
1092 } |
|
1093 |
|
1094 QMainWindow::separator:hover { |
|
1095 background: red; |
|
1096 } |
|
1097 //! [122] |
|
1098 |
|
1099 |
|
1100 //! [123] |
|
1101 QMenu { |
|
1102 background-color: #ABABAB; /* sets background of the menu */ |
|
1103 border: 1px solid black; |
|
1104 } |
|
1105 |
|
1106 QMenu::item { |
|
1107 /* sets background of menu item. set this to something non-transparent |
|
1108 if you want menu color and menu item color to be different */ |
|
1109 background-color: transparent; |
|
1110 } |
|
1111 |
|
1112 QMenu::item:selected { /* when user selects item using mouse or keyboard */ |
|
1113 background-color: #654321; |
|
1114 } |
|
1115 //! [123] |
|
1116 |
|
1117 |
|
1118 //! [124] |
|
1119 QMenu { |
|
1120 background-color: white; |
|
1121 margin: 2px; /* some spacing around the menu */ |
|
1122 } |
|
1123 |
|
1124 QMenu::item { |
|
1125 padding: 2px 25px 2px 20px; |
|
1126 border: 1px solid transparent; /* reserve space for selection border */ |
|
1127 } |
|
1128 |
|
1129 QMenu::item:selected { |
|
1130 border-color: darkblue; |
|
1131 background: rgba(100, 100, 100, 150); |
|
1132 } |
|
1133 |
|
1134 QMenu::icon:checked { /* appearance of a 'checked' icon */ |
|
1135 background: gray; |
|
1136 border: 1px inset gray; |
|
1137 position: absolute; |
|
1138 top: 1px; |
|
1139 right: 1px; |
|
1140 bottom: 1px; |
|
1141 left: 1px; |
|
1142 } |
|
1143 |
|
1144 QMenu::separator { |
|
1145 height: 2px; |
|
1146 background: lightblue; |
|
1147 margin-left: 10px; |
|
1148 margin-right: 5px; |
|
1149 } |
|
1150 |
|
1151 QMenu::indicator { |
|
1152 width: 13px; |
|
1153 height: 13px; |
|
1154 } |
|
1155 |
|
1156 /* non-exclusive indicator = check box style indicator (see QActionGroup::setExclusive) */ |
|
1157 QMenu::indicator:non-exclusive:unchecked { |
|
1158 image: url(:/images/checkbox_unchecked.png); |
|
1159 } |
|
1160 |
|
1161 QMenu::indicator:non-exclusive:unchecked:selected { |
|
1162 image: url(:/images/checkbox_unchecked_hover.png); |
|
1163 } |
|
1164 |
|
1165 QMenu::indicator:non-exclusive:checked { |
|
1166 image: url(:/images/checkbox_checked.png); |
|
1167 } |
|
1168 |
|
1169 QMenu::indicator:non-exclusive:checked:selected { |
|
1170 image: url(:/images/checkbox_checked_hover.png); |
|
1171 } |
|
1172 |
|
1173 /* exclusive indicator = radio button style indicator (see QActionGroup::setExclusive) */ |
|
1174 QMenu::indicator:exclusive:unchecked { |
|
1175 image: url(:/images/radiobutton_unchecked.png); |
|
1176 } |
|
1177 |
|
1178 QMenu::indicator:exclusive:unchecked:selected { |
|
1179 image: url(:/images/radiobutton_unchecked_hover.png); |
|
1180 } |
|
1181 |
|
1182 QMenu::indicator:exclusive:checked { |
|
1183 image: url(:/images/radiobutton_checked.png); |
|
1184 } |
|
1185 |
|
1186 QMenu::indicator:exclusive:checked:selected { |
|
1187 image: url(:/images/radiobutton_checked_hover.png); |
|
1188 } |
|
1189 |
|
1190 //! [124] |
|
1191 |
|
1192 |
|
1193 //! [125] |
|
1194 QMenuBar { |
|
1195 background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, |
|
1196 stop:0 lightgray, stop:1 darkgray); |
|
1197 } |
|
1198 |
|
1199 QMenuBar::item { |
|
1200 spacing: 3px; /* spacing between menu bar items */ |
|
1201 padding: 1px 4px; |
|
1202 background: transparent; |
|
1203 border-radius: 4px; |
|
1204 } |
|
1205 |
|
1206 QMenuBar::item:selected { /* when selected using mouse or keyboard */ |
|
1207 background: #a8a8a8; |
|
1208 } |
|
1209 |
|
1210 QMenuBar::item:pressed { |
|
1211 background: #888888; |
|
1212 } |
|
1213 //! [125] |
|
1214 |
|
1215 |
|
1216 //! [126] |
|
1217 QProgressBar { |
|
1218 border: 2px solid grey; |
|
1219 border-radius: 5px; |
|
1220 } |
|
1221 |
|
1222 QProgressBar::chunk { |
|
1223 background-color: #05B8CC; |
|
1224 width: 20px; |
|
1225 } |
|
1226 //! [126] |
|
1227 |
|
1228 |
|
1229 //! [127] |
|
1230 QProgressBar { |
|
1231 border: 2px solid grey; |
|
1232 border-radius: 5px; |
|
1233 text-align: center; |
|
1234 } |
|
1235 //! [127] |
|
1236 |
|
1237 |
|
1238 //! [128] |
|
1239 QProgressBar::chunk { |
|
1240 background-color: #CD96CD; |
|
1241 width: 10px; |
|
1242 margin: 0.5px; |
|
1243 } |
|
1244 //! [128] |
|
1245 |
|
1246 |
|
1247 //! [129] |
|
1248 QPushButton { |
|
1249 border: 2px solid #8f8f91; |
|
1250 border-radius: 6px; |
|
1251 background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1252 stop: 0 #f6f7fa, stop: 1 #dadbde); |
|
1253 min-width: 80px; |
|
1254 } |
|
1255 |
|
1256 QPushButton:pressed { |
|
1257 background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1258 stop: 0 #dadbde, stop: 1 #f6f7fa); |
|
1259 } |
|
1260 |
|
1261 QPushButton:flat { |
|
1262 border: none; /* no border for a flat push button */ |
|
1263 } |
|
1264 |
|
1265 QPushButton:default { |
|
1266 border-color: navy; /* make the default button prominent */ |
|
1267 } |
|
1268 //! [129] |
|
1269 |
|
1270 |
|
1271 //! [130] |
|
1272 QPushButton:open { /* when the button has its menu open */ |
|
1273 background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1274 stop: 0 #dadbde, stop: 1 #f6f7fa); |
|
1275 } |
|
1276 |
|
1277 QPushButton::menu-indicator { |
|
1278 image: url(menu_indicator.png); |
|
1279 subcontrol-origin: padding; |
|
1280 subcontrol-position: bottom right; |
|
1281 } |
|
1282 |
|
1283 QPushButton::menu-indicator:pressed, QPushButton::menu-indicator:open { |
|
1284 position: relative; |
|
1285 top: 2px; left: 2px; /* shift the arrow by 2 px */ |
|
1286 } |
|
1287 //! [130] |
|
1288 |
|
1289 |
|
1290 //! [131] |
|
1291 QRadioButton::indicator { |
|
1292 width: 13px; |
|
1293 height: 13px; |
|
1294 } |
|
1295 |
|
1296 QRadioButton::indicator::unchecked { |
|
1297 image: url(:/images/radiobutton_unchecked.png); |
|
1298 } |
|
1299 |
|
1300 QRadioButton::indicator:unchecked:hover { |
|
1301 image: url(:/images/radiobutton_unchecked_hover.png); |
|
1302 } |
|
1303 |
|
1304 QRadioButton::indicator:unchecked:pressed { |
|
1305 image: url(:/images/radiobutton_unchecked_pressed.png); |
|
1306 } |
|
1307 |
|
1308 QRadioButton::indicator::checked { |
|
1309 image: url(:/images/radiobutton_checked.png); |
|
1310 } |
|
1311 |
|
1312 QRadioButton::indicator:checked:hover { |
|
1313 image: url(:/images/radiobutton_checked_hover.png); |
|
1314 } |
|
1315 |
|
1316 QRadioButton::indicator:checked:pressed { |
|
1317 image: url(:/images/radiobutton_checked_pressed.png); |
|
1318 } |
|
1319 //! [131] |
|
1320 |
|
1321 |
|
1322 //! [132] |
|
1323 QScrollBar:horizontal { |
|
1324 border: 2px solid grey; |
|
1325 background: #32CC99; |
|
1326 height: 15px; |
|
1327 margin: 0px 20px 0 20px; |
|
1328 } |
|
1329 //! [132] |
|
1330 |
|
1331 |
|
1332 //! [133] |
|
1333 QScrollBar::handle:horizontal { |
|
1334 background: white; |
|
1335 min-width: 20px; |
|
1336 } |
|
1337 //! [133] |
|
1338 |
|
1339 |
|
1340 //! [134] |
|
1341 QScrollBar::add-line:horizontal { |
|
1342 border: 2px solid grey; |
|
1343 background: #32CC99; |
|
1344 width: 20px; |
|
1345 subcontrol-position: right; |
|
1346 subcontrol-origin: margin; |
|
1347 } |
|
1348 |
|
1349 QScrollBar::sub-line:horizontal { |
|
1350 border: 2px solid grey; |
|
1351 background: #32CC99; |
|
1352 width: 20px; |
|
1353 subcontrol-position: left; |
|
1354 subcontrol-origin: margin; |
|
1355 } |
|
1356 //! [134] |
|
1357 |
|
1358 |
|
1359 //! [135] |
|
1360 QScrollBar:left-arrow:horizontal, QScrollBar::right-arrow:horizontal { |
|
1361 border: 2px solid grey; |
|
1362 width: 3px; |
|
1363 height: 3px; |
|
1364 background: white; |
|
1365 } |
|
1366 |
|
1367 QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal { |
|
1368 background: none; |
|
1369 } |
|
1370 //! [135] |
|
1371 |
|
1372 |
|
1373 //! [136] |
|
1374 QScrollBar:horizontal { |
|
1375 border: 2px solid green; |
|
1376 background: cyan; |
|
1377 height: 15px; |
|
1378 margin: 0px 40px 0 0px; |
|
1379 } |
|
1380 |
|
1381 QScrollBar::handle:horizontal { |
|
1382 background: gray; |
|
1383 min-width: 20px; |
|
1384 } |
|
1385 |
|
1386 QScrollBar::add-line:horizontal { |
|
1387 background: blue; |
|
1388 width: 16px; |
|
1389 subcontrol-position: right; |
|
1390 subcontrol-origin: margin; |
|
1391 border: 2px solid black; |
|
1392 } |
|
1393 |
|
1394 QScrollBar::sub-line:horizontal { |
|
1395 background: magenta; |
|
1396 width: 16px; |
|
1397 subcontrol-position: top right; |
|
1398 subcontrol-origin: margin; |
|
1399 border: 2px solid black; |
|
1400 position: absolute; |
|
1401 right: 20px; |
|
1402 } |
|
1403 |
|
1404 QScrollBar:left-arrow:horizontal, QScrollBar::right-arrow:horizontal { |
|
1405 width: 3px; |
|
1406 height: 3px; |
|
1407 background: pink; |
|
1408 } |
|
1409 |
|
1410 QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal { |
|
1411 background: none; |
|
1412 } |
|
1413 |
|
1414 //! [136] |
|
1415 |
|
1416 |
|
1417 //! [137] |
|
1418 QScrollBar:vertical { |
|
1419 border: 2px solid grey; |
|
1420 background: #32CC99; |
|
1421 width: 15px; |
|
1422 margin: 22px 0 22px 0; |
|
1423 } |
|
1424 QScrollBar::handle:vertical { |
|
1425 background: white; |
|
1426 min-height: 20px; |
|
1427 } |
|
1428 QScrollBar::add-line:vertical { |
|
1429 border: 2px solid grey; |
|
1430 background: #32CC99; |
|
1431 height: 20px; |
|
1432 subcontrol-position: bottom; |
|
1433 subcontrol-origin: margin; |
|
1434 } |
|
1435 |
|
1436 QScrollBar::sub-line:vertical { |
|
1437 border: 2px solid grey; |
|
1438 background: #32CC99; |
|
1439 height: 20px; |
|
1440 subcontrol-position: top; |
|
1441 subcontrol-origin: margin; |
|
1442 } |
|
1443 QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical { |
|
1444 border: 2px solid grey; |
|
1445 width: 3px; |
|
1446 height: 3px; |
|
1447 background: white; |
|
1448 } |
|
1449 |
|
1450 QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical { |
|
1451 background: none; |
|
1452 } |
|
1453 //! [137] |
|
1454 |
|
1455 |
|
1456 //! [138] |
|
1457 QSizeGrip { |
|
1458 image: url(:/images/sizegrip.png); |
|
1459 width: 16px; |
|
1460 height: 16px; |
|
1461 } |
|
1462 //! [138] |
|
1463 |
|
1464 |
|
1465 //! [139] |
|
1466 QSlider::groove:horizontal { |
|
1467 border: 1px solid #999999; |
|
1468 height: 8px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */ |
|
1469 background: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #B1B1B1, stop:1 #c4c4c4); |
|
1470 margin: 2px 0; |
|
1471 } |
|
1472 |
|
1473 QSlider::handle:horizontal { |
|
1474 background: qlineargradient(x1:0, y1:0, x2:1, y2:1, stop:0 #b4b4b4, stop:1 #8f8f8f); |
|
1475 border: 1px solid #5c5c5c; |
|
1476 width: 18px; |
|
1477 margin: -2px 0; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */ |
|
1478 border-radius: 3px; |
|
1479 } |
|
1480 //! [139] |
|
1481 |
|
1482 |
|
1483 //! [140] |
|
1484 QSlider::groove:vertical { |
|
1485 background: red; |
|
1486 position: absolute; /* absolutely position 4px from the left and right of the widget. setting margins on the widget should work too... */ |
|
1487 left: 4px; right: 4px; |
|
1488 } |
|
1489 |
|
1490 QSlider::handle:vertical { |
|
1491 height: 10px; |
|
1492 background: green; |
|
1493 margin: 0 -4px; /* expand outside the groove */ |
|
1494 } |
|
1495 |
|
1496 QSlider::add-page:vertical { |
|
1497 background: white; |
|
1498 } |
|
1499 |
|
1500 QSlider::sub-page:vertical { |
|
1501 background: pink; |
|
1502 } |
|
1503 //! [140] |
|
1504 |
|
1505 |
|
1506 //! [141] |
|
1507 QSpinBox { |
|
1508 padding-right: 15px; /* make room for the arrows */ |
|
1509 border-image: url(:/images/frame.png) 4; |
|
1510 border-width: 3; |
|
1511 } |
|
1512 |
|
1513 QSpinBox::up-button { |
|
1514 subcontrol-origin: border; |
|
1515 subcontrol-position: top right; /* position at the top right corner */ |
|
1516 |
|
1517 width: 16px; /* 16 + 2*1px border-width = 15px padding + 3px parent border */ |
|
1518 border-image: url(:/images/spinup.png) 1; |
|
1519 border-width: 1px; |
|
1520 } |
|
1521 |
|
1522 QSpinBox::up-button:hover { |
|
1523 border-image: url(:/images/spinup_hover.png) 1; |
|
1524 } |
|
1525 |
|
1526 QSpinBox::up-button:pressed { |
|
1527 border-image: url(:/images/spinup_pressed.png) 1; |
|
1528 } |
|
1529 |
|
1530 QSpinBox::up-arrow { |
|
1531 image: url(:/images/up_arrow.png); |
|
1532 width: 7px; |
|
1533 height: 7px; |
|
1534 } |
|
1535 |
|
1536 QSpinBox::up-arrow:disabled, QSpinBox::up-arrow:off { /* off state when value is max */ |
|
1537 image: url(:/images/up_arrow_disabled.png); |
|
1538 } |
|
1539 |
|
1540 QSpinBox::down-button { |
|
1541 subcontrol-origin: border; |
|
1542 subcontrol-position: bottom right; /* position at bottom right corner */ |
|
1543 |
|
1544 width: 16px; |
|
1545 border-image: url(:/images/spindown.png) 1; |
|
1546 border-width: 1px; |
|
1547 border-top-width: 0; |
|
1548 } |
|
1549 |
|
1550 QSpinBox::down-button:hover { |
|
1551 border-image: url(:/images/spindown_hover.png) 1; |
|
1552 } |
|
1553 |
|
1554 QSpinBox::down-button:pressed { |
|
1555 border-image: url(:/images/spindown_pressed.png) 1; |
|
1556 } |
|
1557 |
|
1558 QSpinBox::down-arrow { |
|
1559 image: url(:/images/down_arrow.png); |
|
1560 width: 7px; |
|
1561 height: 7px; |
|
1562 } |
|
1563 |
|
1564 QSpinBox::down-arrow:disabled, |
|
1565 QSpinBox::down-arrow:off { /* off state when value in min */ |
|
1566 image: url(:/images/down_arrow_disabled.png); |
|
1567 } |
|
1568 |
|
1569 //! [141] |
|
1570 |
|
1571 |
|
1572 //! [142] |
|
1573 QSplitter::handle { |
|
1574 image: url(images/splitter.png); |
|
1575 } |
|
1576 |
|
1577 QSplitter::handle:horizontal { |
|
1578 width: 2px; |
|
1579 } |
|
1580 |
|
1581 QSplitter::handle:vertical { |
|
1582 height: 2px; |
|
1583 } |
|
1584 |
|
1585 QSplitter::handle:pressed { |
|
1586 url(images/splitter_pressed.png); |
|
1587 } |
|
1588 |
|
1589 //! [142] |
|
1590 |
|
1591 |
|
1592 //! [143] |
|
1593 QStatusBar { |
|
1594 background: brown; |
|
1595 } |
|
1596 |
|
1597 QStatusBar::item { |
|
1598 border: 1px solid red; |
|
1599 border-radius: 3px; |
|
1600 } |
|
1601 //! [143] |
|
1602 |
|
1603 |
|
1604 //! [144] |
|
1605 QStatusBar QLabel { |
|
1606 border: 3px solid white; |
|
1607 } |
|
1608 //! [144] |
|
1609 |
|
1610 |
|
1611 //! [145] |
|
1612 QTabWidget::pane { /* The tab widget frame */ |
|
1613 border-top: 2px solid #C2C7CB; |
|
1614 } |
|
1615 |
|
1616 QTabWidget::tab-bar { |
|
1617 left: 5px; /* move to the right by 5px */ |
|
1618 } |
|
1619 |
|
1620 /* Style the tab using the tab sub-control. Note that |
|
1621 it reads QTabBar _not_ QTabWidget */ |
|
1622 QTabBar::tab { |
|
1623 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1624 stop: 0 #E1E1E1, stop: 0.4 #DDDDDD, |
|
1625 stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3); |
|
1626 border: 2px solid #C4C4C3; |
|
1627 border-bottom-color: #C2C7CB; /* same as the pane color */ |
|
1628 border-top-left-radius: 4px; |
|
1629 border-top-right-radius: 4px; |
|
1630 min-width: 8ex; |
|
1631 padding: 2px; |
|
1632 } |
|
1633 |
|
1634 QTabBar::tab:selected, QTabBar::tab:hover { |
|
1635 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1636 stop: 0 #fafafa, stop: 0.4 #f4f4f4, |
|
1637 stop: 0.5 #e7e7e7, stop: 1.0 #fafafa); |
|
1638 } |
|
1639 |
|
1640 QTabBar::tab:selected { |
|
1641 border-color: #9B9B9B; |
|
1642 border-bottom-color: #C2C7CB; /* same as pane color */ |
|
1643 } |
|
1644 |
|
1645 QTabBar::tab:!selected { |
|
1646 margin-top: 2px; /* make non-selected tabs look smaller */ |
|
1647 } |
|
1648 //! [145] |
|
1649 |
|
1650 |
|
1651 //! [146] |
|
1652 QTabWidget::pane { /* The tab widget frame */ |
|
1653 border-top: 2px solid #C2C7CB; |
|
1654 } |
|
1655 |
|
1656 QTabWidget::tab-bar { |
|
1657 left: 5px; /* move to the right by 5px */ |
|
1658 } |
|
1659 |
|
1660 /* Style the tab using the tab sub-control. Note that |
|
1661 it reads QTabBar _not_ QTabWidget */ |
|
1662 QTabBar::tab { |
|
1663 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1664 stop: 0 #E1E1E1, stop: 0.4 #DDDDDD, |
|
1665 stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3); |
|
1666 border: 2px solid #C4C4C3; |
|
1667 border-bottom-color: #C2C7CB; /* same as the pane color */ |
|
1668 border-top-left-radius: 4px; |
|
1669 border-top-right-radius: 4px; |
|
1670 min-width: 8ex; |
|
1671 padding: 2px; |
|
1672 } |
|
1673 |
|
1674 QTabBar::tab:selected, QTabBar::tab:hover { |
|
1675 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1676 stop: 0 #fafafa, stop: 0.4 #f4f4f4, |
|
1677 stop: 0.5 #e7e7e7, stop: 1.0 #fafafa); |
|
1678 } |
|
1679 |
|
1680 QTabBar::tab:selected { |
|
1681 border-color: #9B9B9B; |
|
1682 border-bottom-color: #C2C7CB; /* same as pane color */ |
|
1683 } |
|
1684 |
|
1685 QTabBar::tab:!selected { |
|
1686 margin-top: 2px; /* make non-selected tabs look smaller */ |
|
1687 } |
|
1688 |
|
1689 /* make use of negative margins for overlapping tabs */ |
|
1690 QTabBar::tab:selected { |
|
1691 /* expand/overlap to the left and right by 4px */ |
|
1692 margin-left: -4px; |
|
1693 margin-right: -4px; |
|
1694 } |
|
1695 |
|
1696 QTabBar::tab:first:selected { |
|
1697 margin-left: 0; /* the first selected tab has nothing to overlap with on the left */ |
|
1698 } |
|
1699 |
|
1700 QTabBar::tab:last:selected { |
|
1701 margin-right: 0; /* the last selected tab has nothing to overlap with on the right */ |
|
1702 } |
|
1703 |
|
1704 QTabBar::tab:only-one { |
|
1705 margin: 0; /* if there is only one tab, we don't want overlapping margins */ |
|
1706 } |
|
1707 //! [146] |
|
1708 |
|
1709 |
|
1710 //! [147] |
|
1711 QTabWidget::pane { /* The tab widget frame */ |
|
1712 border-top: 2px solid #C2C7CB; |
|
1713 position: absolute; |
|
1714 top: -0.5em; |
|
1715 } |
|
1716 |
|
1717 QTabWidget::tab-bar { |
|
1718 alignment: center; |
|
1719 } |
|
1720 |
|
1721 /* Style the tab using the tab sub-control. Note that |
|
1722 it reads QTabBar _not_ QTabWidget */ |
|
1723 QTabBar::tab { |
|
1724 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1725 stop: 0 #E1E1E1, stop: 0.4 #DDDDDD, |
|
1726 stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3); |
|
1727 border: 2px solid #C4C4C3; |
|
1728 border-bottom-color: #C2C7CB; /* same as the pane color */ |
|
1729 border-top-left-radius: 4px; |
|
1730 border-top-right-radius: 4px; |
|
1731 min-width: 8ex; |
|
1732 padding: 2px; |
|
1733 } |
|
1734 |
|
1735 QTabBar::tab:selected, QTabBar::tab:hover { |
|
1736 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1737 stop: 0 #fafafa, stop: 0.4 #f4f4f4, |
|
1738 stop: 0.5 #e7e7e7, stop: 1.0 #fafafa); |
|
1739 } |
|
1740 |
|
1741 QTabBar::tab:selected { |
|
1742 border-color: #9B9B9B; |
|
1743 border-bottom-color: #C2C7CB; /* same as pane color */ |
|
1744 } |
|
1745 //! [147] |
|
1746 |
|
1747 |
|
1748 //! [148] |
|
1749 QTabBar::tear { |
|
1750 image: url(tear_indicator.png); |
|
1751 } |
|
1752 |
|
1753 QTabBar::scroller { /* the width of the scroll buttons */ |
|
1754 width: 20px; |
|
1755 } |
|
1756 |
|
1757 QTabBar QToolButton { /* the scroll buttons are tool buttons */ |
|
1758 border-image: url(scrollbutton.png) 2; |
|
1759 border-width: 2px; |
|
1760 } |
|
1761 |
|
1762 QTabBar QToolButton::right-arrow { /* the arrow mark in the tool buttons */ |
|
1763 image: url(rightarrow.png); |
|
1764 } |
|
1765 |
|
1766 QTabBar QToolButton::left-arrow { |
|
1767 image: url(leftarrow.png); |
|
1768 } |
|
1769 //! [148] |
|
1770 |
|
1771 |
|
1772 //! [149] |
|
1773 QTableView { |
|
1774 selection-background-color: qlineargradient(x1: 0, y1: 0, x2: 0.5, y2: 0.5, |
|
1775 stop: 0 #FF92BB, stop: 1 white); |
|
1776 } |
|
1777 //! [149] |
|
1778 |
|
1779 |
|
1780 //! [150] |
|
1781 QTableView QTableCornerButton::section { |
|
1782 background: red; |
|
1783 border: 2px outset red; |
|
1784 } |
|
1785 //! [150] |
|
1786 |
|
1787 |
|
1788 //! [151] |
|
1789 QToolBar { |
|
1790 background: red; |
|
1791 spacing: 3px; /* spacing between items in the tool bar */ |
|
1792 } |
|
1793 |
|
1794 QToolBar::handle { |
|
1795 image: url(handle.png); |
|
1796 } |
|
1797 //! [151] |
|
1798 |
|
1799 |
|
1800 //! [152] |
|
1801 QToolBox::tab { |
|
1802 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1803 stop: 0 #E1E1E1, stop: 0.4 #DDDDDD, |
|
1804 stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3); |
|
1805 border-radius: 5px; |
|
1806 color: darkgray; |
|
1807 } |
|
1808 |
|
1809 QToolBox::tab:selected { /* italicize selected tabs */ |
|
1810 font: italic; |
|
1811 color: white; |
|
1812 } |
|
1813 //! [152] |
|
1814 |
|
1815 |
|
1816 //! [153] |
|
1817 QToolButton { /* all types of tool button */ |
|
1818 border: 2px solid #8f8f91; |
|
1819 border-radius: 6px; |
|
1820 background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1821 stop: 0 #f6f7fa, stop: 1 #dadbde); |
|
1822 } |
|
1823 |
|
1824 QToolButton[popupMode="1"] { /* only for MenuButtonPopup */ |
|
1825 padding-right: 20px; /* make way for the popup button */ |
|
1826 } |
|
1827 |
|
1828 QToolButton:pressed { |
|
1829 background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, |
|
1830 stop: 0 #dadbde, stop: 1 #f6f7fa); |
|
1831 } |
|
1832 |
|
1833 /* the subcontrols below are used only in the MenuButtonPopup mode */ |
|
1834 QToolButton::menu-button { |
|
1835 border: 2px solid gray; |
|
1836 border-top-right-radius: 6px; |
|
1837 border-bottom-right-radius: 6px; |
|
1838 /* 16px width + 4px for border = 20px allocated above */ |
|
1839 width: 16px; |
|
1840 } |
|
1841 |
|
1842 QToolButton::menu-arrow { |
|
1843 image: url(downarrow.png); |
|
1844 } |
|
1845 |
|
1846 QToolButton::menu-arrow:open { |
|
1847 top: 1px; left: 1px; /* shift it a bit */ |
|
1848 } |
|
1849 //! [153] |
|
1850 |
|
1851 |
|
1852 //! [154] |
|
1853 QToolTip { |
|
1854 border: 2px solid darkkhaki; |
|
1855 padding: 5px; |
|
1856 border-radius: 3px; |
|
1857 opacity: 200; |
|
1858 } |
|
1859 //! [154] |
|
1860 |
|
1861 |
|
1862 //! [155] |
|
1863 QTreeView { |
|
1864 alternate-background-color: yellow; |
|
1865 } |
|
1866 //! [155] |
|
1867 |
|
1868 |
|
1869 //! [156] |
|
1870 QTreeView { |
|
1871 show-decoration-selected: 1; |
|
1872 } |
|
1873 |
|
1874 QTreeView::item { |
|
1875 border: 1px solid #d9d9d9; |
|
1876 border-top-color: transparent; |
|
1877 border-bottom-color: transparent; |
|
1878 } |
|
1879 |
|
1880 QTreeView::item:hover { |
|
1881 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #e7effd, stop: 1 #cbdaf1); |
|
1882 border: 1px solid #bfcde4; |
|
1883 } |
|
1884 |
|
1885 QTreeView::item:selected { |
|
1886 border: 1px solid #567dbc; |
|
1887 } |
|
1888 |
|
1889 QTreeView::item:selected:active{ |
|
1890 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6ea1f1, stop: 1 #567dbc); |
|
1891 } |
|
1892 |
|
1893 QTreeView::item:selected:!active { |
|
1894 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6b9be8, stop: 1 #577fbf); |
|
1895 } |
|
1896 //! [156] |
|
1897 |
|
1898 |
|
1899 //! [157] |
|
1900 QTreeView::branch { |
|
1901 background: palette(base); |
|
1902 } |
|
1903 |
|
1904 QTreeView::branch:has-siblings:!adjoins-item { |
|
1905 background: cyan; |
|
1906 } |
|
1907 |
|
1908 QTreeView::branch:has-siblings:adjoins-item { |
|
1909 background: red; |
|
1910 } |
|
1911 |
|
1912 QTreeView::branch:!has-children:!has-siblings:adjoins-item { |
|
1913 background: blue; |
|
1914 } |
|
1915 |
|
1916 QTreeView::branch:closed:has-children:has-siblings { |
|
1917 background: pink; |
|
1918 } |
|
1919 |
|
1920 QTreeView::branch:has-children:!has-siblings:closed { |
|
1921 background: gray; |
|
1922 } |
|
1923 |
|
1924 QTreeView::branch:open:has-children:has-siblings { |
|
1925 background: magenta; |
|
1926 } |
|
1927 |
|
1928 QTreeView::branch:open:has-children:!has-siblings { |
|
1929 background: green; |
|
1930 } |
|
1931 |
|
1932 //! [157] |
|
1933 |
|
1934 |
|
1935 //! [158] |
|
1936 QTreeView::branch:has-siblings:!adjoins-item { |
|
1937 border-image: url(vline.png) 0; |
|
1938 } |
|
1939 |
|
1940 QTreeView::branch:has-siblings:adjoins-item { |
|
1941 border-image: url(branch-more.png) 0; |
|
1942 } |
|
1943 |
|
1944 QTreeView::branch:!has-children:!has-siblings:adjoins-item { |
|
1945 border-image: url(branch-end.png) 0; |
|
1946 } |
|
1947 |
|
1948 QTreeView::branch:has-children:!has-siblings:closed, |
|
1949 QTreeView::branch:closed:has-children:has-siblings { |
|
1950 border-image: none; |
|
1951 image: url(branch-closed.png); |
|
1952 } |
|
1953 |
|
1954 QTreeView::branch:open:has-children:!has-siblings, |
|
1955 QTreeView::branch:open:has-children:has-siblings { |
|
1956 border-image: none; |
|
1957 image: url(branch-open.png); |
|
1958 } |
|
1959 //! [158] |
|
1960 |
|
1961 //! [159] |
|
1962 QTabBar::close-button { |
|
1963 image: url(close.png) |
|
1964 subcontrol-position: left; |
|
1965 } |
|
1966 QTabBar::close-button:hover { |
|
1967 image: url(close-hover.png) |
|
1968 } |
|
1969 |
|
1970 //! [159] |