2.1.5. Default skin

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

WEB-INF/gatein-resources.xml

This file defines the skin setup to use. For the default portal skin, this file contains definitions for the portal skin, the window decorations 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-INF/web.xml

This file contains the resource filter and has the display-name set. 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.

skin/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 main content points of this file are:


 /* Skin for the main portal page */
@import url(DefaultSkin/portal/webui/component/UIPortalApplicationSkin.css);
/* Skins for various portal components */
@import url(DefaultSkin/webui/component/Stylesheet.css);
/* Window decoration skins */
@import url(PortletThemes/Stylesheet.css);
/* The portlet specification CSS classes */
@import url(Portlet/Stylesheet.css);
          

This method imports other CSS stylesheet files (some of which may also import further CSS stylesheets) instead of defining all the CSS classes in this one file. Splitting the CSS classes between multiple files allows 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 ©. All rights reserved. eXo Platform SAS
blog comments powered byDisqus