MyBB Community Forums

Full Version: Need support for "change theme" upper, colors and more
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hello,
I'd like to change some features in my Forum: https://www.pokemonhacking.it/index.php .

1) I'd like to move the "Change Theme" box from the lower part to the upper part of the main page, precisely in the header menu near the "quick search" box or near the user name. The question is: how to do it?
2) Shoutbox's name is written in black and I'd like to change it in white, but I can't find the command line in the CSS; I also wanted to change the shoutbox's background colour in order to make it different from the #content pattern. Here's the CSS, what do I have to add?

/* DVZ Shoutbox */
#shoutbox { margin-bottom: 10px; border-radius: 2px; border: 1px solid #BFBFBF; }
#shoutbox .head { padding: 4px; background: #802c33 url("images/focus/patternn.png") repeat scroll left top; }
#shoutbox.front .head { cursor: pointer; }
#shoutbox .head .right { float: right; margin: 0 -8px 0 0; font-size: 13px; }
#shoutbox .head .right a { padding: 8px; }
#shoutbox.collapsed .head { opacity: 0.6; }
#shoutbox.collapsed .body { display: none; }
#shoutbox .head a:link {color: #ffffff;}
#shoutbox .panel { padding: 10px 15px; }
#shoutbox input.text { padding: 3px 3px; width: 100%; font-family: Arial, sans-serif; font-size: 12px; color: #000; box-sizing: border-box; border-radius: 3px; border: 1px solid #BBB; background-color: #ebebeb; }
#shoutbox .minposts, #shoutbox .blocked { padding: 6px; font-size: 18px; }
#shoutbox .panel.minposts { color: #727250; background-color: #FFFED8; }
#shoutbox .panel.blocked { color: #543A3A; background-color: #FCEFEF; }
#shoutbox .panel p { margin: 0; }
#shoutbox .window { border-top: solid 2px rgba(240,240,240,0.1); overflow-y: scroll; }
#shoutbox .data { display: table; width: 100%; border-top: solid 2px rgba(0,0,0,0.1); font-family: Arial, sans-serif; font-size: 12px; }
#shoutbox.front .data { border-top: none; }
#shoutbox .entry { display: table-row !important; width: 100%; transition: background-color rgba(240,240,240,0.1); }
#shoutbox .entry:nth-child(even) { background-color: rgba(240,240,240,0.1); }
#shoutbox .entry.new { background-color: rgba(240,240,240,0.1); }
#shoutbox .entry:target { background-color: rgba(240,240,240,0.1); }
#shoutbox .entry > div { border-bottom: dashed 2px rgba(240,240,240,1); }
#shoutbox .entry:last-child > div { border-bottom: none; background-color: rgba(240,240,240,0.1) }
#shoutbox .entry > div { display: table-cell; padding: 1px; }
#shoutbox .avatar { height: 15px; }
#shoutbox .avatar img { margin: 0 auto; vertical-align: middle; max-height: 14px; max-width: 14px; border: solid 1px rgba(255,255,255,1); box-shadow: 0 0 2px rgba(0,0,0,1); cursor: pointer; }
#shoutbox .user { border-right: solid 1px rgba(0,0,0,0); text-align: center; white-space: nowrap; }
#shoutbox .text { width: 100%; color: #383838; word-break: break-all; word-wrap: break-word; }
#shoutbox .info { font-size: 11px; color: #AAA; white-space: nowrap; text-align: right; }
#shoutbox .entry.unread .info:before { display: inline-block; margin-right: 10px; height: 4px; width: 4px; content: ''; background: rgba(255,100,0,0.8); border-radius: 10px; vertical-align: middle; }
#shoutbox .info a { color: inherit; }
#shoutbox .mod { padding: 6px 8px; font-size: 9px; font-weight: bold; color: #AAA; text-decoration: none; }
#shoutbox .mod:nth-of-type(2) { margin-right: 5px; border-left: solid 1px rgba(0,0,0,0.1); }
#shoutbox  .ip { margin-right: 10px; color: #CECECE; }

Thank you for the help and sorry if these questions were asked.
Have a good day and happy new year. Cool