Where To Change Color Of 'Select, Actions,...' Containers?

[Violette]

Forum URL: maisonduviolette.proboards.com/forum

Hi,

Where do I go to change the color of the areas where the red arrows are pointing?

[Craig]

Afternoon

Are you using a plugin to place the second pagination bar at the bottom, or a code?

The menus should be able to be changed in the advanced styles and css:

Objects > forms > select menus

[Violette]

Jan 19, 2015 5:10:20 GMT -8 Craig said:

Are you using a plugin to place the second pagination bar at the bottom, or a code?

That might be a plug-in for the pagination bar...


_______



I'm not seeing 'select menus' as a choice in the advanced styles and css page under Objects > forms >

[Craig]

Looks like you are in the stylesheet, you want to be in the visual editor tab of the advanced styles and css.

For the pagination bar, if you check the plugin settings, you should find colour options there. Pretty limiting for multiple themes, however, so surprised it doesn't take the colours from the pagination/action bar at the top. If this is an issue for you, it may be worthwhile contacting the person who made that plugin in the plugins board. Actually, first, simply try removing the background colour declared, and see if it takes the theme's colours.

[Violette]

I went into the Visual Editor and found the spot, but when I saved the changes, nothing changed. I noticed the Select Menus section was 'faded' out. Does that mean the changes to the color can't be made there?



This problem may be too 'over my head' for me to fix.

[Brian]

Try adding this to the bottom of Themes > Advanced Styles & CSS > Style Sheet. It'll make them adopt your forum's colors.

/* Pagination Dropdowns */
.control-bar .controls .status,
.control-bar .controls .ui-selectMenu-box,
.control-bar .ui-search .search-input,
.ui-selectMenu-box { background-color: @container_background_color_1; color: @container_text_color_1; }
.control-bar .controls .icon > span,
.control-bar .search-filters-button,
.ui-selectMenu-box .icon .arrow { background-color: @pagination_background_color; border-left: 1px solid @container_inner_border_color; }
.options_menu li > a,
.select_menu_list li > a,
.smiley-menu li > a,
.ui-menu-context li > a
{ color: @link_color; }
.options_menu li:hover > a,
.select_menu_list li:hover > a,
.smiley-menu li:hover > a,
.ui-menu-context li:hover > a
{ color: @container_text_color_1; background-image: none; background-color: @container_highlight_color; border-color: @container_inner_border_color; }
.options_menu, .select_menu_list, .smiley-menu, .ui-menu-context,
.options_menu ul, .select_menu_list ul, .smiley-menu ul, .ui-menu-context ul
{ background-color: @container_background_color_1; border-color: @container_outer_border_color }
.options_menu li, .select_menu_list li,
.smiley-menu li, .ui-menu-context li
{ background-image: none; }
.ui-selectMenu-box:hover > .icon > .arrow { background-color: @pagination_background_color; }

[Violette]

That worked perfectly! Thank you so much, both Craig and Brian! You guys are really helpful!