Debut Theme: How to remove table borders without removing form field lines?

Highlighted
Tourist
11 0 1

Hello all,

 

So I've notice that in the Debut theme settings (colors), when I set the Borders and lines to none the lines on the form fields disappear as well. What can I do to change the table borders to none without affecting the form field lines?

 

Thanks,

Jay

0 Likes
Highlighted

Hello 

Can you share screenshots for your site issue.
And please share your site url.

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
11 0 1

Hello 

 

 

 

Capture.PNG

With Borders and Lines Off.PNG

0 Likes
Highlighted
Shopify Expert
1381 111 206

please share a store url

1 Like
Highlighted

Hey Jay,

 

Sounds like the some classes  and styles may be linked. It is certainly possible to to split this up so one border change wont affect it.

 

You can setup a checkbox in the schema with color_picker, Add a  liquid control flow statement, and a line or two of style added.

1 Like
Highlighted
Tourist
11 0 1

He LMPTechSolution,

 

Thank you for your response. Unfortunately, my coding knowledge is very basic, and I wouldn't even know where to start with your suggestion. Is it possible that you can share an example of the code?

 

As far as the URL, my site is password protected and I'm a bit hesitant to post the password publicly. So I'll send you a message in case you are interested in viewing it further.

 

 

0 Likes
Highlighted

Hello 

Add this css at the end of:

Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

table#book123 th, td {
    border: none!important;
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
2 Likes
Highlighted
Tourist
6 0 1

Thank you!  I'm not the OP, but your solution was perfect.

 

For those without a lot of coding experience looking for how to do this, follow the directions above!  The only difference I had to make was to go to the "#Tables" section in "Themes.scss.liquid" (for me that started at line 2066) and find the "borders: " under TD and change from 1px to 0px.

 

You can also adjust the cell padding on the line right under that in order to make your table "tighter" or "wider".  Play around with those numbers a bit.  ONLY those numbers...change anything else and I don't promise anything!  

0 Likes
Highlighted
Tourist
3 0 1

@oscprofessional  Thank you! it worked for me too

0 Likes