Agency Demo - Help Needed

Support
#1

Hi, we are building a site based on the Agency demo, but have a couple of items we aren’t clear on.

  1. The menu bar has a horizontal divider line above it, and vertical dividers between each nav item. How do we change the colour of these dividers?

  2. The About page in the demo has a 4 image grid about halfway down the page (Design, Strategy, Digital, Marketing) - we want to recreate this look as a single row 3 column layout on the home page, but cannot find the right elements to use - how would we do this? Each of the three columns will have a background image with icon, title and text.

See navbar screenshot below:

Thanks in advance,

David

#2

Hello @dfardon,

Thanks for asking. :slight_smile:

  1. To change menu divider color, please add following CSS under X > Launch > Options > CSS:

.x-navbar .desktop .x-nav>li>a{border-right: 1px solid rgba(255,255,255,0.5;}

.x-logobar{border-bottom: 1px solid rgba(255,255,255,0.5;}

.x-navbar {border-bottom: 2px solid rgba(255,255,255,0.5);}

  1. It’s a two column layout that’s using Cornerstone Clasic Icon, custom headline and Raw content element.

Thanks.

#3

Thank you Prasant,

That’s all good!

Just one thing - when using the Classic Icon element, I am unable to change the icon size via the
“Icon Size & Background Size” field or centre the icon. Is there a way to add icons that would give me more control over the appearance of the icon? How would we add an icon without using the Classic Icon element?

Thanks

David

#4

Hi There,

You can try using the shortcode version instead. Refer to the guide here (http://demo.theme.co/integrity-1/shortcodes/icons/).

Example:
[x_icon style="color:red;font-size:64px" type="adjust"]

Thanks!

#5

That’s exactly what I was looking for, thank you very much!

David

#6

You’re welcome, David.

#7

Hi Jade & Prashant - can I ask where exactly in the CSS window would you post that code? I’m trying to change the divider colour to black (header background is white). I’m a total noob at code/web design.

Many thanks in advance!
Harry

#8

Hi There,

Please refer to the screenshot here (https://snag.gy/7Qkus5.jpg).

Hope that helps.

#9

Hi mldarshana

Thanks for your reply - I can see that CSS section, what I’m not sure about is where to paste the code once that window is open. What line should it go into? Or can I just paste it at the bottom underneath everything else that’s in there?

Many thanks

#10

Hi There,

You can simply paste your code into the bottom underneath existing code.

Hope that helps.

#11

Awesome, thanks for your help. Incidentally I had to add the second ) sign for the first two lines, not sure if that’s meant to happen but it didn’t show up on the header until I added that.

Thanks again!

#12

You’re welcome!

#13

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.