Make Mega Modal button a ghost button?

Hi, does anyone know if its possible, praps with a bit of CSS, to make a Mega Modal button a Ghost (outline) button. Unless I’m missing something, I can’t see this option in the stack settings. Both the Modal button and Sideslide buttons have this option.

@elixirgraphics is this worth a feature request?

Hi, there should be a setting, in the demo there’s an example with outline button.

1 Like

One option is to set the button to the secondary style, then use custom css to style it.

I have a tip about this in the Template Repo knowledge base.


@James249 Sure you can do it out of the box. See screenshot below. My secondary option does it (based on how I set up Foundry basic settings) but there’s also a custom option. Use settings under Button Trigger.

1 Like

yep, I think this is when setting button to secondary styles. I’m not sure how to then change the colours of secondary.

Hi @mitchellm - i can get it to outline the button setting to Secondary - but do you know how i change the Secondary colour settings? I cant find it in the Foundry Control panel

Just to clarify the image below is what i’m trying to do.
The first ‘Read more’ button is the ‘Modal button’ set to Primary and Outline - which is what i’m trying to get with the Mega Modal Button.

The second ‘Read more’ button is the Mega Modal button - currently set to Primary - no outline option available. If i set it to Secondary as suggested above i get a button with black text and grey outline. If i set the Mega modal button to custom, there isn’t an option for an outline button. Trying to get a Ghost button with a red outline - which is also a Mega Modal.
Hopefully this image will clarify:

Mega Modal does not have an outline feature.

Foundry v2 does not have a control for customizing the Secondary preset. It is a constant preset throughout the suite of stack on purpose.

Go visit this thread and there’s information of filing a request:

1 Like

.btn { border-color: red; }

  • the above may make all buttons on your page have that style
1 Like

ok, thanks Adam for clarifying

Boom! :grin: That works - if i also set the button to ‘custom’, - text red and transparent background, with that CSS it then gives me the red outline i’m looking for. I set the CSS red to the right hex code and it fits with the rest of the page. I cant get the button to change red when rolled over, but i think i can live with that.
Thanks a lot @stackJunkie

1 Like

Don’t forget —


I’ve just submitted it Adam