Invisible Bullet Points and No Indentation (SCSS Debutify Theme)

Store Design
1

We are running the debut template on SCSS with the file theme.scss.liquid, and I want bullet points in the product descriptions to list features etc. When I use bullet points in the product description they format well in Shopify but on the website they disappear once the page is fully loaded. Not only that but the numbered bullets don’t work neither does the indentation. So I am using the code below which adds the indentation for the bullets but still, the bullet points are invisible.

I am using the code:

#collapseOne ol, ul {
margin: 18px;
padding: 0;
}

which does give the indentation but the bullets are still not visible. I have searched every question and tried many lines but they have not worked.

An example page of a product that I want bullet points for is:

https://shop.autofxwa.com.au/collections/optix-nano-technologies/products/optix-apc-heavy-duty-all-p…

AutoFXWA_0-1638855733621.png
AutoFXWA_0-1638855733621.png356×400 75.4 KB

I really need these bullet points to make my product descriptions look flash.

@KetanKumar @PageFly-Victor @dmwwebartisan @Zworthkey @PaulNewton

1 Like
2

@AutoFXWA

Happy to help you:

  1. Go to your code editor > Assets > theme.scss.css and search for

/================ Lists ================/ and you will see something like

‘li {
list-style: none; }’

change none to any other list type >>

https://www.w3schools.com/cssref/pr_list-style-type.asp

If helpful then please Like and Accept Solution. Want to modify or custom changes on store Hire me. Feel free to contact me on shopify.dev.34@gmail.com | Shopify Design Changes | Custom Modifications In to Shopify Theme

3

@AutoFXWA

try this code

.smart-tabs-content-wrapper li {
    list-style: initial;
}
4

Hiya, I pasted that code at the bottom of my description and it worked, the bullet points are now visible. However I am not getting indentation on the bullet points like the product description editor shows. On the site, they just align left like regular texts.

Here is an example: https://shop.autofxwa.com.au/collections/optix-nano-technologies/products/optix-apc-heavy-duty-all-purpose-cleaner

Another example: https://shop.autofxwa.com.au/products/chemical-guys-spi_663_16-innerclean-interior-quick-detailer-protectant-16-oz?_pos=2&_sid=7c44a2c53&_ss=r

For this product, the How To Use It: section is supposed to be a numbered list, not only are they dot points but they are further aligned left than the real bullet points.

@KetanKumar

Cheers,

Des

5

Are you able to assist me further?

@KetanKumar