playfulprogramming / playfulprogramming

🦄 Practice programming with magically majestic methods
https://playfulprogramming.com
Mozilla Public License 2.0
146 stars 72 forks source link

[Feature Request]: Dont-try-this-at-home codeblocks #1033

Open davidveen opened 8 months ago

davidveen commented 8 months ago

Description

Codeblocks containing pseudocode, conscious errors, or other don't-try-this-at-home ideas are a great teaching tool, but might benefit from a visual indication aside from (con)textual hints. It should be clear enough so that a reader scrolling through code examples doesn't end up copying non-working code or patterns marked as 'bad'.

Describe the solution you'd like

A warning triangle in the corner or a different border would go a long way. Here be dragons! 🐉

Describe alternatives you've considered

No response

crutchcorn commented 8 months ago

Assigning @PrattiDev as he's our design lead for the site, which is where this would start (Ed, no priority on this; just wanna get your thoughts on this whenever you get time)

PrattiDev commented 2 months ago

@crutchcorn I will begin to check GitHub more often — this is the first time I'm seeing this! Seems easy to do. 👍

PrattiDev commented 2 months ago

image

Does this work for you @davidveen @crutchcorn ? Thankfully the system already has tokens for error states for everything under the sun so it was a matter of switching tokens. It also reuses the tooltip component we built for outgoing links.