Update numbered list styling

[npentrel]

No description provided.

[netlify]

✅ Deploy Preview for viam-docs ready!

Name	Link
🔨 Latest commit	66b1fa5
🔍 Latest deploy log	https://app.netlify.com/sites/viam-docs/deploys/67b63d816fb1750009f2494b
😎 Deploy Preview	https://deploy-preview-4013--viam-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 39 (🔴 down 4 from production) Accessibility: 100 (no change from production) Best Practices: 100 (no change from production) SEO: 92 (no change from production) PWA: 70 (no change from production) View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[JessamyT]

Hmm it's splitting to the next line in places like https://deploy-preview-4013--viam-docs.netlify.app/operate/get-started/other-hardware/#write-your-module and https://deploy-preview-4013--viam-docs.netlify.app/operate/get-started/other-hardware/manage-modules/:

I think the squares look very similar to our buttons (like Ask AI) and other boxes like command prompt examples. I know we're a box shop not a circles shop but I think circles would be clearer. Maybe Cristina can help make these different somehow. We do have some rounded elements like below and like the machine online indicator in the app.

[npentrel]

I think possibly all fixed now but will want to check a bit more thoroughly

[JessamyT]

I think this looks nice but just realized the counter reset (or counter increment?) change is causing this:

Note that this number restarting isn't happening in prod because this particular line has "5" on it in the markdown.

[npentrel]

It's the custom number styling that's causing this - only fix is to use raw markdown or javascript. However, I think the content is the issue here because it closes the ordered list and starts a new one which isn't really semantically correct. If there's such complex content for a list item that it breaks the list rendering maybe that's where we draw the line and make it a tablestep where we can have more control over the rendering

[JessamyT]

It's the custom number styling that's causing this - only fix is to use raw markdown or javascript. However, I think the content is the issue here because it closes the ordered list and starts a new one which isn't really semantically correct. If there's such complex content for a list item that it breaks the list rendering maybe that's where we draw the line and make it a tablestep where we can have more control over the rendering

Hmm we frequently have expanders within steps though--this step isn't extra-complex except that it is all within a tab. If the expander could be indented, that would fix the numbering problem, but we can't indent an expander within a tab without the expander formatting breaking. So, the numbering problem would be fixed if we could fix the indented-expander-inside-a-tab issue.

[JessamyT]

Nice ty for fixing. White space below the number seems to have been reduced though: