fbpx
Welcome, Guest
Username: Password: Remember me

TOPIC: How to change the background color of : Section 17

How to change the background color of : Section 17 2 years 2 months ago #14908

Hi there,

I am smoothing out our template.
I combine position 18 with position 17 as in your JP-Seatle DEMO
The background I changed to Yellow


I added to module position 17 a blank custom content , THe position only then shows. The position 17 is Blue



I looked in section 13,17 and 18



Looked at all the edit of 17 positions (i think 3 of them) none of them had any background color selected.

How to change the background color of position 17?
Last Edit: 2 years 2 months ago by zwerver2068.
The administrator has disabled public write access.

How to change the background color of : Section 17 2 years 2 months ago #14911

  • Arvind
  • Arvind's Avatar
  • Offline
  • Moderator
  • Posts: 157
  • Thank you received: 20
  • Karma: 4
Hello,

It's the bootstrap class that is applying the background color here on this section. Please see this screenshot for your reference.
Just remove this class from there and it'd remove the background color also.

Thanks,
Arvind
Thank You,
If you like our support and products, tweet us at joomdev and let the world know about it.
The administrator has disabled public write access.

How to change the background color of : Section 17 2 years 2 months ago #14923

I think I get it, but I do not want to remove it.
I like to change it to rgb(255, 213, 0) = #FFD500

Can I do that directly in the custom class : bg-primary text-white pt-5 pt-lg-6 pb-10

How to change?
The administrator has disabled public write access.

How to change the background color of : Section 17 2 years 2 months ago #14929

  • Arvind
  • Arvind's Avatar
  • Offline
  • Moderator
  • Posts: 157
  • Thank you received: 20
  • Karma: 4
Hello,

For styling, you can only use valid bootstrap classes there. Otherwise, anything else you want you'll have to do it through CSS.

Thanks,
Arvind
Thank You,
If you like our support and products, tweet us at joomdev and let the world know about it.
The administrator has disabled public write access.

How to change the background color of : Section 17 2 years 2 months ago #14938

Arvind, thank you for the hint. It took me a while where to change this.

For other people to find:
I found it at the _bootstrap_variables.scss file in the directory of .../templates/tpl_jdseattle/scss/seattle

HOWEVER: I assume this will overwrite with a update of the template. Is it not better to do the styling in the custom.scss file?
I have been looking at this for hours, i did not find/understand it.

How to overwrite the color yellow from the custom.scss?
The administrator has disabled public write access.

How to change the background color of : Section 17 2 years 2 months ago #14939

  • Arvind
  • Arvind's Avatar
  • Offline
  • Moderator
  • Posts: 157
  • Thank you received: 20
  • Karma: 4
Hello,

Don't change anything in the bootstrap folder. There will be a variable file inside the SCSS folder. You can change your options there. Please follow this path to find the variable file.

Path: root\templates\tpl_jdseattle\scss\seattle.

But this will get overwritten with the update, so remember to take a backup of your variables files and the CSS you write, you must write in custom.css file.

If you haven't created any custom.css file yet then you can create one at the following path.

Path:
root\templates\tpl_jdseattle\css

Then, write your custom CSS in that file and please remember to take a backup of that file also before updating your template.

Thanks,
Arvind
Thank You,
If you like our support and products, tweet us at joomdev and let the world know about it.
Last Edit: 2 years 2 months ago by Arvind.
The administrator has disabled public write access.
Moderators: chandandeep
Time to create page: 0.383 seconds