2.1.6. The Default Skin

The default skin for GateIn 3.2 is located as part of the 01eXoResource.war. The main files associated with the skin are shown below:

(1)WEB-INF/gatein-resources.xml
(2)WEB-INF/web.xml
(3)skin/Stylesheet.css

1

gatein-resources.xml: defines the skin setup to use.

2

web.xml: contains the resource filter and has the display-name set.

3

Stylesheet.css: contains the CSS class definitions for this skin.

gatein-resources.xml

For the default portal skin, this file contains definitions for the portal skin, the window decorations that this skin provides and defines some Javascript resources which are not related to the skin. The default portal skin does not directly define portlet skins which should be provided by the portlets themeselves.

web.xml

For the default portal skin, the web.xml of eXoResources.war contains a lot of information which is mostly irrelevant to the portal skinning. The areas of interest in this file is the resourcerequestfilter and the fact that the display-name is set.

Stylesheet.css

This file contains the main stylesheet of the portal skin. The file is the main entry point to the CSS class definitions for the skin. The content of this file is shown below:

(1)
(2)@import url(DefaultSkin/portal/webui/component/UIPortalApplicationSkin.css);
(3)
@import url(DefaultSkin/webui/component/Stylesheet.css);
(4)
@import url(PortletThemes/Stylesheet.css);
@import url(Portlet/Stylesheet.css);

1

Skin for the main portal page.

2

Skins for various portal components.

3

Window decoration skins.

4

The portlet specificiation CSS classes.

Instead of defining all the CSS classes in this file, you can import other CSS stylesheet files, some of which may also import other CSS stylesheets. The CSS classes are split up between multiple files to make it easier for new skins to reuse parts of the default skin.

To reuse the CSS stylesheet from the default portal skin, you need to refer to the default skin from eXoResources. For example, to include the window decorators from the default skin within a new portal skin, you need to use this import: @import url(/eXoResources/skin/Portlet/Stylesheet.css);

Note

When the portal skin is added to the page, it merges all the CSS stylesheets into a single file.

Copyright ©2012. All rights reserved. eXo Platform SAS