BlueOwlCreative » Topic: Custom codes & Helper Classes

Custom codes & Helper Classes

the Cloud Machine — Sat, 10 Oct 2015 21:25:33 +0000

Hi – I notice that you have quite a number of custom codes on the demo pages – is there any guidance on these?
Custom row 1/1 + 1/1 seems to give 3 sections to a single row?
3 part row with … equal_height_column bgr_bottom_right
Thanks
Mark

Reply To: Custom codes & Helper Classes

BlueOwl — Sun, 11 Oct 2015 09:10:42 +0000

Hi there Mark,

Where is this: “Custom row 1/1 + 1/1 seems to give 3 sections to a single row?” ?
You are correct there’s quite a few helper classes that the theme uses, they are listed and explained here:

http://blueowlcreative.com/docs/fortuna/#customization4

Let me know if you have further questions, I would be happy to help!

Reply To: Custom codes & Helper Classes

visionaerial — Tue, 13 Oct 2015 21:36:35 +0000

It’s on the home page demo, I’m struggling with the same thing. Here’s a screenshot.

In addition to how the “1/1 + 1/1″ yeilds a three column row, what colors are available in replacement of “jade_overlay” for the same section? I don’t see that referenced anywhere.

Reply To: Custom codes & Helper Classes

visionaerial — Tue, 13 Oct 2015 21:59:53 +0000

Update: I figured it out – the trick is under Responsiveness Options in the Column options. It’s a 12 column layout so you’ll set one section to 4 columns (1/3) and the other to 8 columns (2/3) or whatever you want it to be. See the screenshot.

I’d still love an answer on setting the color of this section to something other than “Jade”…

Reply To: Custom codes & Helper Classes

BlueOwl — Wed, 14 Oct 2015 07:26:36 +0000

Hi there!

Good job, you figured out the column, basically you can manage how things display on all screens.
As for the color:

The jade_overlay class is defined in your css file:

.jade_overlay {
    background: rgba(8,173,167,0.8);
}

You can of course create your own in your Child theme and assign it to columns that you want to overlay your Row’s background image in some way. For example:

.my_overlay {
    background: rgba(38,103,207,0.7);
}