<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
  <channel>
    <title>Markdown on Brandon Pugh&#39;s Blog</title>
    <link>https://www.brandonpugh.com/tags/markdown/</link>
    <description>Recent content in Markdown on Brandon Pugh&#39;s Blog</description>
    <generator>Hugo -- gohugo.io</generator>
    <language>en</language>
    <lastBuildDate>Sun, 31 May 2026 00:00:00 +0000</lastBuildDate><atom:link href="https://www.brandonpugh.com/tags/markdown/index.xml" rel="self" type="application/rss+xml" />
    <item>
      <title>Alerts, Callouts, and Admonitions</title>
      <link>https://www.brandonpugh.com/garden/alerts-callouts-admonitions/</link>
      <pubDate>Sun, 31 May 2026 00:00:00 +0000</pubDate>
      <guid>https://www.brandonpugh.com/garden/alerts-callouts-admonitions/</guid>
      <description>&lt;p&gt;What my site currently supports:&lt;/p&gt;
&lt;blockquote class=&#34;alert alert-note&#34;&gt;
  &lt;p class=&#34;alert-heading&#34;&gt;
    &lt;span aria-hidden=&#34;true&#34;&gt;&lt;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; viewBox=&#34;0 0 16 16&#34; width=&#34;16&#34; height=&#34;16&#34;&gt;&lt;path d=&#34;M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z&#34;&gt;&lt;/path&gt;&lt;/svg&gt;&lt;/span&gt;
    &lt;em&gt;&lt;span&gt;Note&lt;/span&gt;&lt;/em&gt;
  &lt;/p&gt;
  &lt;p&gt;Highlights information that users should take into account, even when skimming.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;blockquote class=&#34;alert alert-tip&#34;&gt;
  &lt;p class=&#34;alert-heading&#34;&gt;
    &lt;span aria-hidden=&#34;true&#34;&gt;&lt;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; viewBox=&#34;0 0 16 16&#34; width=&#34;16&#34; height=&#34;16&#34;&gt;&lt;path d=&#34;M8 1.5c-2.363 0-4 1.69-4 3.75 0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848.284.411.537.896.621 1.49a.75.75 0 0 1-1.484.211c-.04-.282-.163-.547-.37-.847a8.456 8.456 0 0 0-.542-.68c-.084-.1-.173-.205-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25 2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259-.095.115-.184.22-.268.319-.207.245-.383.453-.541.681-.208.3-.33.565-.37.847a.751.751 0 0 1-1.485-.212c.084-.593.337-1.078.621-1.489.203-.292.45-.584.673-.848.075-.088.147-.173.213-.253.561-.679.985-1.32.985-2.304 0-2.06-1.637-3.75-4-3.75ZM5.75 12h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM6 15.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 0 1.5h-2.5a.75.75 0 0 1-.75-.75Z&#34;&gt;&lt;/path&gt;&lt;/svg&gt;&lt;/span&gt;
    &lt;em&gt;&lt;span&gt;Tip&lt;/span&gt;&lt;/em&gt;
  &lt;/p&gt;
  &lt;p&gt;Optional information to help a user be more successful.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;blockquote class=&#34;alert alert-important&#34;&gt;
  &lt;p class=&#34;alert-heading&#34;&gt;
    &lt;span aria-hidden=&#34;true&#34;&gt;&lt;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; viewBox=&#34;0 0 16 16&#34; width=&#34;16&#34; height=&#34;16&#34;&gt;&lt;path d=&#34;M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v9.5A1.75 1.75 0 0 1 14.25 13H8.06l-2.573 2.573A1.458 1.458 0 0 1 3 14.543V13H1.75A1.75 1.75 0 0 1 0 11.25Zm1.75-.25a.25.25 0 0 0-.25.25v9.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-9.5a.25.25 0 0 0-.25-.25Zm7 2.25v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 9a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z&#34;&gt;&lt;/path&gt;&lt;/svg&gt;&lt;/span&gt;
    &lt;em&gt;&lt;span&gt;Important&lt;/span&gt;&lt;/em&gt;
  &lt;/p&gt;
  &lt;p&gt;Crucial information necessary for users to succeed.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;blockquote class=&#34;alert alert-warning&#34;&gt;
  &lt;p class=&#34;alert-heading&#34;&gt;
    &lt;span aria-hidden=&#34;true&#34;&gt;&lt;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; viewBox=&#34;0 0 16 16&#34; width=&#34;16&#34; height=&#34;16&#34;&gt;&lt;path d=&#34;M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z&#34;&gt;&lt;/path&gt;&lt;/svg&gt;&lt;/span&gt;
    &lt;em&gt;&lt;span&gt;Warning&lt;/span&gt;&lt;/em&gt;
  &lt;/p&gt;
  &lt;p&gt;Critical content demanding immediate user attention due to potential risks.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;blockquote class=&#34;alert alert-caution&#34;&gt;
  &lt;p class=&#34;alert-heading&#34;&gt;
    &lt;span aria-hidden=&#34;true&#34;&gt;&lt;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; viewBox=&#34;0 0 16 16&#34; width=&#34;16&#34; height=&#34;16&#34;&gt;&lt;path d=&#34;M4.47.22A.749.749 0 0 1 5 0h6c.199 0 .389.079.53.22l4.25 4.25c.141.14.22.331.22.53v6a.749.749 0 0 1-.22.53l-4.25 4.25A.749.749 0 0 1 11 16H5a.749.749 0 0 1-.53-.22L.22 11.53A.749.749 0 0 1 0 11V5c0-.199.079-.389.22-.53Zm.84 1.28L1.5 5.31v5.38l3.81 3.81h5.38l3.81-3.81V5.31L10.69 1.5ZM8 4a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 4Zm0 8a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z&#34;&gt;&lt;/path&gt;&lt;/svg&gt;&lt;/span&gt;
    &lt;em&gt;&lt;span&gt;Caution&lt;/span&gt;&lt;/em&gt;
  &lt;/p&gt;
  &lt;p&gt;Negative potential consequences of an action.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;h2 id=&#34;prior-art&#34;&gt;Prior art&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&#34;https://mandarismoore.com/2026/05/02/admonish-the-callout/&#34;&gt;Admonish the Callout - Mandaris&lt;/a&gt; inspired me to finally implement on my blog&lt;/li&gt;
