News:

Want to get involved in developing SMF, then why not lend a hand on our github!

Main Menu

Can't find where to change the forum bkgd colour (see image)

Started by Beowulf1976, June 23, 2017, 09:31:29 AM

Previous topic - Next topic

Beowulf1976

I have attached the image showing the part of the background that I wish to change. Because our "background background" is black, the white "background" of the forum is a stark contrast, and some people have problems with vision so it affects them, ruining the rest of the forum.


I have checked various posts on here and as far as I can see, in curve it is not a repeating image that provides this colour, but without going through every single #fff and #ffffff and changing them, and ending up in a right mess, I cannot work out what I need to change.


I have tried inspecting the area and nothing comes up when I press on any of the white areas in the image, so I have come to ask you wonderful people *grovel grovel* :D how I change the white to something less... white..


I was thinking of changing it to #e9eef2 but again, I cannot see where I would need to do that.

I am not asking people to fix it for me, I am just asking for help to be told where to look, which code to change etc.
"Them as can do has to do for them as can't. And someone has to speak up for them as has no voices."

The Domain Shop

Hi,

The header is mainly created with an image which can be found in your theme folder

/forum/Themes/default/images/theme/main_block.png

EDIT

The css can be found in the index.css for the header

Find

#header {
    background: url(../images/theme/main_block.png) #fefefe no-repeat 0 -480px;
    padding-left: 20px;
}


Find

#header div.frame {
    background: url(../images/theme/main_block.png) no-repeat 100% -480px;
    display: block;
    padding: 5px 20px 1em 0;
}


The content section is created with the frame_repeat.png

/forum/Themes/default/images/theme/frame_repeat.png

The css can be located in the themes index.css

Find
#content_section {
    background: #edf1f6 url(../images/theme/frame_repeat.png) repeat-y top left;
    padding-left: 20px;
}


Find

#content_section div.frame {
    background: url(../images/theme/frame_repeat.png) repeat-y top right;
    display: block;
    padding: 0 20px 0 0;
}





Beowulf1976

THANK YOU :) That was super quick too! :D


Will go try, then mark as solved if I manage to sort it :D
"Them as can do has to do for them as can't. And someone has to speak up for them as has no voices."

The Domain Shop

I have edited it to include the css needed for each of the sections.

Hope that helps ;)

Beowulf1976

"Them as can do has to do for them as can't. And someone has to speak up for them as has no voices."


Beowulf1976

Quote from: NameMySite on June 23, 2017, 12:05:07 PM
Happy to help my friend :)


I must be being super thick


I need to change as in this image:


I tried editing the bits you said and it only changed the header area, not the complete white bit.


As I'm super thick can you do a "find" and "replace" line for me so I know exactly which line in the css to find and exactly what I'm typing?"


Every code you quoted I tried putting in the background colour but as you can see by the image I've just screenshotted - it does not change the background where I wish for it to be changed

This is the default curve theme I am using
"Them as can do has to do for them as can't. And someone has to speak up for them as has no voices."

The Domain Shop

Hi,

Just adding a background colour to the css won't change a thing unless you remove the code for the image.

For instance,

Finding

#header {
    background: url(../images/theme/main_block.png) #fefefe no-repeat 0 -480px;
    padding-left: 20px;
}


You would need to change it to

#header {
    background: #dcd7e0;
    padding-left: 20px;
}


Go through the code i gave you in my first reply and make the necessary changes to each section.

Beowulf1976

Unless I'm stupid you've told me where to find a lot of things, but not what to do when I get there?


(Ie there's no Find / Replace or / add after or anything like that, just a list of finds?
"Them as can do has to do for them as can't. And someone has to speak up for them as has no voices."

The Domain Shop

I have given you clear idea of what to find in the first response, including the last post that gives you an example of how you need to make the changes, which shows you what you need to do.  :)

I cannot tell you exactly what to do as i have no idea exactly what you plan on doing the forum other than "wanting to change " the bits circled in the image.

The Domain Shop

You need to find each of the sections here which are located in the themes index.css

Where the background: is you need to remove "url(../images/theme/main_block.png)" and change it to a color code if you do not plan on using the images and recolouring them.

For example

Find

#header {
    background: url(../images/theme/main_block.png) #fefefe no-repeat 0 -480px;
    padding-left: 20px;
}


Replace with

#header {
    background: #fefefe;
    padding-left: 20px;
}


Change the color #fefefe to what you want it to be. Do the same with each of the sections i posted earlier.


Quote from: NameMySite on June 23, 2017, 09:48:30 AM
Hi,

The header is mainly created with an image which can be found in your theme folder

/forum/Themes/default/images/theme/main_block.png

EDIT

The css can be found in the index.css for the header

Find

#header {
    background: url(../images/theme/main_block.png) #fefefe no-repeat 0 -480px;
    padding-left: 20px;
}


Find

#header div.frame {
    background: url(../images/theme/main_block.png) no-repeat 100% -480px;
    display: block;
    padding: 5px 20px 1em 0;
}


The content section is created with the frame_repeat.png

/forum/Themes/default/images/theme/frame_repeat.png

The css can be located in the themes index.css

Find
#content_section {
    background: #edf1f6 url(../images/theme/frame_repeat.png) repeat-y top left;
    padding-left: 20px;
}


Find

#content_section div.frame {
    background: url(../images/theme/frame_repeat.png) repeat-y top right;
    display: block;
    padding: 0 20px 0 0;
}


Beowulf1976

"Them as can do has to do for them as can't. And someone has to speak up for them as has no voices."

Advertisement: