Osman01 Posted February 23 Share Posted February 23 Hi, I'd like to fine tune one of my pages (Independent Study). On my cover page I have this transparent background with white text, like the image below. I would like to carry this over to my "Independent Study" page. I don't seem to find any editing option in site styles to help me enable this. At the moment this is how it looks like. I have the issue of not seeing the text clearly when hovering over the text. I used a portfolio section with Hover : Background layout. Any help would be great. I don't mind if the text has individual transparent backgrounds. Web: osman-b-zaman.squarespace.com Pass : PASS700 Kind Regards Link to comment
Solution Beyondspace Posted February 23 Solution Share Posted February 23 (edited) 23 hours ago, Osman01 said: Hi, I'd like to fine tune one of my pages (Independent Study). On my cover page I have this transparent background with white text, like the image below. I would like to carry this over to my "Independent Study" page. I don't seem to find any editing option in site styles to help me enable this. At the moment this is how it looks like. I have the issue of not seeing the text clearly when hovering over the text. I used a portfolio section with Hover : Background layout. Any help would be great. I don't mind if the text has individual transparent backgrounds. Web: osman-b-zaman.squarespace.com Pass : PASS700 Kind Regards You can try adding to Home > Design > Custom Css .portfolio-hover-items-list { background-color: var(--tweak-text-block-background-color); border-radius: 5px; } .portfolio-hover[data-variant-hover-cover] .portfolio-hover-item-title { color: #fff; } .portfolio-hover-items { z-index: 9; } Support me by pressing 👍 or marking as solution if this useful for you Edited February 24 by Beyondspace Osman01 1 Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
Beyondspace Posted February 23 Share Posted February 23 My testing Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
Osman01 Posted February 24 Author Share Posted February 24 (edited) Yep, it works!. To finish off, do you know if there is a way to slightly round off the corners?. I have it on 5 on the cover page. Edited February 24 by Osman01 Link to comment
Beyondspace Posted February 24 Share Posted February 24 You can try the new code that I have updated on the previous answer Osman01 1 Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
Osman01 Posted February 24 Author Share Posted February 24 Thanks a lot!. Happy days. Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment