2022-11-02 23:57:18 +01:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta http-equiv = "Content-Type" content = "text/html" charset = "UTF-8" / >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" / >
< link rel = "apple-touch-icon" sizes = "180x180" href = "https://tailbliss.vercel.app/favicon/apple-touch-icon.png" >
< link rel = "icon" type = "image/png" sizes = "32x32" href = "https://tailbliss.vercel.app/favicon/favicon-32x32.png" >
< link rel = "icon" type = "image/png" sizes = "16x16" href = "https://tailbliss.vercel.app/favicon/favicon-16x16.png" >
< link rel = "manifest" href = "https://tailbliss.vercel.app/favicon/site.webmanifest" >
< link rel = "mask-icon" href = "https://tailbliss.vercel.app/favicon/safari-pinned-tab.svg" color = "#5bbad5" >
< meta name = "msapplication-TileColor" content = "#da532c" >
< meta name = "theme-color" content = "#ffffff" >
< title itemprop = "name" > Blog Post 5 | TailBliss
< / title >
< meta name = "description" content = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed cursus, odio nec venenatis lacinia, lacus lectus varius nisi, in tristique mi purus ut libero. Vestibulum vel convallis felis. Ut finibus lorem vestibulum lobortis rhoncus." / >
< meta property = "og:title" content = "Blog Post 5 | TailBliss" / >
< meta name = "twitter:title" content = "Blog Post 5 | TailBliss" / >
< meta itemprop = "name" content = "Blog Post 5 | TailBliss" / >
< meta name = "application-name" content = "Blog Post 5 | TailBliss" / >
< meta property = "og:site_name" content = "TailBliss" / >
< meta property = "og:type" content = "website" / >
< meta property = "og:title" content = "TailBliss" / >
< meta property = "og:description"
content="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed cursus, odio nec venenatis lacinia, lacus lectus varius nisi, in tristique mi purus ut libero. Vestibulum vel convallis felis. Ut finibus lorem vestibulum lobortis rhoncus." />
< meta property = "og:site_name" content = "TailBliss" / >
< meta property = "og:url" content = "https://tailbliss.vercel.app/posts/blog-post-5/" / >
< meta property = "og:locale" content = "en" >
< meta property = "og:image" content = "/images/tailbliss-cover.png" / >
< meta property = "og:image:secure_url" content = "https://tailbliss.vercel.app/images/tailbliss-cover.png" / >
< meta property = "og:type" content = "website" / >
< script >
if (localStorage.getItem('color-theme') === 'dark' || (!('color-theme' in localStorage) & & window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove('dark')
}
< / script >
< link rel = "stylesheet" href = "/css/style.min.d777530905d7c8fb08a2e589a6bf2f2cb3cd71dbc83e9dcfe0d1bf285466fdea.css" integrity = "sha256-13dTCQXXyPsIouWJpr8vLLPNcdvIPp3P4NG/KFRm/eo=" / >
< / head >
< body class = "bg-zinc-100 dark:bg-gray-800" >
< div class = "top-0 z-50 w-full text-gray-200 bg-gray-900 border-2 border-gray-900 md:sticky border-b-stone-200/10" >
< div x-data = "{ open: false }"
class="flex flex-col max-w-full px-4 mx-auto md:items-center md:justify-between md:flex-row md:px-6 lg:px-8">
< div class = "flex flex-row items-center justify-between p-4" >
< a href = "https://tailbliss.vercel.app/" class = "flex text-gray-100 transition duration-1000 ease-in-out group" >
< img src = "https://tailbliss.vercel.app/images/site-logo.svg"
class="transition-opacity h-9 w-9 group-hover:opacity-50 group-focus:opacity-70"
alt="TailBliss Logo" />
< div
class="mt-1 ml-3 text-xl font-black tracking-tight text-gray-100 uppercase transition-colors group-hover:text-gray-400/60">
TailBliss< / div >
< / a >
< button class = "rounded-lg md:hidden focus:outline-none focus:shadow-outline" @ click = "open = !open" >
< svg fill = "currentColor" viewBox = "0 0 20 20" class = "w-6 h-6" >
< path x-show = "!open" fill-rule = "evenodd"
d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z"
clip-rule="evenodd">< / path >
< path x-show = "open" fill-rule = "evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clip-rule="evenodd">< / path >
< / svg >
< / button >
< / div >
< nav :class = "{'flex': open, 'hidden': !open}"
class="flex-col flex-grow hidden pb-4 md:pb-0 md:flex md:justify-end md:flex-row">
< a class = "px-4 py-2 mt-2 text-sm font-semibold rounded-lg md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-700 focus:outline-none focus:shadow-outline"
href="https://tailbliss.vercel.app/prose/">Prose< / a >
< a class = "px-4 py-2 mt-2 text-sm font-semibold rounded-lg md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-700 focus:outline-none focus:shadow-outline"
href="https://tailbliss.vercel.app/about/">About< / a >
< div @ click . away = "open = false" class = "relative" x-data = "{ open: false }" >
< button @ click = "open = !open"
class="flex flex-row items-center w-full px-4 py-2 mt-2 text-sm font-semibold text-left bg-transparent rounded-lg md:w-auto md:inline md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-600 focus:outline-none focus:shadow-outline">
< span > Categories< / span >
< svg fill = "currentColor" viewBox = "0 0 20 20" :class = "{'rotate-180': open, 'rotate-0': !open}"
class="inline w-4 h-4 mt-1 ml-1 transition-transform duration-200 transform md:-mt-1">
< path fill-rule = "evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd">< / path >
< / svg >
< / button >
< div x-show = "open" x-transition:enter = "transition ease-out duration-100"
x-transition:enter-start="transform opacity-0 scale-95"
x-transition:enter-end="transform opacity-100 scale-100"
x-transition:leave="transition ease-in duration-75"
x-transition:leave-start="transform opacity-100 scale-100"
x-transition:leave-end="transform opacity-0 scale-95"
class="absolute right-0 z-30 w-full mt-2 origin-top-right rounded-md shadow-lg md:w-48">
< div class = "px-2 py-2 text-indigo-900 bg-white rounded-md shadow" >
< a class = "block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-600 focus:outline-none focus:shadow-outline"
href="https://tailbliss.vercel.app/posts/">Posts< / a >
< a class = "block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-600 focus:outline-none focus:shadow-outline"
href="https://tailbliss.vercel.app/categories/news/">News< / a >
< a class = "block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-700 focus:outline-none focus:shadow-outline"
href="https://tailbliss.vercel.app/categories/blog/">Blog< / a >
< / div >
< / div >
< / div >
< div @ click . away = "open = false" class = "relative" x-data = "{ open: false }" >
< button @ click = "open = !open"
class="flex flex-row items-center w-full px-4 py-2 mt-2 text-sm font-semibold text-left bg-transparent rounded-lg dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:focus:bg-gray-600 dark-mode:hover:bg-gray-600 md:w-auto md:inline md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-600 focus:outline-none focus:shadow-outline">
< span > Dropdown< / span >
< svg fill = "currentColor" viewBox = "0 0 20 20" :class = "{'rotate-180': open, 'rotate-0': !open}"
class="inline w-4 h-4 mt-1 ml-1 transition-transform duration-200 transform md:-mt-1">
< path fill-rule = "evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd">< / path >
< / svg >
< / button >
< div x-show = "open" x-transition:enter = "transition ease-out duration-100"
x-transition:enter-start="transform opacity-0 scale-95"
x-transition:enter-end="transform opacity-100 scale-100"
x-transition:leave="transition ease-in duration-75"
x-transition:leave-start="transform opacity-100 scale-100"
x-transition:leave-end="transform opacity-0 scale-95"
class="absolute right-0 z-30 w-full mt-2 origin-top-right md:max-w-sm md:w-screen">
< div class = "px-2 pt-2 pb-4 bg-white rounded-md shadow-lg text-zinc-900" >
< div class = "grid grid-cols-1 gap-4" >
< a class = "flex items-start p-2 bg-transparent rounded-lg group row hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-700 focus:outline-none focus:shadow-outline"
href="#">
< div class = "p-3 text-white bg-indigo-600 rounded-lg group-hover:bg-gray-900" >
< svg fill = "none" stroke = "currentColor" stroke-linecap = "round"
stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"
class="w-4 h-4 md:h-6 md:w-6">
< path
d="M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z">
< / path >
< / svg >
< / div >
< div class = "ml-3" >
< p class = "font-semibold" > Appearance< / p >
< p class = "text-sm" > Easy customization< / p >
< / div >
< / a >
< a class = "flex items-start p-2 bg-transparent rounded-lg group row hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-700 focus:outline-none focus:shadow-outline"
href="#">
< div class = "p-3 text-white bg-indigo-600 rounded-lg group-hover:bg-gray-900" >
< svg fill = "none" stroke = "currentColor" stroke-linecap = "round"
stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"
class="w-4 h-4 md:h-6 md:w-6">
< path
d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z">
< / path >
< / svg >
< / div >
< div class = "ml-3" >
< p class = "font-semibold" > Comments< / p >
< p class = "text-sm" > Check your latest comments< / p >
< / div >
< / a >
< a class = "flex items-start p-2 bg-transparent rounded-lg group row hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-700 focus:outline-none focus:shadow-outline"
href="#">
< div class = "p-3 text-white bg-indigo-600 rounded-lg group-hover:bg-gray-900" >
< svg fill = "none" stroke = "currentColor" stroke-linecap = "round"
stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"
class="w-4 h-4 md:h-6 md:w-6">
< path d = "M11 3.055A9.001 9.001 0 1020.945 13H11V3.055z" >
< / path >
< path d = "M20.488 9H15V3.512A9.025 9.025 0 0120.488 9z" >
< / path >
< / svg >
< / div >
< div class = "ml-3" >
< p class = "font-semibold" > Analytics< / p >
< p class = "text-sm" > Take a look at your statistics< / p >
< / div >
< / a >
< / div >
< / div >
< / div >
< / div >
< a class = "px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-indigo-600 focus:bg-indigo-700 focus:outline-none focus:shadow-outline"
href="https://tailbliss.vercel.app/contact">
Contact
< / a >
< button id = "theme-toggle" type = "button"
class="p-2 text-sm text-gray-500 rounded-lg md: dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 md:ml-2 max-w-5 xs:hidden">
< svg id = "theme-toggle-dark-icon" class = "hidden w-5 h-5" fill = "currentColor" viewBox = "0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
< path d = "M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z" >
< / path >
< / svg >
< svg id = "theme-toggle-light-icon" class = "hidden w-5 h-5" fill = "currentColor" viewBox = "0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
< path d = "M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"
fill-rule="evenodd" clip-rule="evenodd">< / path >
< / svg >
< / button >
< / nav >
< / div >
< / div >
< article >
< header class = "mb-4 bg-indigo-600" >
< span class = "py-96" >
< h1 class = "py-16 text-5xl font-black text-center text-white capitalize" >
Blog Post 5
< / h1 >
< / span >
< / header >
< div class = "max-w-4xl mx-auto mt-8 mb-2" >
< div class = "px-6" >
< img src = "https://tailbliss.vercel.app/../assets/images/featured/featured-img-placeholder_hu546ed76f4977c4148a28456895aefdc5_449073_1500x0_resize_q80_h2_box_3.webp" srcset = ", /../assets/images/featured/featured-img-placeholder_hu546ed76f4977c4148a28456895aefdc5_449073_400x0_resize_q80_h2_box_3.webp 400w, /../assets/images/featured/featured-img-placeholder_hu546ed76f4977c4148a28456895aefdc5_449073_550x0_resize_q80_h2_box_3.webp 550w, /../assets/images/featured/featured-img-placeholder_hu546ed76f4977c4148a28456895aefdc5_449073_900x0_resize_q80_h2_box_3.webp 768w, /../assets/images/featured/featured-img-placeholder_hu546ed76f4977c4148a28456895aefdc5_449073_1500x0_resize_q80_h2_box_3.webp 1100w"
class="object-fill overflow-hidden rounded-lg shadow-lg ring-4 ring-zinc-300/40 dark:ring-gray-900/40 shadow-neutral-100/20 dark:shadow-neutral-800/40"
width="100%" alt="" />
< / div >
< / div >
< div class = "max-w-2xl px-6 pt-6 pb-16 mx-auto prose dark:prose-invert dark:text-white" >
< p > < strong > Advertisement 😄< / strong > < / p >
< ul >
< li > < strong > < a href = "https://nodeca.github.io/pica/demo/" > pica< / a > < / strong > - high quality and fast image
resize in browser.< / li >
< li > < strong > < a href = "https://github.com/nodeca/babelfish/" > babelfish< / a > < / strong > - developer friendly
i18n with plurals support and easy syntax.< / li >
< / ul >
< p > You will like those projects!< / p >
< hr >
< h1 id = "h1-heading-" > h1 Heading 😊< / h1 >
< h2 id = "h2-heading" > h2 Heading< / h2 >
< h3 id = "h3-heading" > h3 Heading< / h3 >
< h4 id = "h4-heading" > h4 Heading< / h4 >
< h5 id = "h5-heading" > h5 Heading< / h5 >
< h6 id = "h6-heading" > h6 Heading< / h6 >
< h2 id = "horizontal-rules" > Horizontal Rules< / h2 >
< hr >
< hr >
< hr >
< h2 id = "typographic-replacements" > Typographic replacements< / h2 >
< p > Enable typographer option to see result.< / p >
< p > (c) (C) (r) (R) (tm) (TM) (p) (P) +-< / p >
< p > test.. test… test… .. test?… .. test!… .< / p >
< p > !!!!!! ???? ,, – — < / p >
< p > “ Smartypants, double quotes” and ‘ single quotes’ < / p >
< h2 id = "emphasis" > Emphasis< / h2 >
< p > < strong > This is bold text< / strong > < / p >
< p > < strong > This is bold text< / strong > < / p >
< p > < em > This is italic text< / em > < / p >
< p > < em > This is italic text< / em > < / p >
< p > < del > Strikethrough< / del > < / p >
< h2 id = "blockquotes" > Blockquotes< / h2 >
< blockquote >
< p > Blockquotes can also be nested… < / p >
< blockquote >
< p > … by using additional greater-than signs right next to each other… < / p >
< blockquote >
< p > … or with spaces between arrows.< / p >
< / blockquote >
< / blockquote >
< / blockquote >
< h2 id = "lists" > Lists< / h2 >
< p > Unordered< / p >
< ul >
< li > Create a list by starting a line with < code > +< / code > , < code > -< / code > , or < code > *< / code > < / li >
< li > Sub-lists are made by indenting 2 spaces:
< ul >
< li > Marker character change forces new list start:
< ul >
< li > Ac tristique libero volutpat at< / li >
< / ul >
< ul >
< li > Facilisis in pretium nisl aliquet< / li >
< / ul >
< ul >
< li > Nulla volutpat aliquam velit< / li >
< / ul >
< / li >
< / ul >
< / li >
< li > Very easy!< / li >
< / ul >
< p > Ordered< / p >
< ol >
< li >
< p > Lorem ipsum dolor sit amet< / p >
< / li >
< li >
< p > Consectetur adipiscing elit< / p >
< / li >
< li >
< p > Integer molestie lorem at massa< / p >
< / li >
< li >
< p > You can use sequential numbers… < / p >
< / li >
< li >
< p > … or keep all the numbers as < code > 1.< / code > < / p >
< / li >
< / ol >
< p > Start numbering with offset:< / p >
< ol start = "57" >
< li > foo< / li >
< li > bar< / li >
< / ol >
< h2 id = "code" > Code< / h2 >
< p > Inline < code > code< / code > < / p >
< p > Indented code< / p >
< pre > < code > // Some comments
2022-10-29 00:20:35 +02:00
line 1 of code
line 2 of code
line 3 of code
2022-11-02 23:57:18 +01:00
< / code > < / pre >
< p > Block code “ fences” < / p >
< pre tabindex = "0" > < code > Sample text here...
< / code > < / pre > < p > Syntax highlighting< / p >
< div class = "highlight" > < pre tabindex = "0" style = "color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;" > < code class = "language-js" data-lang = "js" > < span style = "display:flex;" > < span > < span style = "color:#66d9ef" > var< / span > < span style = "color:#a6e22e" > foo< / span > < span style = "color:#f92672" > =< / span > < span style = "color:#66d9ef" > function< / span > (< span style = "color:#a6e22e" > bar< / span > ) {
< / span > < / span > < span style = "display:flex;" > < span > < span style = "color:#66d9ef" > return< / span > < span style = "color:#a6e22e" > bar< / span > < span style = "color:#f92672" > ++< / span > ;
< / span > < / span > < span style = "display:flex;" > < span > };
< / span > < / span > < span style = "display:flex;" > < span >
< / span > < / span > < span style = "display:flex;" > < span > < span style = "color:#a6e22e" > console< / span > .< span style = "color:#a6e22e" > log< / span > (< span style = "color:#a6e22e" > foo< / span > (< span style = "color:#ae81ff" > 5< / span > ));
< / span > < / span > < / code > < / pre > < / div > < h2 id = "tables" > Tables< / h2 >
< table >
< thead >
< tr >
< th > Option< / th >
< th > Description< / th >
< / tr >
< / thead >
< tbody >
< tr >
< td > data< / td >
< td > path to data files to supply the data that will be passed into templates.< / td >
< / tr >
< tr >
< td > engine< / td >
< td > engine to be used for processing templates. Handlebars is the default.< / td >
< / tr >
< tr >
< td > ext< / td >
< td > extension to be used for dest files.< / td >
< / tr >
< / tbody >
< / table >
< p > Right aligned columns< / p >
< table >
< thead >
< tr >
< th style = "text-align:right" > Option< / th >
< th style = "text-align:right" > Description< / th >
< / tr >
< / thead >
< tbody >
< tr >
< td style = "text-align:right" > data< / td >
< td style = "text-align:right" > path to data files to supply the data that will be passed into templates.< / td >
< / tr >
< tr >
< td style = "text-align:right" > engine< / td >
< td style = "text-align:right" > engine to be used for processing templates. Handlebars is the default.< / td >
< / tr >
< tr >
< td style = "text-align:right" > ext< / td >
< td style = "text-align:right" > extension to be used for dest files.< / td >
< / tr >
< / tbody >
< / table >
< h2 id = "links" > Links< / h2 >
< p > < a href = "http://dev.nodeca.com" > link text< / a > < / p >
< p > < a href = "http://nodeca.github.io/pica/demo/" title = "title text!" > link with title< / a > < / p >
< p > Autoconverted link < a href = "https://github.com/nodeca/pica" > https://github.com/nodeca/pica< / a > (enable linkify to see)< / p >
< h2 id = "images" > Images< / h2 >
< p > < img src = "https://octodex.github.com/images/minion.png" alt = "Minion" >
< img src = "https://octodex.github.com/images/stormtroopocat.jpg" alt = "Stormtroopocat" title = "The Stormtroopocat" > < / p >
< p > Like links, Images also have a footnote style syntax< / p >
< p > < img src = "https://octodex.github.com/images/dojocat.jpg" alt = "Alt text" title = "The Dojocat" > < / p >
< p > With a reference later in the document defining the URL location:< / p >
< h2 id = "plugins" > Plugins< / h2 >
< p > The killer feature of < code > markdown-it< / code > is very effective support of
< a href = "https://www.npmjs.org/browse/keyword/markdown-it-plugin" > syntax plugins< / a > .< / p >
< h3 id = "emojieshttpsgithubcommarkdown-itmarkdown-it-emoji" > < a href = "https://github.com/markdown-it/markdown-it-emoji" > Emojies< / a > < / h3 >
< blockquote >
< p > Classic markup: 😉 :crush: 😢 :tear: 😆 😋< / p >
< p > Shortcuts (emoticons): :-) :-( 8-) ;)< / p >
< / blockquote >
< p > see < a href = "https://github.com/markdown-it/markdown-it-emoji#change-output" > how to change output< / a > with twemoji.< / p >
< h3 id = "subscripthttpsgithubcommarkdown-itmarkdown-it-sub--superscripthttpsgithubcommarkdown-itmarkdown-it-sup" > < a href = "https://github.com/markdown-it/markdown-it-sub" > Subscript< / a > / < a href = "https://github.com/markdown-it/markdown-it-sup" > Superscript< / a > < / h3 >
< ul >
< li > 19^th^< / li >
< li > H~2~O< / li >
< / ul >
< h3 id = "inshttpsgithubcommarkdown-itmarkdown-it-ins" > < a href = "https://github.com/markdown-it/markdown-it-ins" > < ins> < / a > < / h3 >
< p > ++Inserted text++< / p >
< h3 id = "markhttpsgithubcommarkdown-itmarkdown-it-mark" > < a href = "https://github.com/markdown-it/markdown-it-mark" > < mark> < / a > < / h3 >
< p > ==Marked text==< / p >
< h3 id = "footnoteshttpsgithubcommarkdown-itmarkdown-it-footnote" > < a href = "https://github.com/markdown-it/markdown-it-footnote" > Footnotes< / a > < / h3 >
< p > Footnote 1 link< sup id = "fnref:1" > < a href = "#fn:1" class = "footnote-ref" role = "doc-noteref" > 1< / a > < / sup > .< / p >
< p > Footnote 2 link< sup id = "fnref:2" > < a href = "#fn:2" class = "footnote-ref" role = "doc-noteref" > 2< / a > < / sup > .< / p >
< p > Inline footnote^[Text of inline footnote] definition.< / p >
< p > Duplicated footnote reference< sup id = "fnref1:2" > < a href = "#fn:2" class = "footnote-ref" role = "doc-noteref" > 2< / a > < / sup > .< / p >
< h3 id = "definition-listshttpsgithubcommarkdown-itmarkdown-it-deflist" > < a href = "https://github.com/markdown-it/markdown-it-deflist" > Definition lists< / a > < / h3 >
< dl >
< dt > Term 1< / dt >
< dd >
< p > Definition 1
with lazy continuation.< / p >
< / dd >
< dt > Term 2 with < em > inline markup< / em > < / dt >
< dd >
< p > Definition 2< / p >
< pre > < code > { some code, part of Definition 2 }
< / code > < / pre >
< p > Third paragraph of definition 2.< / p >
< / dd >
< / dl >
< p > < em > Compact style:< / em > < / p >
< p > Term 1
~ Definition 1< / p >
< p > Term 2
2022-10-29 00:20:35 +02:00
~ Definition 2a
2022-11-02 23:57:18 +01:00
~ Definition 2b< / p >
< h3 id = "abbreviationshttpsgithubcommarkdown-itmarkdown-it-abbr" > < a href = "https://github.com/markdown-it/markdown-it-abbr" > Abbreviations< / a > < / h3 >
< p > This is HTML abbreviation example.< / p >
< p > It converts “ HTML” , but keep intact partial entries like “ xxxHTMLyyy” and so on.< / p >
< p > *[HTML]: Hyper Text Markup Language< / p >
< h3 id = "custom-containershttpsgithubcommarkdown-itmarkdown-it-container" > < a href = "https://github.com/markdown-it/markdown-it-container" > Custom containers< / a > < / h3 >
< p > ::: warning
2022-10-29 00:20:35 +02:00
< em > here be dragons< / em >
2022-11-02 23:57:18 +01:00
:::< / p >
< div class = "footnotes" role = "doc-endnotes" >
< hr >
< ol >
< li id = "fn:1" >
< p > Footnote < strong > can have markup< / strong > < / p >
< p > and multiple paragraphs.  < a href = "#fnref:1" class = "footnote-backref" role = "doc-backlink" > ↩ ︎ < / a > < / p >
< / li >
< li id = "fn:2" >
< p > Footnote text.  < a href = "#fnref:2" class = "footnote-backref" role = "doc-backlink" > ↩ ︎ < / a >   < a href = "#fnref1:2" class = "footnote-backref" role = "doc-backlink" > ↩ ︎ < / a > < / p >
< / li >
< / ol >
< / div >
< / div >
< / article >
< script src = "https://tailbliss.vercel.app/js/alpine.js" defer > < / script >
< script src = "https://tailbliss.vercel.app/js/darkmode.js" defer > < / script >
< footer class = "bg-gray-900" >
< div class = "max-w-md px-4 py-12 mx-auto overflow-hidden sm:max-w-3xl sm:px-6 lg:max-w-7xl lg:px-8" >
< nav class = "flex flex-wrap justify-center -mx-5 -my-2" aria-label = "Footer" >
< div class = "px-5 py-2" >
< a href = "https://tailbliss.vercel.app/about" class = "text-base text-gray-400 hover:text-gray-300" > About< / a >
< / div >
< div class = "px-5 py-2" >
< a href = "https://tailbliss.vercel.app/categories/blog/" class = "text-base text-gray-400 hover:text-gray-300" > Blog< / a >
< / div >
< div class = "px-5 py-2" >
< a href = "https://tailbliss.vercel.app/categories/news/" class = "text-base text-gray-400 hover:text-gray-300" > News< / a >
< / div >
< div class = "px-5 py-2" >
< a href = "https://tailbliss.vercel.app/prose/" class = "text-base text-gray-400 hover:text-gray-300" > Prose< / a >
< / div >
< div class = "px-5 py-2" >
< a href = "https://tailbliss.vercel.app/contact/" class = "text-base text-gray-400 hover:text-gray-300" > Contact< / a >
< / div >
< / nav >
< div class = "flex justify-center mt-8 space-x-6" >
< a href = "#" class = "text-gray-400 hover:text-gray-300" >
< span class = "sr-only" > Facebook< / span >
< svg class = "w-6 h-6" fill = "currentColor" viewBox = "0 0 24 24" aria-hidden = "true" >
< path fill-rule = "evenodd"
d="M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z"
clip-rule="evenodd" />
< / svg >
< / a >
< a href = "#" class = "text-gray-400 hover:text-gray-300" >
< span class = "sr-only" > Instagram< / span >
< svg class = "w-6 h-6" fill = "currentColor" viewBox = "0 0 24 24" aria-hidden = "true" >
< path fill-rule = "evenodd"
d="M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z"
clip-rule="evenodd" />
< / svg >
< / a >
< a href = "#" class = "text-gray-400 hover:text-gray-300" >
< span class = "sr-only" > Twitter< / span >
< svg class = "w-6 h-6" fill = "currentColor" viewBox = "0 0 24 24" aria-hidden = "true" >
< path
d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84" />
< / svg >
< / a >
< a href = "#" class = "text-gray-400 hover:text-gray-300" >
< span class = "sr-only" > GitHub< / span >
< svg class = "w-6 h-6" fill = "currentColor" viewBox = "0 0 24 24" aria-hidden = "true" >
< path fill-rule = "evenodd"
d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
clip-rule="evenodd" />
< / svg >
< / a >
< a href = "#" class = "text-gray-400 hover:text-gray-300" >
< span class = "sr-only" > Dribbble< / span >
< svg class = "w-6 h-6" fill = "currentColor" viewBox = "0 0 24 24" aria-hidden = "true" >
< path fill-rule = "evenodd"
d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10c5.51 0 10-4.48 10-10S17.51 2 12 2zm6.605 4.61a8.502 8.502 0 011.93 5.314c-.281-.054-3.101-.629-5.943-.271-.065-.141-.12-.293-.184-.445a25.416 25.416 0 00-.564-1.236c3.145-1.28 4.577-3.124 4.761-3.362zM12 3.475c2.17 0 4.154.813 5.662 2.148-.152.216-1.443 1.941-4.48 3.08-1.399-2.57-2.95-4.675-3.189-5A8.687 8.687 0 0112 3.475zm-3.633.803a53.896 53.896 0 013.167 4.935c-3.992 1.063-7.517 1.04-7.896 1.04a8.581 8.581 0 014.729-5.975zM3.453 12.01v-.26c.37.01 4.512.065 8.775-1.215.25.477.477.965.694 1.453-.109.033-.228.065-.336.098-4.404 1.42-6.747 5.303-6.942 5.629a8.522 8.522 0 01-2.19-5.705zM12 20.547a8.482 8.482 0 01-5.239-1.8c.152-.315 1.888-3.656 6.703-5.337.022-.01.033-.01.054-.022a35.318 35.318 0 011.823 6.475 8.4 8.4 0 01-3.341.684zm4.761-1.465c-.086-.52-.542-3.015-1.659-6.084 2.679-.423 5.022.271 5.314.369a8.468 8.468 0 01-3.655 5.715z"
clip-rule="evenodd" />
< / svg >
< / a >
< / div >
< p class = "mt-8 text-base text-center text-gray-400" > © 2022
TailBliss. All rights
reserved.< / p >
< p class = "mt-2 text-base text-center text-gray-400" > Made with ❤ ️ by < a
href="https://nusserstudios.com" class="hover:underline hover:text-indigo-600">< span
class="font-black uppercase">Nusser< / span > < span class = "font-light uppercase" > Studios.< / span > < / a >
< / p >
< / div >
< / footer >
< / body >
< / html >
