White text on White Baground

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • twistsol
    Senior Member
    • Mar 2015
    • 128
    • 6.X

    White text on White Baground

    I have a style issue with the help page. The title text on the page uses the style variable module_header_text_color, but does not include the module_header_background. On our site, we have a dark background for the module header and white text, but on the help page, the text is invisible because the module_header_background is not used which results in white text on a white background. The same issue appears on this site with the "Blue Green" style and a screen shot is attached. I highlighted the text so you can see it.

    Click image for larger version

Name:	Screen Shot 2018-02-08 at 8.07.07 AM.png
Views:	91
Size:	65.3 KB
ID:	4386090

    Is there a way to use CSS to change this style varialbe only on this one page?
  • In Omnibus
    Senior Member
    • Apr 2010
    • 2310

    #2
    You could add the following to your css_additional.css template:

    .module-title h1 {
    color: #000000;

    Comment

    • Wayne Luke
      vBulletin Technical Support Lead
      • Aug 2000
      • 73976

      #3
      Seems like a bug. Will have to investigate.
      Translations provided by Google.

      Wayne Luke
      The Rabid Badger - a vBulletin Cloud demonstration site.
      vBulletin 5 API

      Comment


      • In Omnibus
        In Omnibus commented
        Editing a comment
        FWIW I can reproduce this.
    • twistsol
      Senior Member
      • Mar 2015
      • 128
      • 6.X

      #4
      Originally posted by In Omnibus
      You could add the following to your css_additional.css template:

      .module-title h1 {
      color: #000000;
      The problem I have is that that changes the color on all the pages. How would I limit this to just the Help page?

      Comment

      • Wayne Luke
        vBulletin Technical Support Lead
        • Aug 2000
        • 73976

        #5
        Each page has its own CSS Class (technically it should be an ID but I digress). For instance, on this site, the Help page is .page522. You can restrict CSS by page using these classes.

        .page522 .module-title h1 {color: #000;}

        To find your help page's class, view the page source and look at the body tag.

        Code:
        <body id="vb-page-body" class="l-desktop page522 vb-page view-mode" itemscope itemtype="http://schema.org/WebPage" data-usergroupid="5" data-styleid="55">
        Translations provided by Google.

        Wayne Luke
        The Rabid Badger - a vBulletin Cloud demonstration site.
        vBulletin 5 API

        Comment


        • twistsol
          twistsol commented
          Editing a comment
          The page id piece in the CSS is what I was missing. I fixed my site for all three styles this afternoon and everything is happy.

          Thanks again
      • twistsol
        Senior Member
        • Mar 2015
        • 128
        • 6.X

        #6
        Thanks Wayne,

        Comment

        Related Topics

        Collapse

        Working...