Insufficient padding in code block component on /templates page

[unrenamed]

Preliminary Checks

• I have reviewed the documentation: https://unkey.com/docs

• I have searched for existing issues: https://github.com/unkeyed/unkey/issues

• This issue is not a question, general help request, or anything other than a bug report directly related to Unkey. Please ask questions in our Discord community: https://unkey.com/discord.

Reproduction / Replay Link (Optional)

No response

Issue Summary

The code block component currently lacks adequate padding, making the displayed code appear cramped and suggesting that it continues beyond the right edge of the container. This design issue hampers readability and can confuse users, especially with longer code snippets.

Steps to Reproduce

1. Visit https://www.unkey.com/templates/rust-rocket
2. Scroll down to the steps with code blocks containing large code snippets

Expected behavior

To improve user experience, increasing the padding around the code block is necessary. Enhanced spacing will provide better visual separation, making it easier for users to engage with and understand the content.

Other information

No response

Screenshots

Version info

- OS:
- Node:
- npm:

[linear]

ENG-1411 Insufficient padding in code block component on `/templates` page

[ashokasec]

/assign

[Anurag-singh-thakur]

/assign

[perkinsjr]

/award 150

[oss-gg]

Awarding unrenamed: 150 points 🕹️ Well done! Check out your new contribution on oss.gg/unrenamed

[perkinsjr]

I believe this issue is specific to the layout itself and not the code block as the codeblock is reused in multiple places. for anyone who picks this up

[prakashsp23]

/assign

[oss-gg]

Assigned to @prakashsp23! Please open a draft PR linking this issue within 48h ⚠️ If we can't detect a PR from you linking this issue in 48h, you'll be unassigned automatically 🕹️ Excited to have you ship this 🚀

[sdshaheer]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[Rayyos]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[VenkateshSircilla123]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[ashokasec]

@unrenamed fixed the padding issue, can you just check it once? PR-2312

[devXpraAddy]

/assign

[oss-gg]

Assigned to @devXpraAddy! Please open a draft PR linking this issue within 48h ⚠️ If we can't detect a PR from you linking this issue in 48h, you'll be unassigned automatically 🕹️ Excited to have you ship this 🚀

[mrjayantbokade]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[zubairahmed22]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[shindebhavika]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[abhicodes01]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[xRiddin]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[Sa1-Codes]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[OptimisticTech-Amber]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.

[Manik445]

/assign

[oss-gg]

This issue is already assigned to another person. Please find more issues here.