Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
GHG

- Hover images on portfolio page as flat soild colour

Question

Site URL: https://falodu-demo.squarespace.com/work

Hi, I'm quite new to Squarespace and I have a question regarding the hover state on the images of a portfolio page in Squarespace 7.1 .
I'm currently working with this template: https://falodu-demo.squarespace.com/work and I was wondering if the hover state on the portfolio page (in this case work) can be a solid colour instead of the current 'faded' effect. I have looked everywhere on the design section but it seems it might have to be edited in the custom CSS.

Share this post


Link to post

2 answers to this question

Recommended Posts

  • 0
On 7/17/2020 at 9:36 PM, GHG said:

Site URL: https://falodu-demo.squarespace.com/work

Hi, I'm quite new to Squarespace and I have a question regarding the hover state on the images of a portfolio page in Squarespace 7.1 .
I'm currently working with this template: https://falodu-demo.squarespace.com/work and I was wondering if the hover state on the portfolio page (in this case work) can be a solid colour instead of the current 'faded' effect. I have looked everywhere on the design section but it seems it might have to be edited in the custom CSS.

Hi there

You can try inject this into Settings -> Custom Css

.grid-item .grid-image-inner-wrapper {
    position: relative;
}

.grid-item .grid-image-inner-wrapper:after {
    content: "";
    transition: opacity 0.5s;
    opacity: 0;
}

.grid-item:hover .grid-image-inner-wrapper:after {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    content: "";
    background: #4CAF50;
    opacity: 0.7;
}

.no-touch .portfolio-grid-basic .grid-item:hover .grid-image {
    opacity: 1;
}

image.png.31625db84a62d9193edad2a115c9c641.png


I am frontend dev that provide solutions to enhance feature of squarespace.com can't provide, please check my profile for more details

--- To Space And Beyond! ---

https://www.freelancer.com/u/BaNgan

Share this post


Link to post
  • 0

Oh wow, thank you thank you thank you so much, you absolutely solved it for me 🙂
thousands times thank you

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...