--- title: Styling a Widget order: 8 layout: page --- [[gwt.styling]] = Styling a Widget To make your widget look stylish, you need to style it. There are two basic ways to define CSS styles for a component: in the widget sources and in a theme. A default style should be defined in the widget sources, and different themes can then modify the style. [[gwt.styling.class]] == Determining the CSS Class The CSS class of a widget element is normally defined in the widget class and set with [methodname]#setStyleName()#. A widget should set the styles for its sub-elements as it desires. For example, you could style a composite widget with an overall style and with separate styles for the sub-widgets as follows: ---- public class MyPickerWidget extends ComplexPanel { public static final String CLASSNAME = "mypicker"; private final TextBox textBox = new TextBox(); private final PushButton button = new PushButton("..."); public MyPickerWidget() { setElement(Document.get().createDivElement()); setStylePrimaryName(CLASSNAME); textBox.setStylePrimaryName(CLASSNAME + "-field"); button.setStylePrimaryName(CLASSNAME + "-button"); add(textBox, getElement()); add(button, getElement()); button.addClickHandler(new ClickHandler() { public void onClick(ClickEvent event) { Window.alert("Calendar picker not yet supported!"); } }); } } ---- In addition, all Vaadin components get the [literal]#++v-widget++# class. If it extends an existing Vaadin or GWT widget, it will inherit CSS classes from that as well. [[gwt.styling.default]] == Default Stylesheet A client-side module, which is normally a widget set, can include stylesheets. They must be placed under the [filename]#public# folder under the folder of the widget set, a described in <>. For example, you could style the widget described above as follows: ---- .mypicker { white-space: nowrap; } .mypicker-button { display: inline-block; border: 1px solid black; padding: 3px; width: 15px; text-align: center; } ---- Notice that some size settings may require more complex handling and calculating the sizes dynamically. -remove-wording-with-delete'>Jerome-Herbinet-replace-remove-wording-with-delete Nextcloud server, a safe home for all your data: https://github.com/nextcloud/serverwww-data
aboutsummaryrefslogtreecommitdiffstats
path: root/lib/private/Files/SimpleFS/SimpleFolder.php
blob: 0da552e402b72a2d976f257e27c6f5f0908484f3 (plain) 
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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89