Gatein 3.5.2 - "Overwriting" CSS class .UIWorkingWorkspace within Portal container extension

[regis.mazur]

Hi,

I'm trying to change the page size for every portal pages and for that i need to "overwrite" the CSS class named ".UIWorkingWorkspace" located in ../gatein/gatein.ear/eXoResources.war/skin/DefaultSkin/portal/webui/component/control/UIWorkspace/Stylesheet.css.

My question is: How do I simply do it without re-implementing all Exo CSS files and associated image resources within my Portal Container Extension?

Thanks.

Regis

[rutlucas]

Hi Regis,

I think that you need a custom skin for that, like the skin used for mobile.

Other strategy it can be to add in the top of the skin .css, some exceptions and you can try to mark with !important.

This last strategy can be less modular but it needs less modifications.

Personally, I like to add a new skin with your changes, for long maintenance it can be more clear.

Hope this helps.

Lucas

[vstorm83]

Hi Regis, to customize skin, you can write new skin or just write a skin-module that extend default skin. In both way, you don't need to re-write completely all CSS file. Pls look at this example: https://github.com/gatein/gatein-portal/tree/3.6.3.Final/examples/skins/simpleskin

--> it's a new skin "SimpleSkin" but it only need to provide some new CSS files, the "default" css file is re-used by using CSS "import", like this:

@import url(/eXoResources/skin/DefaultSkin/webui/component/Stylesheet.css); 

If you don't want a new skin, you can extend the default skin by providing skin-module, like this:

<portal-skin>

    <skin-name>Default</skin-name>

    <skin-module>MyModule</skin-module>

    <css-path>/path/to/extend-module.css</css-path>

</portal-skin>

Notice that <skin-name> point to the skin name that you want this module extend from