How to render or hide theme resources only for one xsp

Question

I have a theme for application that load many CSS and METAS in all xpages.

My app only need all these css in the index.xsp, rest of pages are loaded by AJAX and I need that these pages would be loaded without CSS, basically without theme.

Somebody know if is possible add "rendered" property in RESOURCES or add condition to load one CSS or other?? I know that I can load other pages from other NSF without theme but is better for me to have only one NSF

<resource>
    <content-type>text/css</content-type>
    <href>css/reset.css</href>
</resource>
<resource>
    <content-type>text/css</content-type>
    <href>css/style.css</href>
</resource>
<resources>
<metaData>
        <name>MobileOptimized</name>
        <content>320</content>
    </metaData>
    <metaData>
        <name>viewport</name>
        <content>width=device-width, initial-scale=1.0,
            maximum-scale=1.0, user-scalable=no</content>
    </metaData>
</resources>

For example I have this for FORM control, This condition is valid for my app.

<control mode="override">
<name>Form</name>
<property>
    <name>styleClass</name>
    <value>#{javascript:(view.getPageName() == '/index.xsp')?'block wizard same-height':'xspForm'}</value> 
</property>

Thanks a lot

Answer 1

You can indeed use rendered for resources in a theme. You can do this, for instance:

<resource rendered="#{javascript:view.getPageName() == '/index.xsp'}">
    <content-type>text/css</content-type>
    <href>css/reset.css</href>
</resource>