diff options
Diffstat (limited to 'server/src/com/vaadin/ui/themes')
| -rw-r--r-- | server/src/com/vaadin/ui/themes/BaseTheme.java | 59 | ||||
| -rw-r--r-- | server/src/com/vaadin/ui/themes/ChameleonTheme.java | 365 | ||||
| -rw-r--r-- | server/src/com/vaadin/ui/themes/LiferayTheme.java | 31 | ||||
| -rw-r--r-- | server/src/com/vaadin/ui/themes/Reindeer.java | 217 | ||||
| -rw-r--r-- | server/src/com/vaadin/ui/themes/Runo.java | 183 |
5 files changed, 855 insertions, 0 deletions
diff --git a/server/src/com/vaadin/ui/themes/BaseTheme.java b/server/src/com/vaadin/ui/themes/BaseTheme.java new file mode 100644 index 0000000000..6f448746bf --- /dev/null +++ b/server/src/com/vaadin/ui/themes/BaseTheme.java @@ -0,0 +1,59 @@ +/* +@VaadinApache2LicenseForJavaFiles@ + */ +package com.vaadin.ui.themes; + +/** + * <p> + * The Base theme is the foundation for all Vaadin themes. Although it is not + * necessary to use it as the starting point for all other themes, it is heavily + * encouraged, since it abstracts and hides away many necessary style properties + * that the Vaadin terminal expects and needs. + * </p> + * <p> + * When creating your own theme, either extend this class and specify the styles + * implemented in your theme here, or extend some other theme that has a class + * file specified (e.g. Reindeer or Runo). + * </p> + * <p> + * All theme class files should follow the convention of specifying the theme + * name as a string constant <code>THEME_NAME</code>. + * + * @since 6.3.0 + * + */ +public class BaseTheme { + + public static final String THEME_NAME = "base"; + + /** + * Creates a button that looks like a regular hypertext link but still acts + * like a normal button. + */ + public static final String BUTTON_LINK = "link"; + + /** + * Removes extra decorations from the panel. + * + * @deprecated Base theme does not implement this style, but it is defined + * here since it has been a part of the framework before + * multiple themes were available. Use the constant provided by + * the theme you're using instead, e.g. + * {@link Reindeer#PANEL_LIGHT} or {@link Runo#PANEL_LIGHT}. + */ + @Deprecated + public static final String PANEL_LIGHT = "light"; + + /** + * Adds the connector lines between a parent node and its child nodes to + * indicate the tree hierarchy better. + */ + public static final String TREE_CONNECTORS = "connectors"; + + /** + * Clips the component so it will be constrained to its given size and not + * overflow. + */ + public static final String CLIP = "v-clip"; + +}
\ No newline at end of file diff --git a/server/src/com/vaadin/ui/themes/ChameleonTheme.java b/server/src/com/vaadin/ui/themes/ChameleonTheme.java new file mode 100644 index 0000000000..5ae8cd4e57 --- /dev/null +++ b/server/src/com/vaadin/ui/themes/ChameleonTheme.java @@ -0,0 +1,365 @@ +/* +@VaadinApache2LicenseForJavaFiles@ + */ +package com.vaadin.ui.themes; + +public class ChameleonTheme extends BaseTheme { + + public static final String THEME_NAME = "chameleon"; + + /*************************************************************************** + * Label styles + **************************************************************************/ + + /** + * Large font for main application headings + */ + public static final String LABEL_H1 = "h1"; + + /** + * Large font for different sections in the application + */ + public static final String LABEL_H2 = "h2"; + + /** + * Font for sub-section headers + */ + public static final String LABEL_H3 = "h3"; + + /** + * Font for paragraphs headers + */ + public static final String LABEL_H4 = "h4"; + + /** + * Big font for important or emphasized texts + */ + public static final String LABEL_BIG = "big"; + + /** + * Small and a little lighter font + */ + public static final String LABEL_SMALL = "small"; + + /** + * Very small and lighter font for things such as footnotes and component + * specific informations. Use carefully, since this style will usually + * reduce legibility. + */ + public static final String LABEL_TINY = "tiny"; + + /** + * Adds color to the text (usually the alternate color of the theme) + */ + public static final String LABEL_COLOR = "color"; + + /** + * Adds a warning icon on the left side and a yellow background to the label + */ + public static final String LABEL_WARNING = "warning"; + + /** + * Adds an error icon on the left side and a red background to the label + */ + public static final String LABEL_ERROR = "error"; + + /** + * Adds a spinner icon on the left side of the label + */ + public static final String LABEL_LOADING = "loading"; + + /*************************************************************************** + * Button styles + **************************************************************************/ + + /** + * Default action style for buttons (the button that gets activated when + * user presses 'enter' in a form). Use sparingly, only one default button + * per screen should be visible. + */ + public static final String BUTTON_DEFAULT = "default"; + + /** + * Small sized button, use for context specific actions for example + */ + public static final String BUTTON_SMALL = "small"; + + /** + * Big button, use to get more attention for the button action + */ + public static final String BUTTON_BIG = "big"; + + /** + * Adds more padding on the sides of the button. Makes it easier for the + * user to hit the button. + */ + public static final String BUTTON_WIDE = "wide"; + + /** + * Adds more padding on the top and on the bottom of the button. Makes it + * easier for the user to hit the button. + */ + public static final String BUTTON_TALL = "tall"; + + /** + * Removes all graphics from the button, leaving only the caption and the + * icon visible. Useful for making icon-only buttons and toolbar buttons. + */ + public static final String BUTTON_BORDERLESS = "borderless"; + + /** + * Places the button icon on top of the caption. By default the icon is on + * the left side of the button caption. + */ + public static final String BUTTON_ICON_ON_TOP = "icon-on-top"; + + /** + * Places the button icon on the right side of the caption. By default the + * icon is on the left side of the button caption. + */ + public static final String BUTTON_ICON_ON_RIGHT = "icon-on-right"; + + /** + * Removes the button caption and only shows its icon + */ + public static final String BUTTON_ICON_ONLY = "icon-only"; + + /** + * Makes the button look like it is pressed down. Useful for creating a + * toggle button. + */ + public static final String BUTTON_DOWN = "down"; + + /*************************************************************************** + * TextField styles + **************************************************************************/ + + /** + * Small sized text field with small font + */ + public static final String TEXTFIELD_SMALL = "small"; + + /** + * Large sized text field with big font + */ + public static final String TEXTFIELD_BIG = "big"; + + /** + * Adds a magnifier icon on the left side of the fields text + */ + public static final String TEXTFIELD_SEARCH = "search"; + + /*************************************************************************** + * Select styles + **************************************************************************/ + + /** + * Small sized select with small font + */ + public static final String SELECT_SMALL = "small"; + + /** + * Large sized select with big font + */ + public static final String SELECT_BIG = "big"; + + /** + * Adds a magnifier icon on the left side of the fields text + */ + public static final String COMBOBOX_SEARCH = "search"; + + /** + * Adds a magnifier icon on the left side of the fields text + */ + public static final String COMBOBOX_SELECT_BUTTON = "select-button"; + + /*************************************************************************** + * DateField styles + **************************************************************************/ + + /** + * Small sized date field with small font + */ + public static final String DATEFIELD_SMALL = "small"; + + /** + * Large sized date field with big font + */ + public static final String DATEFIELD_BIG = "big"; + + /*************************************************************************** + * Panel styles + **************************************************************************/ + + /** + * Removes borders and background color from the panel + */ + public static final String PANEL_BORDERLESS = "borderless"; + + /** + * Adds a more vibrant header for the panel, using the alternate color of + * the theme, and adds slight rounded corners (not supported in all + * browsers) + */ + public static final String PANEL_BUBBLE = "bubble"; + + /** + * Removes borders and background color from the panel + */ + public static final String PANEL_LIGHT = "light"; + + /*************************************************************************** + * SplitPanel styles + **************************************************************************/ + + /** + * Reduces the split handle to a minimal size (1 pixel) + */ + public static final String SPLITPANEL_SMALL = "small"; + + /*************************************************************************** + * TabSheet styles + **************************************************************************/ + + /** + * Removes borders and background color from the tab sheet + */ + public static final String TABSHEET_BORDERLESS = "borderless"; + + /*************************************************************************** + * Accordion styles + **************************************************************************/ + + /** + * Makes the accordion background opaque (non-transparent) + */ + public static final String ACCORDION_OPAQUE = "opaque"; + + /*************************************************************************** + * Table styles + **************************************************************************/ + + /** + * Removes borders and background color from the table + */ + public static final String TABLE_BORDERLESS = "borderless"; + + /** + * Makes the column header and content font size smaller inside the table + */ + public static final String TABLE_SMALL = "small"; + + /** + * Makes the column header and content font size bigger inside the table + */ + public static final String TABLE_BIG = "big"; + + /** + * Adds a light alternate background color to even rows in the table. + */ + public static final String TABLE_STRIPED = "striped"; + + /*************************************************************************** + * ProgressIndicator styles + **************************************************************************/ + + /** + * Reduces the height of the progress bar + */ + public static final String PROGRESS_INDICATOR_SMALL = "small"; + + /** + * Increases the height of the progress bar. If the indicator is in + * indeterminate mode, shows a bigger spinner than the regular indeterminate + * indicator. + */ + public static final String PROGRESS_INDICATOR_BIG = "big"; + + /** + * Displays an indeterminate progress indicator as a bar with animated + * background stripes. This style can be used in combination with the + * "small" and "big" styles. + */ + public static final String PROGRESS_INDICATOR_INDETERMINATE_BAR = "bar"; + + /*************************************************************************** + * Window styles + **************************************************************************/ + + /** + * Sub-window style that makes the window background opaque (i.e. not + * semi-transparent). + */ + public static final String WINDOW_OPAQUE = "opaque"; + + /*************************************************************************** + * Compound styles + **************************************************************************/ + + /** + * Creates a context for a segment button control. Place buttons inside the + * segment, and add "<code>first</code>" and "<code>last</code>" style names + * for the first and last button in the segment. Then use the + * {@link #BUTTON_DOWN} style to indicate button states. + * + * E.g. + * + * <pre> + * HorizontalLayout ("segment") + * + Button ("first down") + * + Button ("down") + * + Button + * ... + * + Button ("last") + * </pre> + * + * You can also use most of the different button styles for the contained + * buttons (e.g. {@link #BUTTON_BIG}, {@link #BUTTON_ICON_ONLY} etc.). + */ + public static final String COMPOUND_HORIZONTAL_LAYOUT_SEGMENT = "segment"; + + /** + * Use this mixin-style in combination with the + * {@link #COMPOUND_HORIZONTAL_LAYOUT_SEGMENT} style to make buttons with + * the "down" style use the themes alternate color (e.g. blue instead of + * gray). + * + * E.g. + * + * <pre> + * HorizontalLayout ("segment segment-alternate") + * + Button ("first down") + * + Button ("down") + * + Button + * ... + * + Button ("last") + * </pre> + */ + public static final String COMPOUND_HORIZONTAL_LAYOUT_SEGMENT_ALTERNATE = "segment-alternate"; + + /** + * Creates an iTunes-like menu from a CssLayout or a VerticalLayout. Place + * plain Labels and NativeButtons inside the layout, and you're all set. + * + * E.g. + * + * <pre> + * CssLayout ("sidebar-menu") + * + Label + * + NativeButton + * + NativeButton + * ... + * + Label + * + NativeButton + * </pre> + */ + public static final String COMPOUND_LAYOUT_SIDEBAR_MENU = "sidebar-menu"; + + /** + * Adds a toolbar-like background for the layout, and aligns Buttons and + * Segments horizontally. Feel free to use different buttons styles inside + * the toolbar, like {@link #BUTTON_ICON_ON_TOP} and + * {@link #BUTTON_BORDERLESS} + */ + public static final String COMPOUND_CSSLAYOUT_TOOLBAR = "toolbar"; +} diff --git a/server/src/com/vaadin/ui/themes/LiferayTheme.java b/server/src/com/vaadin/ui/themes/LiferayTheme.java new file mode 100644 index 0000000000..9b48306ac2 --- /dev/null +++ b/server/src/com/vaadin/ui/themes/LiferayTheme.java @@ -0,0 +1,31 @@ +/* +@VaadinApache2LicenseForJavaFiles@ + */ +package com.vaadin.ui.themes; + +public class LiferayTheme extends BaseTheme { + + public static final String THEME_NAME = "liferay"; + + /*************************************************************************** + * + * Panel styles + * + **************************************************************************/ + + /** + * Removes borders and background from the panel + */ + public static final String PANEL_LIGHT = "light"; + + /*************************************************************************** + * + * SplitPanel styles + * + **************************************************************************/ + + /** + * Reduces the split handle to a minimal size (1 pixel) + */ + public static final String SPLITPANEL_SMALL = "small"; +} diff --git a/server/src/com/vaadin/ui/themes/Reindeer.java b/server/src/com/vaadin/ui/themes/Reindeer.java new file mode 100644 index 0000000000..7aaae8faa2 --- /dev/null +++ b/server/src/com/vaadin/ui/themes/Reindeer.java @@ -0,0 +1,217 @@ +/* +@VaadinApache2LicenseForJavaFiles@ + */ +package com.vaadin.ui.themes; + +import com.vaadin.ui.CssLayout; +import com.vaadin.ui.FormLayout; +import com.vaadin.ui.GridLayout; +import com.vaadin.ui.HorizontalLayout; +import com.vaadin.ui.HorizontalSplitPanel; +import com.vaadin.ui.VerticalLayout; +import com.vaadin.ui.VerticalSplitPanel; + +public class Reindeer extends BaseTheme { + + public static final String THEME_NAME = "reindeer"; + + /*************************************************************************** + * + * Label styles + * + **************************************************************************/ + + /** + * Large font for main application headings + */ + public static final String LABEL_H1 = "h1"; + + /** + * Large font for different sections in the application + */ + public static final String LABEL_H2 = "h2"; + + /** + * Small and a little lighter font + */ + public static final String LABEL_SMALL = "light"; + + /** + * @deprecated Use {@link #LABEL_SMALL} instead. + */ + @Deprecated + public static final String LABEL_LIGHT = "small"; + + /*************************************************************************** + * + * Button styles + * + **************************************************************************/ + + /** + * Default action style for buttons (the button that should get activated + * when the user presses 'enter' in a form). Use sparingly, only one default + * button per view should be visible. + */ + public static final String BUTTON_DEFAULT = "primary"; + + /** + * @deprecated Use {@link #BUTTON_DEFAULT} instead + */ + @Deprecated + public static final String BUTTON_PRIMARY = BUTTON_DEFAULT; + + /** + * Small sized button, use for context specific actions for example + */ + public static final String BUTTON_SMALL = "small"; + + /*************************************************************************** + * + * TextField styles + * + **************************************************************************/ + + /** + * Small sized text field with small font + */ + public static final String TEXTFIELD_SMALL = "small"; + + /*************************************************************************** + * + * Panel styles + * + **************************************************************************/ + + /** + * Removes borders and background color from the panel + */ + public static final String PANEL_LIGHT = "light"; + + /*************************************************************************** + * + * SplitPanel styles + * + **************************************************************************/ + + /** + * Reduces the split handle to a minimal size (1 pixel) + */ + public static final String SPLITPANEL_SMALL = "small"; + + /*************************************************************************** + * + * TabSheet styles + * + **************************************************************************/ + + /** + * Removes borders from the default tab sheet style. + */ + public static final String TABSHEET_BORDERLESS = "borderless"; + + /** + * Removes borders and background color from the tab sheet, and shows the + * tabs as a small bar. + */ + public static final String TABSHEET_SMALL = "bar"; + + /** + * @deprecated Use {@link #TABSHEET_SMALL} instead. + */ + @Deprecated + public static final String TABSHEET_BAR = TABSHEET_SMALL; + + /** + * Removes borders and background color from the tab sheet. The tabs are + * presented with minimal lines indicating the selected tab. + */ + public static final String TABSHEET_MINIMAL = "minimal"; + + /** + * Makes the tab close buttons visible only when the user is hovering over + * the tab. + */ + public static final String TABSHEET_HOVER_CLOSABLE = "hover-closable"; + + /** + * Makes the tab close buttons visible only when the tab is selected. + */ + public static final String TABSHEET_SELECTED_CLOSABLE = "selected-closable"; + + /*************************************************************************** + * + * Table styles + * + **************************************************************************/ + + /** + * Removes borders from the table + */ + public static final String TABLE_BORDERLESS = "borderless"; + + /** + * Makes the table headers dark and more prominent. + */ + public static final String TABLE_STRONG = "strong"; + + /*************************************************************************** + * + * Layout styles + * + **************************************************************************/ + + /** + * Changes the background of a layout to white. Applies to + * {@link VerticalLayout}, {@link HorizontalLayout}, {@link GridLayout}, + * {@link FormLayout}, {@link CssLayout}, {@link VerticalSplitPanel} and + * {@link HorizontalSplitPanel}. + * <p> + * <em>Does not revert any contained components back to normal if some + * parent layout has style {@link #LAYOUT_BLACK} applied.</em> + */ + public static final String LAYOUT_WHITE = "white"; + + /** + * Changes the background of a layout to a shade of blue. Applies to + * {@link VerticalLayout}, {@link HorizontalLayout}, {@link GridLayout}, + * {@link FormLayout}, {@link CssLayout}, {@link VerticalSplitPanel} and + * {@link HorizontalSplitPanel}. + * <p> + * <em>Does not revert any contained components back to normal if some + * parent layout has style {@link #LAYOUT_BLACK} applied.</em> + */ + public static final String LAYOUT_BLUE = "blue"; + + /** + * <p> + * Changes the background of a layout to almost black, and at the same time + * transforms contained components to their black style correspondents when + * available. At least texts, buttons, text fields, selects, date fields, + * tables and a few other component styles should change. + * </p> + * <p> + * Applies to {@link VerticalLayout}, {@link HorizontalLayout}, + * {@link GridLayout}, {@link FormLayout} and {@link CssLayout}. + * </p> + * + */ + public static final String LAYOUT_BLACK = "black"; + + /*************************************************************************** + * + * Window styles + * + **************************************************************************/ + + /** + * Makes the whole window white and increases the font size of the title. + */ + public static final String WINDOW_LIGHT = "light"; + + /** + * Makes the whole window black, and changes contained components in the + * same way as {@link #LAYOUT_BLACK} does. + */ + public static final String WINDOW_BLACK = "black"; +} diff --git a/server/src/com/vaadin/ui/themes/Runo.java b/server/src/com/vaadin/ui/themes/Runo.java new file mode 100644 index 0000000000..28a19e8dcd --- /dev/null +++ b/server/src/com/vaadin/ui/themes/Runo.java @@ -0,0 +1,183 @@ +/* +@VaadinApache2LicenseForJavaFiles@ + */ +package com.vaadin.ui.themes; + +public class Runo extends BaseTheme { + + public static final String THEME_NAME = "runo"; + + public static String themeName() { + return THEME_NAME.toLowerCase(); + } + + /*************************************************************************** + * + * Button styles + * + **************************************************************************/ + + /** + * Small sized button, use for context specific actions for example + */ + public static final String BUTTON_SMALL = "small"; + + /** + * Big sized button, use to gather much attention for some particular action + */ + public static final String BUTTON_BIG = "big"; + + /** + * Default action style for buttons (the button that should get activated + * when the user presses 'enter' in a form). Use sparingly, only one default + * button per view should be visible. + */ + public static final String BUTTON_DEFAULT = "default"; + + /*************************************************************************** + * + * Panel styles + * + **************************************************************************/ + + /** + * Removes borders and background color from the panel + */ + public static final String PANEL_LIGHT = "light"; + + /*************************************************************************** + * + * TabSheet styles + * + **************************************************************************/ + + /** + * Smaller tabs, no border and background for content area + */ + public static final String TABSHEET_SMALL = "light"; + + /*************************************************************************** + * + * SplitPanel styles + * + **************************************************************************/ + + /** + * Reduces the width/height of the split handle. Useful when you don't want + * the split handle to touch the sides of the containing layout. + */ + public static final String SPLITPANEL_REDUCED = "rounded"; + + /** + * Reduces the visual size of the split handle to one pixel (the active drag + * size is still larger). + */ + public static final String SPLITPANEL_SMALL = "small"; + + /*************************************************************************** + * + * Label styles + * + **************************************************************************/ + + /** + * Largest title/header size. Use for main sections in your application. + */ + public static final String LABEL_H1 = "h1"; + + /** + * Similar style as in panel captions. Useful for sub-sections within a + * view. + */ + public static final String LABEL_H2 = "h2"; + + /** + * Small font size. Useful for contextual help texts and similar less + * frequently needed information. Use with modesty, since this style will be + * more harder to read due to its smaller size and contrast. + */ + public static final String LABEL_SMALL = "small"; + + /*************************************************************************** + * + * Layout styles + * + **************************************************************************/ + + /** + * An alternative background color for layouts. Use on top of white + * background (e.g. inside Panels, TabSheets and sub-windows). + */ + public static final String LAYOUT_DARKER = "darker"; + + /** + * Add a drop shadow around the layout and its contained components. + * Produces a rectangular shadow, even if the contained component would have + * a different shape. + * <p> + * Note: does not work in Internet Explorer 6 + */ + public static final String CSSLAYOUT_SHADOW = "box-shadow"; + + /** + * Adds necessary styles to the layout to make it look selectable (i.e. + * clickable). Add a click listener for the layout, and toggle the + * {@link #CSSLAYOUT_SELECTABLE_SELECTED} style for the same layout to make + * it look selected or not. + */ + public static final String CSSLAYOUT_SELECTABLE = "selectable"; + public static final String CSSLAYOUT_SELECTABLE_SELECTED = "selectable-selected"; + + /*************************************************************************** + * + * TextField styles + * + **************************************************************************/ + + /** + * Small sized text field with small font + */ + public static final String TEXTFIELD_SMALL = "small"; + + /*************************************************************************** + * + * Table styles + * + **************************************************************************/ + + /** + * Smaller header and item fonts. + */ + public static final String TABLE_SMALL = "small"; + + /** + * Removes the border and background color from the table. Removes + * alternating row background colors as well. + */ + public static final String TABLE_BORDERLESS = "borderless"; + + /*************************************************************************** + * + * Accordion styles + * + **************************************************************************/ + + /** + * A detached looking accordion, providing space around its captions and + * content. Doesn't necessarily need a Panel or other container to wrap it + * in order to make it look right. + */ + public static final String ACCORDION_LIGHT = "light"; + + /*************************************************************************** + * + * Window styles + * + **************************************************************************/ + + /** + * Smaller header and a darker background color for the window. Useful for + * smaller dialog-like windows. + */ + public static final String WINDOW_DIALOG = "dialog"; +} |