Show code examples on usage site

[seveibar]

Currently we build to a usage site here: https://tscircuit.github.io/jscad-fiber

But there is no way to see the code for each example. Let's create a way to see the code for each example. This will help people learn to use jscad-fiber better.

/bounty $40

[algora-pbc]

💎 $40 bounty • tscircuit

Steps to solve:

1. Start working: Comment /attempt #89 with your implementation plan
2. Submit work: Create a pull request including /claim #89 in the PR body to claim the bounty
3. Receive payment: 100% of the bounty is received 2-5 days post-reward. Make sure you are eligible for payouts

Thank you for contributing to tscircuit/jscad-fiber!

Add a bounty • Share on socials

Attempt	Started (GMT+0)	Solution
🟢 @DevGajjar28		#90
🟢 @anas-sarkez		#91

[DhairyaMajmudar]

@seveibar How's about adding a code button here in the side menu

and then rendering code snippets below side panel ?

For displaying code snippets we can use https://highlightjs.org

Would like to get your inputs here and assigned the issue to me : )

[seveibar]

Yea thatd be amazing!

Fwiw: I think @anas-sarkez might have picked this one up, he showed me some mockups. Im not sure how far he is.

[AnasSarkiz]

@DhairyaMajmudar go ahead with that

[DevGajjar28]

hey @seveibar I had a try and make this

[DevGajjar28]

hey @seveibar I had a try and make this

To be honest, I’ve been working on it since yesterday. I haven’t commented yet because I wasn’t sure, but I gave it a try and finally got it done!

[seveibar]

@anas-sarkez can you post your screenshot? It was pretty good- i think it was definitely an acceptable aesthetic

[seveibar]

@DevGajjar28 looks ok but yea syntax highlighting and more of an overlay or integrated into cosmos is better.

As far as who gets it im just going to merge PRs and do reviews like i normally would, for frequent contributors i do assignments but this repo doesnt have many freqent contributors

[AnasSarkiz]

[DevGajjar28]

Hey @seveibar, I have completed the task and am raising my PR. Please review it!
Preview:
https://github.com/user-attachments/assets/882150b1-15ef-498f-aaee-0d76af81c935

[algora-pbc]

💡 @DevGajjar28 submitted a pull request that claims the bounty. You can visit your bounty board to reward.

[algora-pbc]

💡 @anas-sarkez submitted a pull request that claims the bounty. You can visit your bounty board to reward.

[algora-pbc]

🎉🎈 @anas-sarkez has been awarded $40! 🎈🎊

• Share on socials
• Give feedback