OverviewThis theme component allows you to select a flavor for which markdown style you want outputted when making posts. Each markdown ‘flavor’ is inspired by a format of markdown commonly used on the web.
Why might you want thisThis can be installed purely for stylistic purposes or to solve issues such as mentioned here.
Examples
Quick LinksInstall Theme Component
Hi, thank you for this component!
Just tested it in Windows 11 with dark theme. Discourse with default light theme.
Everything works as described but:
GitHub:
Gitlab:
Hey @Ivan_Rapekas,
Thanks for letting me know about this issue. I had some custom color variables that auto change based on the user’s system dark/light mode preference. However, if you don’t have the auto-dark mode switching on your Discourse, this issue occurs. Especially if you have a Light theme on Discourse but your system is set to Dark mode.
As a quick fix for this, I’ve added a setting that toggles the auto dark theme switching. If you uncheck this in your theme settings this issue should be resolved for you.
Hi @keegan !
Thank you for the reply and quick fix! This helped me.
Unfortunately, I have to notice that at all this component changes the font:
a) component disabled:
b) component enabled:
Also it changes <kbd> </kbd> in a table cell (the scale is the same):
a) original:
b) with component:
This is just a notice, no need to fix it, I think 
.
@Ivan_Rapekas Yeah that’s correct. I tried to imitate the font choices used in markdown by each respective flavor (i.e GitHub.com’s markdown font is used when you select GitHub flavor)
Aah, understood. Really, fonts are similar to Gitlab/GitHub. Thanks for explanation! Brilliant idea, this is more than expected from “just a theme component” 
Finally I applied original code block formatting over Gitlab layout 
(works on default theme):
/admin/customize/themes/1/common/scss/edit
Get the code 
Documentation
// Original <kbd> over Gitlab theme component
.cooked kbd {
align-items: center;
border: 1px solid var(--primary-low-mid);
background: var(--primary-very-low);
border-bottom-width: 2px;
border-radius: 3px;
box-sizing: border-box;
color: var(--primary);
display: inline-flex;
font-size: var(--font-down-1);
justify-content: center;
line-height: var(--line-height-large);
margin: 0 0.15em;
min-width: 24px;
padding: 0.15em 0.6em;
}
This makes:
Hi I was wondering if this component will be updated to use color schemas? Ie primary, secondary etc…
I haven’t had time to update this, but I will try to fit some time in sometime soon.
In the meantime perhaps this official component might suit your needs?
Yeah that one is cool for sure. Was more looking at the tables your component here enhances table readability vs core. By using a more tradition table layout with vertical lines separators.
I appreciate how big the team workloads must be. No hurry, just though would inquire as only just recently found your TC. 