AddLinkTag classes is not overriding the default theme css classes

AddLinkTag classes is not overriding the default theme css classes

  

Hi,

When I add external CSS file using HttpRequestHandler's AddLinkTag to screen, it is adding to head section. but classes in external css file is not overriding the default css classes, actually it's happening in reverse. 

Ex: I have .Button class in external css file with property color:Red, but in default theme it's Blue. so color of buttons should be Red as per my external CSS class, but it's taking default Button class instead of class from external file.

Does any one have any idea how to load CSS classes from external file?


Thanks,

Siva

Hello sivaramakrishna, the HttpRequestHandler's action you may want to use is "AddStyleSheetTag" no?


Best Regards

Thanks Paulo for your reply,

I tried both methods. They are adding stylesheet to head tag in html but classes from CSS file are not applying.

Thanks,

Siva


Solution

Hi Sivaramakrishna,

If you "inspect" the html, you will see that problem is that the CSS import html tag is being set BEFORE the default ones (like the base theme CSS).

If you want to add a CSS to a PAGE, use the Page CSS stylesheet to do it. A file will be created for you and used automatically, in the correct order.

Another option is to add an expression with Escape Content set to NO, and you add a <style> ... </style> tag tit. You can put this in a web block and add this web block to the top of the page (before the layout).

You can also change the Application theme.

Or, you can create a new flow, move the pages you want to change the style there, create a new theme in the module and set the flow to use this theme, setting its style sheet to your CSS.

(The methods I remember from the top of my head)

Cheers,
Eduardo Jauch.


Solution