1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

how to change the main color of Notices?

Discussion in 'XenForo Questions and Support' started by erich37, Dec 1, 2011.

  1. erich37

    erich37 Well-Known Member

    I would like to have specific Notices to be in different color than the default light-blue.
    How do I change the main-color of one specific Notice from blue, to the same color as the yellow Prefix?
    I would like to have it the same as the default transparent appearance, just changing the main color.

    Many thanks!
     
  2. Brogan

    Brogan XenForo Moderator Staff Member

    Style Properties -> Notices
     
  3. erich37

    erich37 Well-Known Member

    thanks Brogan, but how do I apply a Notice-Style to a specific Notice ?

    I am also unsure of how to have a specific Notice with vertical scrolling and another Notice with horizontal scrolling ? Is this possible at all?

    Do I need to create a new Style (child-style) for my whole Forum in order to create ONE specific Notice with a different style ?
     
  4. dieketzer

    dieketzer Well-Known Member

    your only option is to use the styles property page to make the notice transparent then to add your css styling in each actual notice.
     
    erich37 likes this.
  5. erich37

    erich37 Well-Known Member

    where to put the CSS for ONE specific notice ?
    It seems it is not possible to customize the CSS for the Notices, maybe in a specific template ?

    I do have a Forum with a Notice.
    And I just want to change the main-color of that ONE Notice for that ONE Forum-Node only.
     
  6. dieketzer

    dieketzer Well-Known Member

    you change it in the actual notice.
    ie:
    Code:
    <p class="errorPanel" align="center">
    <span class="errorHeading" >maintenance mode</span><br />
    it may be a good idea to paste comments into a txt document prior to submission until this maintenance is complete. </p>
    is the notice set to only display in that node?
    if its not, and you wish to have the same notice using different colours in different nodes that would be more complex. i havent tried anything like that although i am sure it could be done.
     
    erich37 likes this.
  7. erich37

    erich37 Well-Known Member

    where do I find the CSS for the default Notice ?

    Thanks a lot!
     
  8. dieketzer

    dieketzer Well-Known Member

    the default notices style properties are at style properties/notices.
     
  9. erich37

    erich37 Well-Known Member

    yeah, I just want to change the default style of ONE Notice in ONE Node. It is just a single Notice, it is not a "scrolling" Notice.

    I am not sure where to put the Code you have mentioned? Into the "Message"-box of the Notice itself ? Hmm... not sure if this will change the color (border-color, bg-color) of the Notice ?
     
  10. dieketzer

    dieketzer Well-Known Member

    you put the code into the notice.
    create a new notice and make it visible to yourself. paste the code above into the notice and try it.
     
  11. ChemicalKicks

    ChemicalKicks Well-Known Member

    Did you ever get this sorted? Funnily enough I want to change a notice to yellow for one specific forum but just have all the other properties the same.
     
  12. Brogan

    Brogan XenForo Moderator Staff Member

    Create two notices - one for the specific forum, another for the rest of the site.

    For the specific forum, uncheck the Add default notice text styling option and add the custom styling to the notice contents.
     
    ChemicalKicks likes this.
  13. ChemicalKicks

    ChemicalKicks Well-Known Member

    Hey Brogan thanks for the response, that's the thing mate I have no clue about styling. All I want is the yellow background colour that matches the yellow in thread prefixes and everything else to be the same.

    I googled about and landed on a couple of pages here but they all say "add styling" I don't know anything about that so I'm stuck on what's probably the simplest thing to do.
     
  14. Brogan

    Brogan XenForo Moderator Staff Member

    The default prefix css just uses the standard HTML colour yellow, so you could do something like this:

    <div class="messageText ugc baseHtml" style="background-color: yellow">
    <div style="padding: 10px">
    Notice text here
    <div style="padding: 10px">
    </div>

    That's going to look fairly basic though, so you can just add other style elements as required.

    The inner div is to ensure there is padding between the notice border and the content text.
     
    otto and ChemicalKicks like this.
  15. ChemicalKicks

    ChemicalKicks Well-Known Member

    Is it really that simple?

    *checks*
     
  16. Brogan

    Brogan XenForo Moderator Staff Member

    I updated the code above to add an inner div due to a lack of padding.

    Don't forget to uncheck the default styling option for that notice.
     
  17. ChemicalKicks

    ChemicalKicks Well-Known Member

    Thank you was about to post for a hint about that :D
    Untitled.png
     
  18. ChemicalKicks

    ChemicalKicks Well-Known Member

    What is the default text styling in the notices?
     
  19. Brogan

    Brogan XenForo Moderator Staff Member

    It is controlled by Style Properties -> Notices.

    For the notice you want, you need to uncheck the option in the specific notice.

    notice.PNG

    That will get rid of the blue background then.
     
  20. ChemicalKicks

    ChemicalKicks Well-Known Member

    Ah yes you're going by the screeny above, I got that sorted. :) The text styling within the notices is more like message text and not notice text ;) how do I get the notice style of text back? :)

    With the notices the text is vertically aligned, any idea how to achieve that?
     

Share This Page