FROM CACHE - en_header

Removing product image border in Dawn theme

Solved
vapormercury
Tourist
6 0 0

Removing product image border in Dawn themeScreen Shot 2021-10-05 at 01.51.21.png

As you can see that the image have a side border with gray accent, how to remove it?

 

Thanks

Accepted Solution (1)

Accepted Solutions
JHKCreate
Shopify Partner
3467 624 879

This is an accepted solution.

Hi @vapormercury 

Have you got an app that disables right-clicking? If yes this needs to be turned off so we can access the code and check this.

Cheers!

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com

View solution in original post

Replies 20 (20)
JHKCreate
Shopify Partner
3467 624 879

Hi @vapormercury 

Would you mind sharing your store's URL so we can provide the code for that? Thanks!

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com
Denishamakwana
Astronaut
1003 135 167

welcome to shopify community.

please share your store URL and if your store is password protected then please give password too.

Thank you .

If helpful then please Like and Accept Solution. Want to modify or custom changes on store Hire me. Feel free to contact me on denishabhensdadiya@gmail.com | Shopify Design Changes | Custom Modifications In to Shopify Theme
vapormercury
Tourist
6 0 0
JHKCreate
Shopify Partner
3467 624 879

This is an accepted solution.

Hi @vapormercury 

Have you got an app that disables right-clicking? If yes this needs to be turned off so we can access the code and check this.

Cheers!

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com
vapormercury
Tourist
6 0 0

Yes, I've disabled it. 

Thank you

vapormercury
Tourist
6 0 0

Nevermind found it on the theme page. thanks!

FrogtownSupply
New Member
1 0 0

Can you please advise on where you found it? I've been able to turn off image borders on colleciton pages but can't seem to find it on the product page. 

vapormercury
Tourist
6 0 0

Same, just seen it on product page. can anyone help us out?

 

Thanks

iconicmoments
New Member
1 0 0

Hi there,

Can you please share how you did this?

Would love some help here please!

JHKCreate
Shopify Partner
3467 624 879

Hi @vapormercury & @iconicmoments 

Add the following code to your component-card.css file:

.card.card--product.card--outline {
    border: none;
}

Should that help answer your query, we always appreciate liking & marking an as answer to let the community find quality solutions faster. Thanks!

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com
aiteallco
New Member
4 0 0

Howdy - I cannot seem to get this code to work I'm afraid! The border still remains - can you please provide any further guidance? 

Zworthkey
Shopify Partner
5581 642 1507

@aiteallco 
Kindly share  your store URL and store password so,
I can solve it perfectly.
Thank You.

aiteallco
New Member
4 0 0

Thanks - aiteall.com.au and ahtroh

Zworthkey
Shopify Partner
5581 642 1507

@aiteallco 
Can you give me a screenshot so,
I can understand which image border you want to remove.
Thank You.

aiteallco
New Member
4 0 0

Hi - any luck with a potential solution on this front?

BaileyPaserk
Shopify Partner
49 4 6

That code seems to be accessing the theme colors, which I found a way to cancel it out. 

 

You can probably call that product image a different way but this still worked for me on dawn. I added it to the section-main-product.css

 

.product .grid__item {
--color-foreground: none!important;
}

 

MyLUCA
Excursionist
18 0 4

Any other way to do it?

@BaileyPaserk solution actually works, yet it also eliminates the border of my drop down menues.

AT17
New Member
1 0 3

Go to Customize Theme -> Theme Settings -> Media -> Border from 1px to 0px Thickness

Ox6d
Tourist
8 0 4

@BaileyPaserk  this solution works perfectly! thanks a lot 🙂 !