the_wildlings: a shadowy forest or jungle, with the eyes of many wild creatures peering out through the leaves. mostly big cats. (Default)
wildlings ([personal profile] the_wildlings) wrote in [community profile] style_system2022-10-01 11:18 pm

customising navigation strip colours in transmogrified

hello kind code-mages,

we are using the dark forest style for transmogrified. we have 2 questions.

1) is it possible to make the navigation strip display in custom colours, on a style where that is not an option on the customisation page (such as our current one)? both of the default colour gradients hurt our eyes.

2) is there a way to customise the colours of the text input box & dropdown menu box in the navigation strip (for the sitewide search function)? despite our accessibility settings, they are defaulting to a glaring white background with black text, which is painful for us.

we read through the ~color, page:navigation & navigation strip tags, and did not find these answers. could any generous wizards help us?

thankyou very much in advance.
london_fan: Almost invisible text: /*CSS-Ninja*/ body {display: none;} (CSS|Code|Ninja)

[personal profile] london_fan 2022-10-02 02:45 pm (UTC)(link)
Hello there,

hopefully I understood your questions correctly, so that my answer is helpful. I compiled a bit of code for you using the colors of your current style. I also changed the text and link colors to match, so you don't have to deal with the default bright text color. Feel free to change things around to make them meet your needs. Good Luck!

/* Background and text color of the nav strip */
#lj_controlstrip {
background: #123322; /
color: #408460;
border-bottom: 0px solid #123322;
}

/* Removing the dividing lines bewtween the nav strip areas*/
#lj_controlstrip_user, #lj_controlstrip_login, #lj_controlstrip_actionlinks {
border: 0;
}

/* Link color of the nav strip */
#lj_controlstrip a {
color: #408460;
}

/* Status text "You're viewing..." */
#lj_controlstrip_statustext {
color: #408460;
}

/* Search and Dropdown menu colors */
#lj_controlstrip input#search, #lj_controlstrip select {
background: #408460;
color: #123322;
border: 0;
}