Customizing the Admin Area

[DiZZ]

Hi All,

I've read that customizing the admin area can be difficult, but I would like to change the dark/light green backgrounds on the admin navigation links to shades of blue. It doesn't appear that I can do this from the CSS, are the styles coded in-line somehwere? If so, can anyone refer me to the appropriate file? THANKS!

[kuroi]

No, these colors are not inline. They're in the admin stylesheet.css and very easy to change.

[azure]

thank you, i've been going crazy trying to find where to change it!

to customize the top black bar, it is found in stylesheet.css and the color is 003d00

to customize that lighter green bar underneath, it is found in menu.css and the color is 599659

Both of these files are in these folders:
admin/includes

Do a CTRL+F to search for these colors, and replace it with your desired color.

There are also hover colors you will want to change to compliment your new color palette

[ronlee67]

To be a little more specific here are the changes I located. These seem to cover all the settings that by default are some shade of green. I changed mine to blues and it looks great!


In admins/includes/stylesheet.css

Top bar (default dark green 003d00)
find and change:

.headerBar{
background-color:#003D00;



Login screen, box outlining "Admin Login":
find and change:

body#login legend{
background:#ffffff;
border:1px solid #003d00;
color:#333333;
font-size:90%;
padding:0.2em 0.5em;
text-align:right;
}


The background color for the box heading where you select to edit a specific set of parameters. Located on the right side of page after you select an item to configure.
find and change:

.infoBoxHeading{
background-color:#003D00;
color:#ffffff;
}


Page heading text color:
find and change:

h1,.pageHeading{
color:#003D00; /*727272*/
font-size:16px;
font-variant:small-caps;
font-weight:bold;
}


------

In admin/includes/menu.css:

Color of the lighter 2nd menu bar (default light green 599659):
find and change:

ul.nde-menu-system{
background-color:#599659;
display:block;
margin:0;
padding:4px 10px;
}


Top border of the popdown menu displayed after you select a menu category from the 2nd top menu:
find and change:

ul.nde-menu-system ul{
background-color:#599659;
display:block;
margin:0;
padding:4px 0 0;
}
Very light background color to the popdown menus

ul.nde-menu-system li ul li a{
background-color:#EFF4EA;
color:#333333;
display:block;
font-weight:normal;
margin:0;
padding:3px 5px;
}


Not sure what the following color setting affects, but by default it is dark green.
I changed it on mine to red to see where it shows up and haven't found anything yet.
Probably safe to change it to the same color as your top bar (dark).

ul.nde-menu-system li{
border-right:1px solid #003d00;
color:#ffffff;
display:inline;
font-weight:bold;
margin:0;
padding:0 10px;
position:relative;
}