I’m wondering if anyone can figure out the css I need for something.
I have a Foundry site with a modal navigation. I generally like how it looks but the close button is tucked away in the top right and not super noticeable.
I tried to get it sorted via Blacksmith but couldnt quite get it to work and I’m not figuring out which selector I should be using to do it via the CSS window. I’d like it a little further away from the corner and a bit bigger.
The site is here: https://pops.jbostick.ca (password demo). If you click the orange menu icon, you’ll see it
That’s sort of how I have it now. Menu button is in a pin stack, and I’m good with how it looks.
It is the ‘X’ to close the modal that I can’t figure out (and that is controlled by the Modal stack). The padding options in the screenshot below don’t impact it, btw
It’s the ‘.btn-close’ selector, which determines the appearance of the ‘close’ button in the modal.
I could change in the browser e.g. the width & height & font-size properties to make the ‘x’ much more pronounced. Since the properties are already defined in a CSS file, you might have to add an ‘!important’ to your CSS definition, if it doesn’t overwrite the original definition.