Best Answer

Help - Public Catalog Page CSS

  • 28 February 2024
  • 6 replies
  • 86 views
G
Rank
Userlevel 4

Howdy all,

Hoping the CSS gurus among you can provide assistance for the below (seemingly simple) CSS tweaks to the public catalog page (pre-SSO):

 

Change the background colour of the page. Have achieved this for the post SSO home page by targeting page ID #. However, this does not appear to work for the public page, what am I missing here?

#doc-page-catalog {

      background-color: #000000;

}

 

Reduce the height of the header image by half. Simply uploading an image with reduced height px does not achieve this. The below code variations are also not working. Any ideas?

#doc-page-catalog > div > intro.text-white {

    height: 150px !important;

}

 

Any assistance greatly appreciated. 

icon

Best answer by Bfarkas 1 March 2024, 20:57

View original

6 replies

Bfarkas
Rank
Userlevel 7
Badge +3

I only have  subscription page public catalog available at the moment, but the setup seems roughly the same. Try these:

.catalog-intro .text-white {
height: 150px !important;
}

.tab.tab-visible {
    background-color: #000000;
}

If you can snag the unique page id, you can add it as precursors to both of these like you have been doing for safety as well.

Bfarkas
Rank
Userlevel 7
Badge +3

@GRuss any luck here?

G
Rank
Userlevel 4

Hi @Bfarkas - these both worked well, many thanks! 

G
Rank
Userlevel 4

@Bfarkas - a further public catalog CSS conundrum: Catalog widget description text colour is barely readable and remains stubbornly unchanged despite applying the below and this working fine across all post SSO pages:
 

span.ui-carousel-description.ui-typography-body.ng-star-inserted {

color: white !important;

{


Any ideas?

 

1 Attachment
Bfarkas
Rank
Userlevel 7
Badge +3

So first, just generally be careful, your closing bracket above is an open bracket.

That being said, that doesn’t seem to work for me at all on either side (logged in or out), and I don’t see a way around it for anything as it seems like the built in CSS is already using important tags to get around it. Only real solve seems to be to change the primary font color choice which will result in changes everywhere...

G
Rank
Userlevel 4

@Bfarkas thanks anyway for exploring this. Guess we’ll have to try and find a workaround. 

Reply


Terms & ConditionsCookie settings