&lt;li&gt;&lt;a href=&#34;https://github.com/antfu/markdown-it-github-alerts&#34;&gt;antfu/markdown-it-github-alerts: Support GitHub-style alerts for markdown-it&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

       &lt;hr&gt; &lt;p&gt;Thank you for keeping RSS alive. You&#39;re awesome.&lt;/p&gt; &lt;p&gt;&lt;a href=&#34;mailto:blogrss@bpugh.dev&#34;&gt;Reply by email&lt;/a&gt;&lt;/p&gt;
        &lt;img src=&quot;https://blog.bpugh.workers.dev/cdn/images?p=/garden/alerts-callouts-admonitions/feed&quot;&gt;
      </description>
    </item>
    
    <item>
      <title>Collapsible markdown section</title>
      <link>https://www.brandonpugh.com/links/collapsible-markdown/</link>
      <pubDate>Sat, 19 Apr 2025 00:00:00 +0000</pubDate>
      <guid>https://www.brandonpugh.com/links/collapsible-markdown/</guid>
      <description>&lt;p&gt;&lt;a href=&#34;https://github.com/williln/til/blob/main/markdown/collapsible_markdown.md&#34;&gt;Collapsible markdown TIL from williln/til&lt;/a&gt;&lt;/p&gt;
&lt;details&gt;
  &lt;summary&gt;Click me&lt;/summary&gt;
