improve note component

[Deep-Codes]

Currently, Blockquotes are mapped a Custom Note component

refer this :

https://github.com/100mslive/100ms-docs/blob/1f0d794c0111490b5e84b6fb08563253e0837621/components/MDXComponents.tsx#L19

https://github.com/100mslive/100ms-docs/blob/1f0d794c0111490b5e84b6fb08563253e0837621/components/MDXComponents.tsx#L58

Our current Note component looks like this:

Visit https://docs.100ms.live/javascript/v2/features/device-change check it live.

It looks very simple at the moment

Things that can make it better

• add an info icon
• have a background , border (shades of blue / yellow / red)
• more variants ( success , note , error )

Feel free to drop questions if you have

[Deep-Codes]

Things to add:

Note component would have 3 variants (contrast type):

refer this for an idea

• warning
• success (default)
• error

every variant will have 3 colors having the following

• border => lighter of (red , blue , yellow)
• background => transparent lightest of (red , blue , yellow)
• left-border => light of (red , blue , yellow)

Choose colors from Radix Get to know more about choosing the following variants from here

Feel free to ask me

[mohit-cfc]

Will try working on this one

[somesh202]

Can I work on this issue? @Deep-Codes

[Deep-Codes]

Can I work on this issue? @Deep-Codes

Sure go for it. let me know if help needed.