Jump to content

button is a different colour to my sites colour scheme

Go to solution Solved by tuanphan,

Recommended Posts

You can add this to Design > Custom CSS

/* Home store button */
body.homepage .sqs-block-button-element[href="/store"] {
    color: darkgrey;
}

 

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
2 hours ago, tuanphan said:

You can add this to Design > Custom CSS


/* Home store button */
body.homepage .sqs-block-button-element[href="/store"] {
    color: darkgrey;
}

 

this only changed the font colour,  i'd like the button even the frame to be the grey then when you hover it inverts like on the /about page with the delivery and return button. this is the colour code i found in the inspect element

#434446;

Edited by yasminva
Link to comment
30 minutes ago, yasminva said:

this only changed the font colour,  i'd like the button even the frame to be the grey then when you hover it inverts like on the /about page with the delivery and return button. this is the colour code i found in the inspect element

#434446;

so i managed to find this in the inspect element

Quote

.primary-button-style-outline .black .sqs-block-button-element--small, .primary-button-style-outline .black .sqs-block-button-element--medium, .primary-button-style-outline .black .sqs-block-button-element--large, .primary-button-style-outline .black .header-actions .btn {
    color: #434446;
    border-color: #434446;
    background: transparent;
}

and i changed the colours and its worked but im not sure how to make the button invert when you hover over it. id like the button to turn to the grey colour and the font to be white like this:

 

Screen Shot 2021-03-12 at 12.31.43.png

Link to comment
  • Solution
30 minutes ago, yasminva said:

so i managed to find this in the inspect element

and i changed the colours and its worked but im not sure how to make the button invert when you hover over it. id like the button to turn to the grey colour and the font to be white like this:

 

Screen Shot 2021-03-12 at 12.31.43.png

Add this to Design > Custom CSS

/* Home store button */
div#block-fa7828037c3feecb0451 a[href="/store"] {
    color: #434446;
    border-color: #434446;
}
div#block-fa7828037c3feecb0451 a[href="/store"]:hover {
    background: #434446;
    color: white;
}

 

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.