&lt;h3 id=&#34;favorite-disney-movies&#34;&gt;Favorite Disney Movies&lt;/h3&gt;
&lt;ol&gt;
&lt;li&gt;Wall-E&lt;/li&gt;
&lt;li&gt;Moana&lt;/li&gt;
&lt;/ol&gt;
&lt;/details&gt;

       &lt;hr&gt; &lt;p&gt;Thank you for keeping RSS alive. You&#39;re awesome.&lt;/p&gt; &lt;p&gt;&lt;a href=&#34;mailto:blogrss@bpugh.dev&#34;&gt;Reply by email&lt;/a&gt;&lt;/p&gt;
        &lt;img src=&quot;https://blog.bpugh.workers.dev/cdn/images?p=/links/collapsible-markdown/feed&quot;&gt;
      </description>
    </item>
    
    <item>
      <title>Semantic line breaks (one sentence per line)</title>
      <link>https://www.brandonpugh.com/til/markdown/semantic-line-breaks/</link>
      <pubDate>Tue, 08 Apr 2025 00:00:00 +0000</pubDate>
      <guid>https://www.brandonpugh.com/til/markdown/semantic-line-breaks/</guid>
      <description>&lt;p&gt;I just discovered &lt;a href=&#34;https://sembr.org/&#34;&gt;Semantic Line Breaks&lt;/a&gt;.
I could never decide on exactly how to do line breaks in markdown so I love that someone came up with a convention that&amp;rsquo;s been thought through.&lt;/p&gt;
&lt;p&gt;This led me to discover this post by Derek Sivers: &lt;a href=&#34;https://sive.rs/1s&#34;&gt;Writing one sentence per line&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;What&amp;rsquo;s interesting is that while he&amp;rsquo;s recommending the same approach, he suggests that it will improve your writing itself.&lt;/p&gt;
&lt;p&gt;Nicer git diffs is just a side benefit. 🙂&lt;/p&gt;
&lt;p&gt;Definitely going to adopt this now and see how I like it.&lt;/p&gt;

       &lt;hr&gt; &lt;p&gt;Thank you for keeping RSS alive. You&#39;re awesome.&lt;/p&gt; &lt;p&gt;&lt;a href=&#34;mailto:blogrss@bpugh.dev&#34;&gt;Reply by email&lt;/a&gt;&lt;/p&gt;
        &lt;img src=&quot;https://blog.bpugh.workers.dev/cdn/images?p=/til/markdown/semantic-line-breaks/feed&quot;&gt;
      </description>
    </item>
    
    <item>
      <title>You can style markdown links as code</title>
      <link>https://www.brandonpugh.com/til/markdown/style-links/</link>
      <pubDate>Tue, 18 Mar 2025 00:00:00 +0000</pubDate>
      <guid>https://www.brandonpugh.com/til/markdown/style-links/</guid>
      <description>&lt;p&gt;I just figured out that you can style a link as inline code in markdown i.e. &lt;a href=&#34;https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/toSorted&#34;&gt;&lt;code&gt;toSorted()&lt;/code&gt;&lt;/a&gt;
It&amp;rsquo;s a bit non-intuitive since, unlike bold or italics, the backticks go &lt;em&gt;inside&lt;/em&gt; the square brackets instead of around the entire link.&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-md&#34; data-lang=&#34;md&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;This gives a bold link: &lt;span class=&#34;ge&#34;&gt;**&lt;/span&gt;[&lt;span class=&#34;nt&#34;&gt;EFF&lt;/span&gt;](&lt;span class=&#34;na&#34;&gt;https://eff.org&lt;/span&gt;)**.
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;This is for italics: &lt;span class=&#34;ge&#34;&gt;*[Markdown Guide](https://www.markdownguide.org)*&lt;/span&gt;.
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;And this is for code: [&lt;span class=&#34;nt&#34;&gt;`toSorted()`&lt;/span&gt;](&lt;span class=&#34;na&#34;&gt;https://www.brandonpugh.com/til/javascript/tosorted/&lt;/span&gt;).
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;In my testing this seems supported in most places like github and azure devops. Unfortunately I couldn&amp;rsquo;t find a way get it styled like that in Teams.&lt;/p&gt;

       &lt;hr&gt; &lt;p&gt;Thank you for keeping RSS alive. You&#39;re awesome.&lt;/p&gt; &lt;p&gt;&lt;a href=&#34;mailto:blogrss@bpugh.dev&#34;&gt;Reply by email&lt;/a&gt;&lt;/p&gt;
        &lt;img src=&quot;https://blog.bpugh.workers.dev/cdn/images?p=/til/markdown/style-links/feed&quot;&gt;
      </description>
    </item>
    
  </channel>
</rss>