Jump to content

Calendar Customisations - Brine 7.0

Recommended Posts

Site URL: https://frog-cornet-e4zp.squarespace.com/

I've set up a calendar for a client connected to a blog. I only want users to view the excerpt in the flyout and not be able to click through to the blog itself. I have managed to disable link on the fly out using the code below. 

 .flyoutitem a {
    pointer-events: none !important;
  .flyoutitem-link-arrow {
      display: none;  }}

However, I can't use the below code as it overrides the greyscale filter I've applied to the calendar thumbnails (the colour appears on hover). Is there anyway to stop people click through to the blog posts while still keeping the hover function

.yui3-squarespacecalendar .background a {
    pointer-events: none;}

 

Greyscale filter code for reference:


.yui3-squarespacecalendar .background-image {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  &:hover, &:focus {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
  }
}

Yhank you so much in advance for your help.

Best,
V

Link to comment
  • Replies 1
  • Views 421
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

On 9/16/2021 at 10:06 PM, No55 said:

Site URL: https://frog-cornet-e4zp.squarespace.com/

I've set up a calendar for a client connected to a blog. I only want users to view the excerpt in the flyout and not be able to click through to the blog itself. I have managed to disable link on the fly out using the code below. 

 .flyoutitem a {
    pointer-events: none !important;
  .flyoutitem-link-arrow {
      display: none;  }}

However, I can't use the below code as it overrides the greyscale filter I've applied to the calendar thumbnails (the colour appears on hover). Is there anyway to stop people click through to the blog posts while still keeping the hover function

.yui3-squarespacecalendar .background a {
    pointer-events: none;}

 

Greyscale filter code for reference:


.yui3-squarespacecalendar .background-image {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  &:hover, &:focus {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
  }
}

Yhank you so much in advance for your help.

Best,
V

Hi,

Your site is private. Can you setup password & share url?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.