--- 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. -1 Nextcloud server, a safe home for all your data: https://github.com/nextcloud/serverwww-data
aboutsummaryrefslogtreecommitdiffstats
path: root/core/strings.php
blob: f59b5c8265aa38966c49760570aae5c45d34ba82 (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
<?php
/**
 * @copyright Copyright (c) 2016, ownCloud, Inc.
 *
 * @author Jan-Christoph Borchardt <hey@jancborchardt.net>
 * @author Robin Appelman <robin@icewind.nl>
 * @author Stefan Weil <sw@weilnetz.de>
 *
 * @license AGPL-3.0
 *
 * This code is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License, version 3,
 * as published by the Free Software Foundation.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License, version 3,
 * along with this program. If not, see <http://www.gnu.org/licenses/>
 *
 */
//some strings that are used in /lib but won't be translatable unless they are in /core too
$l = \OC::$server->getL10N('core');
$l->t("Personal");
$l->t("Users");
$l->t("Apps");
$l->t("Admin");
$l->t("Help");