TechyBecky_101 Posted September 20, 2022 Share Posted September 20, 2022 Site URL: https://www.wearefixology.co.uk/ Hello Forum, I'm using a form block with the lightbox/button option - I would also like it to have the same design as my Primary Buttons. Which has a teal (#45A29A) outline and goes yellow (#FDDB27) on hover...? I've made a page as an example - so the REGISTER INTEREST button is a form - top right is my BOOK button that has the yellow hover..... My website: https://www.wearefixology.co.uk/form-with-button-examples Password: ruth Any ideas forum pals? Link to comment
Ziggy Posted September 20, 2022 Share Posted September 20, 2022 Try this: .form-block .lightbox-handle { transition:all ease-in-out 300ms; &:hover { background-color:#fddb27 !important; opacity:1 !important; } } TechyBecky_101 1 Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com Hire me on Upwork! 🔌 Ghost Squarespace Plugins (Referral link) 📈 SEO Space (Referral link) ⬛ SquareWebsites Plugins (Referral link) 🔲 SQSP Themes (Referral link) ✨ Spark Plugin (Referral link) 🖼️ Gallery Lightbox Plugin (Referral link) ☕ Did I help? Buy me a coffee? Link to comment
TechyBecky_101 Posted September 22, 2022 Author Share Posted September 22, 2022 That worked! Thanks so much and for your speedy response 🙂 Ziggy 1 Link to comment
TechyBecky_101 Posted September 26, 2022 Author Share Posted September 26, 2022 Hi there - me again. I use the inbuilt buttons in the simple list layout too - at the very bottom of this page - possible to have a hover on those too? Yellow - #fddb27 https://www.wearefixology.co.uk/classes-and-talks password: ruth Link to comment
tuanphan Posted September 27, 2022 Share Posted September 27, 2022 18 hours ago, TechyBecky_101 said: Hi there - me again. I use the inbuilt buttons in the simple list layout too - at the very bottom of this page - possible to have a hover on those too? Yellow - #fddb27 https://www.wearefixology.co.uk/classes-and-talks password: ruth Use this code a.list-item-content__button:hover { background-color: #fddb27 !important; transition: all ease-in-out 300ms; } TechyBecky_101 1 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
TechyBecky_101 Posted September 27, 2022 Author Share Posted September 27, 2022 Thanks so much again!! Link to comment
TechyBecky_101 Posted September 27, 2022 Author Share Posted September 27, 2022 Oh hello! And please could you help with some code for a yellow hover on these pages? https://www.wearefixology.co.uk/register-your-interest https://www.wearefixology.co.uk/contact Password: ruth Yellow - #fddb27 Link to comment
Solution tuanphan Posted September 28, 2022 Solution Share Posted September 28, 2022 20 hours ago, TechyBecky_101 said: Oh hello! And please could you help with some code for a yellow hover on these pages? https://www.wearefixology.co.uk/register-your-interest https://www.wearefixology.co.uk/contact Password: ruth Yellow - #fddb27 Use this input.button.sqs-system-button.sqs-editable-button.sqs-button-element--primary:hover { background-color: #fddb27 !important; transition: all ease-in-out 300ms; } TechyBecky_101 1 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
TechyBecky_101 Posted September 28, 2022 Author Share Posted September 28, 2022 53 minutes ago, tuanphan said: input.button.sqs-system-button.sqs-editable-button.sqs-button-element--primary:hover { background-color: #fddb27 !important; transition: all ease-in-out 300ms; } LEGEND!! x tuanphan 1 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