Support

Home Forums Event Espresso Premium Grid View submit button color and opacity

Grid View submit button color and opacity

Posted: February 16, 2021 at 6:13 pm


wingsforwidows

February 16, 2021 at 6:13 pm

I have set up a Grid view. I have embedded the text into the image, using CSS:

.ee_grid_box_v2 .ee_overlay {
top: 0;
}

I would like to change the color of the submit link “Register Now”. I would also like to change the opacity of the featured image and make it lighter.

Please see original post: https://eventespresso.com/topic/grid-view-submit-button-color-and-opacity/


Tony

  • Support Staff

February 17, 2021 at 6:06 am

Hi there,

Can you link me to the page in question so I can take a look?

I can give you generic CSS for the above but if something in your theme can override that so it’s best to view the page itself.

The featured image doesn’t have an opacity set on it by default? The overlay does and with the above, I assume that is making the feature image appear darker but I can check this on the page itself.

Which colour do you want the text?


wingsforwidows

February 17, 2021 at 8:25 am

Here is the page:

https://wingsforwidows.org/event-espresso-grid-test/

I wanted to test the colors to see which one would look best, as the default blue is hard to read. that is why I wanted to be able to play with the opacity and/org Register Now color.


Tony

  • Support Staff

February 17, 2021 at 8:40 am

Thank you.

So to lighten the feature image you need to change the alpha channel set on the backgrounof the overlay, which you can do with something like background: rgba(0,0,0,0.2); and you can add that to your rule above:

.ee_grid_box_v2 .ee_overlay {
    top: 0;
    background: rgba(0,0,0,0.2);
}

Change the 0.2 value to find something your happy with (the default is .5)

The link colour is from your theme but you can override that with something like:

.ee_grid_box_v2 .event-link a {
    color: red;
}
.ee_grid_box_v2 .event-link a:hover {
    color: yellow;
}

I’ve chosen bright, ‘in your face colours’ just to highlight it working, you can set whatever value you prefer in the above.


wingsforwidows

February 17, 2021 at 1:37 pm

This will work great. I will play around a little with eh background and link colors.

Thank you


Tony

  • Support Staff

February 17, 2021 at 3:32 pm

You’re most welcome.

Any further questions just let us know.

The support post ‘Grid View submit button color and opacity’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Event Espresso