Add Background Hover Effect with Text Color Change to Squarespace 7.1 Summary Block

The following plugin adds smooth transition to summary block items on your Squarespace 7.1 site.

Copy Code

/*Summary Hover Effect with Text Color Change*/
.sqs-gallery-design-autogrid .summary-content {
  padding: 10px;
}
.summary-title, .summary-excerpt, .summary-metadata--primary, .summary-metadata--secondary {
  transition: all ease-in-out .3s;
}
.sqs-gallery-design-autogrid .summary-item:hover {
  background-color: #F26923 !important;
  box-shadow: 1px 1px 8px 2px rgba(0,0,0,.2) !important;
  opacity: 1;  
  transition: all ease-in-out .3s;

  .summary-title, .summary-excerpt, .summary-metadata--primary, .summary-metadata--secondary{
    color:#ffffff;
  }
}