overlay tabs components styles are not loading | Community
Skip to main content
Level 3
September 6, 2023
Solved

overlay tabs components styles are not loading

  • September 6, 2023
  • 1 reply
  • 1128 views

Hi Team,

 

I have to achieve the overlay tabs component how it is designed in we-retail. I have overlay the tabs component from the core component(2.11.0 version ) into my project but i am trying to load the style but those are not loading(the tabs are loading vertically without design). Can you please help me how to achieve  the same behaviour as we-retail.

 

 

Thank you,

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by aanchal-sikka

Issue i have observed after overlay the tabs component clintlibs related to tabs component not loading ! after i have embedded it , i am able to see the changes. 

 

If i overlay a component it should load all its dependencies and libraries am i correct ?  


@satish2info-1 

 

In the official documentation, it is mentioned:

 

It appers, the clientlibs which you have identified might have been affecting tabs as well.

And after the embed, styles might be working for both.

 

Can you please confirm for the same page, by adding both tabs and new component?

 

 

 

1 reply

aanchal-sikka
Community Advisor
Community Advisor
September 6, 2023

Hello @satish2info-1 

 

Once you create an overlay, you need to create the policy specific to the new component.

 

policies are recognized by paths under conf. Overlay is idenfied as a new component from its perspective.

 

Hence, to append styles:

- go to the template

- click on the new component to create policy.

- Copy the values in Styles tab from the "Tabs" component to new component. Save

 

You should now get the Styles and should be able to apply as well

Aanchal Sikka
Level 3
September 6, 2023

Hi @aanchal-sikka ,

Template level policy specific to tabs component we can append but I am trying to load the styles external through client libs how it is there in we- retail but those are not loading. After your comment I have verified in we- retail tabs component policys but those are  not defined. need to know how those are loading ! 

 

Could you please let me know if you have any other thoughts?

 

 

aanchal-sikka
Community Advisor
Community Advisor
September 6, 2023

@satish2info-1 

 

Apologies, I thought you are referring to Style System.

 

Can you possibly check if client libraries are loading on your page?

Please add the Tabs component and check once.

 

If yes, please check if the styles are dependent on the name of the component. The component names are available in enclosing <div> when a component is rendered

Aanchal Sikka