Okay
  Public Ticket #3218114
Font and text colors
Closed

Comments

  •  30
    lumpy5000 started the conversation

    Hello. Is there an easy way to choose colors for each of the text/font elements from H1, H2, etc? There are no options in Salient options as far as I can tell. I would like to select a color that will globally affect all H1, H2, H3, etc. Thank you. 

  •  8,839
    Tahir replied

    Hey Again,

    This would have to be done using Some Custom CSS. If you could setup a test page for us so we can write it up.

    Thanks 


    ThemeNectar Support Team 

  •  30
    lumpy5000 replied

    Thank you. Below is a link to the testing page. Again, I would just like the ability to apply global colors to each H1, H2, etc so that I don't need to specify colors on every text element on every page individually. I feel like text color settings should be standard in the theme settings under "Typography / General HTML elements". Hopefully it can be added to future releases of the Salient theme. Please let me know if you need anything else. 

    https://radiantsites.net/valley/sample-page/

  •  2,958
    Andrew replied

    Hello again,

    Thank you for getting back to us.

    You can try adding this CSS to change the colors of your header texts. You can change the color hex decimals to suite your needs.

    h1 {
        color: #FF0000 !important;
    }
    h2 {
        color: #00FF00 !important;
    }
    h3 {
        color: #0000FF !important;
    }
    h4 {
        color: #FFA500 !important;
    }
    h5 {
        color: #f0f0f0 !important;
    }
    h6 {
        color: #F0F !important;
    }
    

    Let us know if you need further assistance.

    Kind regards,

  •  30
    lumpy5000 replied

    Perfect! Thank you!! 

  •  30
    lumpy5000 replied

    Actually one more thing. This overrides the option to select Light or Custom font colors within a row. Is there custom CSS that would allow me to choose custom font colors (like you provided) for just the Dark version, but still allow Light to be selected in a row when necessary for white text? Thank you. 

  •  2,958
    Andrew replied

    Hello again,

    Thank you for getting back to us.

    Could you set the page/site to dark mode so we can see if we can add some custom CSS for this?

    We look forward to your feedback.

    Kind regards,

  •  30
    lumpy5000 replied

    The sample page is already set to Dark text (which is the default setting). For now, I have gone into Salient settings and changed the overall font color to #2b4050. This is what I'll be using for most headers. I also disabled the custom CSS you provided earlier. But it would be nice if there was CSS code that allow me to control the "Dark" font for each while also allowing for Light or Custom options when needed. Thank you. 

  •  8,839
    Tahir replied

    Please setup a test page with the light and dark texts so we can write up custom CSS for it. 

    Best 


    ThemeNectar Support Team 

  •  30
    lumpy5000 replied

    Sure. I have now updated the sample page with both Dark and Light text elements. Thank you. 

    https://radiantsites.net/valley/sample-page

  •  8,839
    Tahir replied

    Hey Again,

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    body, body h1, body h2, body h3, body h4, body h5, body h6{
        color: #2b4050 !important;
    }
    .light h1, .light h2, .light h3, .light h4, .light h5, .light h6, .light p {
        color: #85aec3 !important;
    }

    Thanks


    ThemeNectar Support Team