Change button color on my wishlist - Dawn Theme 7.01

[Dekanten]

Hi

I would like to change button and textcolor within my whishlist, i want to change the color into black background instead. How can this me done? If someone possible things to try and inspect within google dev tools and inspect the button and find out which section i can find this. Hope you can help me out here, tried everything without luck. Thanks in advance. 🙂 (The yellow button)

See attached file:

Mystore url:

www.dekanten.no

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @Dekanten 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

.st-product-card .st-atc-button {
 background: black !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[niraj_patel · Accepted solution]

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
 .st-product-card .st-atc-button{
     background-color: #000 !important;
      color: #fed800 !important; /*change color according to you*/
   }
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[niraj_patel · Accepted solution]

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
.st-product-card .st-atc-button{
border-radius: unset !important;
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[BSS-TekLabs]

Where is it on your website? Can you take a screenshot of it on your website? @Dekanten 

[Dekanten]

Hi ofcourse

Just go into a product, add it on wishlist with the green button on top of the product and click the heart icon on header after this have been done. The product will show up like on the previous post. 🙂

Anything else i can bring to you for information, just ask and i will provide. 🙂

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @Dekanten 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

.st-product-card .st-atc-button {
 background: black !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[Dekanten]

Thank u we are into something now, glad this works finally now. 🙂

[BSS-TekLabs]

Glad to help you. Have a good day.

[Dekanten]

You too and have a wonderful day with your ones. 🙂

[BSS-TekLabs]

.st-product-card .st-atc-button {
 border-radius: 0 !important;
}

can you try add more code @Dekanten 

[niraj_patel · Accepted solution]

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
 .st-product-card .st-atc-button{
     background-color: #000 !important;
      color: #fed800 !important; /*change color according to you*/
   }
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[Dekanten]

Thank you very much for your solution, works very well. Is it possible to remove the rounded corner on those buttons? I want to change them into better looking buttons with square corners. 🙂

[niraj_patel · Accepted solution]

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
.st-product-card .st-atc-button{
border-radius: unset !important;
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[Dekanten]

Thank u so much for your solution, this works quite good. Thanks again for your contribution. 🙂

[Dekanten]

Hi again, is it possible to add a hover and a border around the button? 🙂

Hope this will be possible. 🙂

[niraj_patel · Accepted solution]

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
  .st-product-card .st-atc-button{
     border: 2px solid #000; /*change color according to you*/
   }
   button.st-atc-button:hover {
       background: #d38927 !important; /*change color according to you*/
        color: #000 !important; /*change color according to you*/
     }
</style>
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[Dekanten]

Hi again, we are into something here and the hover works well but there is no border. Maybe the buttons is to big perhaps? Hope we can figure something out, youre a miracle man aswell. 🙂