cancel
Showing results for 
Search instead for 
Did you mean: 

How do I override css definition in cscockpit?

Former Member
0 Kudos
931

We have custom extension based on yacceleratorcockpits where we override xml configuration of cscockpit containers. Where we should put css files in order to override css definitions from cscockpit?

Accepted Solutions (1)

Accepted Solutions (1)

Former Member
0 Kudos

Soulution with themeConfig bean doesnt work at all - cscockpit doesn't use this bean. In our project we put css file and modified index.zul file and replace those files using ant buildcallback respectively. Like this

index.zul
 <!--  custom styles in here -->
 <style src="/cockpit/css/cockpit.css" /> 
 <style src="/cscockpit/css/cscockpit.css" />
 <style src="/cscockpit/css/mycscockpit.css" />

buildcallbacks.xml:

             <if>
                 <isset property="ext.cscockpit.path"/>
                 <then>
                     <echo level="info" message="mycockpits - Copying custom css to cscockpit..." />
                     <copy todir="${ext.cscockpit.path}/web/webroot/cscockpit/css">
                         <fileset dir="${ext.mycockpits.path}/resources/mycockpits/cscockpit/css">
                             <include name="mycscockpit.css" />
                         </fileset>
                     </copy>
                     <copy todir="${ext.cscockpit.path}/web/webroot">
                         <fileset dir="${ext.mycockpits.path}/resources/mycockpits/cscockpit/zul">
                             <include name="*.zul" />
                         </fileset>
                     </copy>
                 </then>
             </if>
Former Member
0 Kudos

That's the same solution that was described in comments to the best answer.

Former Member
0 Kudos

oh, i'm sorry. is it ok if i leave it here? may be someone find it useful and more clear than set of instructions...

Former Member
0 Kudos

That's perfectly fine:)

Answers (1)

Answers (1)

Former Member
0 Kudos

simplest way is to edit/replace the index.zul file located under :

cscockpit/web/webrootThis can also work in 5.2 onwards when adding to a cockpit spring xml file thats loaded by adding following entry into your extensions project.properties

cscockpit.additionalWebSpringConfigs.mycscockpitext=classpath:/mycscockpitext/cscockpit/cscockpit-spring-configs.xml

<bean id="quickordercscockpitThemeConfigListMergeDirective" depends-on="themeConfig" parent="listMergeDirective" >
       <property name="add" value="/cscockpit/css/quickorder.css" />
       <property name="listPropertyDescriptor" value="uris" />
    </bean>
Former Member
0 Kudos

Hi Richard

As I understand we should place quickorder.css under web/webroot/cscockpit/css . There's no webroot in our mycockpits extension. Isn't it that the whole purpose of this extension to customize existing cockpit extensions and do not provide any specific webroot for itself, I mean that mycockpits is not the same as mycockpit which would be completely separate cockpit extension?

Thanks

Former Member
0 Kudos

Yes as there is no web root you have to implement an ant build callback to copy the css file into the cscockpit webroot.

See the buildcallbacks.xml file in the acceleratorcockpits for a working example.

Former Member
0 Kudos

Thanks a lot Richard

I used buildcallbacks.xml to copy new css files into cscockpit webroot and to replace index.zul file which has references to stylesheets used in cscockpit. It works like a charm.

I've tried bean definition you've provided as an example and it hasn't helped, I guess it's because there's no themeConfig bean inside cscockpit.

Former Member
0 Kudos

In fact there is already a build in callback called "customize" you can perfectly use for replacing files in the platform. You may find details at https://wiki.hybris.com/display/release4/Build+Framework#BuildFramework-ReplacingFilesinthe%24%7BHYB...

Former Member
0 Kudos

Actually customize requires developer remembering to run it, its a task not a callback so I wouldn't recommend this approach.

This feature is really reserved for applying patches.

Former Member
0 Kudos

If you do not use other tools (gradle, jenkins) that manage the ant calls for you, then you're right for sure.