Jekyll version
3.10.0
Jekyll environment
production
Site Variables
{
"categories": {
"examples": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with video | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with video\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-12-14T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Empty post with video\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-12-14T00:00:00+00:00\",\"datePublished\":\"2023-12-14T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with video\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with video</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Empty post with video\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Dec 14, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+video&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F;t=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F%2F&title=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <div id=\"Timeline-video-container\" class=\"image-container mb-5\">\n <iframe id=\"Timeline-video\" src=\"https://www.youtube.com/embed/E4WlUXrJgy4?si=BhUjhwehMIZME9Cf\" frameborder=\"0\" height=\"inherited\"\n width=\"inherited\"></iframe>\n </div>\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with image | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with image\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-11-21T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"twitter:title\" content=\"Empty post with image\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-11-21T00:00:00+00:00\",\"datePublished\":\"2023-11-21T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with image\",\"image\":\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with image</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" class=\"cover-image rounded-2\" alt=\"Empty post with image\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Nov 21, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+image&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F;t=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F%2F&title=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test short post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test short post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<meta property=\"og:description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-30T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test short post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-30T00:00:00+00:00\",\"datePublished\":\"2019-01-30T00:00:00+00:00\",\"description\":\"This is a short post. It should show up on the timeline without a “continue” option.\",\"headline\":\"Test short post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test short post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test short post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 30, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+short+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F;t=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F%2F&title=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a basic post with various styles.\" />\n<meta property=\"og:description\" content=\"This is an example of a basic post with various styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"This is an example of a basic post with various styles.\",\"headline\":\"Test post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F;t=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F%2F&title=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is an example of a basic post with various styles.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>.</p>\n\n<p><a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Link to another post</a>.</p>\n\n<p>There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.</p>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header.</p>\n\n <p>When something is important enough, you do it even if the odds are not in your favor.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<div class=\"language-js highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\">// Javascript code with syntax highlighting.</span>\n<span class=\"kd\">var</span> <span class=\"nx\">fun</span> <span class=\"o\">=</span> <span class=\"kd\">function</span> <span class=\"nx\">lang</span><span class=\"p\">(</span><span class=\"nx\">l</span><span class=\"p\">)</span> <span class=\"p\">{</span>\n <span class=\"nx\">dateformat</span><span class=\"p\">.</span><span class=\"nx\">i18n</span> <span class=\"o\">=</span> <span class=\"nx\">require</span><span class=\"p\">(</span><span class=\"dl\">'</span><span class=\"s1\">./lang/</span><span class=\"dl\">'</span> <span class=\"o\">+</span> <span class=\"nx\">l</span><span class=\"p\">)</span>\n <span class=\"k\">return</span> <span class=\"kc\">true</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\"># Ruby code with syntax highlighting</span>\n<span class=\"no\">GitHubPages</span><span class=\"o\">::</span><span class=\"no\">Dependencies</span><span class=\"p\">.</span><span class=\"nf\">gems</span><span class=\"p\">.</span><span class=\"nf\">each</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"n\">version</span><span class=\"o\">|</span>\n <span class=\"n\">s</span><span class=\"p\">.</span><span class=\"nf\">add_dependency</span><span class=\"p\">(</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"s2\">\"= </span><span class=\"si\">#{</span><span class=\"n\">version</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">)</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th style=\"text-align: left\">head1</th>\n <th style=\"text-align: left\">head two</th>\n <th style=\"text-align: left\">three</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good swedish fish</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">out of stock</td>\n <td style=\"text-align: left\">good and plenty</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good cookies</td>\n <td style=\"text-align: left\">good</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good licorice</td>\n <td style=\"text-align: left\">yum</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"theres-a-horizontal-rule-below-this\">There’s a horizontal rule below this.</h3>\n\n<hr />\n\n<h3 id=\"here-is-an-unordered-list\">Here is an unordered list:</h3>\n\n<ul>\n <li>Item foo</li>\n <li>Item bar</li>\n <li>Item baz</li>\n <li>Item zip</li>\n</ul>\n\n<h3 id=\"and-an-ordered-list\">And an ordered list:</h3>\n\n<ol>\n <li>Item one</li>\n <li>Item two</li>\n <li>Item three</li>\n <li>Item four</li>\n</ol>\n\n<h3 id=\"and-a-nested-list\">And a nested list:</h3>\n\n<ul>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item\n <ul>\n <li>level 3 item</li>\n <li>level 3 item</li>\n </ul>\n </li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item</li>\n</ul>\n\n<h3 id=\"small-image\">Small image</h3>\n\n<p><img src=\"https://github.githubassets.com/images/icons/emoji/octocat.png\" alt=\"Octocat\" /></p>\n\n<h3 id=\"large-image\">Large image</h3>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Branching\" /></p>\n\n<h3 id=\"definition-lists-can-be-used-with-html-syntax\">Definition lists can be used with HTML syntax.</h3>\n\n<dl>\n<dt>Name</dt>\n<dd>Godzilla</dd>\n<dt>Born</dt>\n<dd>1952</dd>\n<dt>Birthplace</dt>\n<dd>Japan</dd>\n<dt>Color</dt>\n<dd>Green</dd>\n</dl>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.\n</code></pre></div></div>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>The final element.\n</code></pre></div></div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Syntax highlighter | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Syntax highlighter\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"Below are some languages and their representative styles.\" />\n<meta property=\"og:description\" content=\"Below are some languages and their representative styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Syntax highlighter\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"Below are some languages and their representative styles.\",\"headline\":\"Syntax highlighter\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Syntax highlighter</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Syntax highlighter\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Syntax+highlighter&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F;t=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F%2F&title=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>Below are some languages and their representative styles.</p>\n\n<h2 id=\"ruby\">Ruby</h2>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">def</span> <span class=\"nf\">show</span>\n <span class=\"nb\">puts</span> <span class=\"s2\">\"Outputting a very lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong line\"</span>\n <span class=\"vi\">@widget</span> <span class=\"o\">=</span> <span class=\"no\">Widget</span><span class=\"p\">(</span><span class=\"n\">params</span><span class=\"p\">[</span><span class=\"ss\">:id</span><span class=\"p\">])</span>\n <span class=\"n\">respond_to</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"nb\">format</span><span class=\"o\">|</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">html</span> <span class=\"c1\"># show.html.erb</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">json</span> <span class=\"p\">{</span> <span class=\"n\">render</span> <span class=\"ss\">json: </span><span class=\"vi\">@widget</span> <span class=\"p\">}</span>\n <span class=\"k\">end</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h2 id=\"php\">Php</h2>\n\n<div class=\"language-php highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\"><?php</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s2\">\"Hello </span><span class=\"si\">{</span><span class=\"nv\">$world</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">);</span>\n<span class=\"cp\">?></span>\n</code></pre></div></div>\n\n<h2 id=\"java\">Java</h2>\n\n<div class=\"language-java highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kd\">public</span> <span class=\"kd\">class</span> <span class=\"nc\">java</span> <span class=\"o\">{</span>\n <span class=\"kd\">public</span> <span class=\"kd\">static</span> <span class=\"kt\">void</span> <span class=\"nf\">main</span><span class=\"o\">(</span><span class=\"nc\">String</span><span class=\"o\">[]</span> <span class=\"n\">args</span><span class=\"o\">)</span> <span class=\"o\">{</span>\n <span class=\"nc\">System</span><span class=\"o\">.</span><span class=\"na\">out</span><span class=\"o\">.</span><span class=\"na\">println</span><span class=\"o\">(</span><span class=\"s\">\"Hello World\"</span><span class=\"o\">);</span>\n <span class=\"o\">}</span>\n<span class=\"o\">}</span>\n</code></pre></div></div>\n\n<h3 id=\"html\">HTML</h3>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><html></span>\n <span class=\"nt\"><head><title></span>Title!<span class=\"nt\"></title></head></span>\n <span class=\"nt\"><body></span>\n <span class=\"nt\"><p</span> <span class=\"na\">id=</span><span class=\"s\">\"foo\"</span><span class=\"nt\">></span>Hello, World!<span class=\"nt\"></p></span>\n <span class=\"nt\"><script </span><span class=\"na\">type=</span><span class=\"s\">\"text/javascript\"</span><span class=\"nt\">></span><span class=\"kd\">var</span> <span class=\"nx\">a</span> <span class=\"o\">=</span> <span class=\"mi\">1</span><span class=\"p\">;</span><span class=\"nt\"></script></span>\n <span class=\"nt\"><style </span><span class=\"na\">type=</span><span class=\"s\">\"text/css\"</span><span class=\"nt\">></span><span class=\"nf\">#foo</span> <span class=\"p\">{</span> <span class=\"nl\">font-weight</span><span class=\"p\">:</span> <span class=\"nb\">bold</span><span class=\"p\">;</span> <span class=\"p\">}</span><span class=\"nt\"></style></span>\n <span class=\"nt\"></body></span>\n<span class=\"nt\"></html></span>\n</code></pre></div></div>\n\n<h2 id=\"console\">Console</h2>\n\n<div class=\"language-console highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"gp\">#</span><span class=\"w\"> </span>prints <span class=\"s2\">\"hello, world\"</span> to the screen\n<span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"nb\">echo </span>Hello, World\n<span class=\"go\">Hello, World\n\n</span><span class=\"gp\">#</span><span class=\"w\"> </span>don<span class=\"s1\">'t run this\n</span><span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"s1\">rm -rf --no-preserve-root /\n</span></code></pre></div></div>\n\n<h2 id=\"css\">Css</h2>\n\n<div class=\"language-css highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\">body</span> <span class=\"p\">{</span>\n <span class=\"nl\">font-size</span><span class=\"p\">:</span> <span class=\"m\">12pt</span><span class=\"p\">;</span>\n <span class=\"nl\">background</span><span class=\"p\">:</span> <span class=\"m\">#fff</span> <span class=\"sx\">url(temp.png)</span> <span class=\"nb\">top</span> <span class=\"nb\">left</span> <span class=\"nb\">no-repeat</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"yaml\">Yaml</h2>\n\n<div class=\"language-yaml highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nn\">---</span>\n<span class=\"na\">one</span><span class=\"pi\">:</span> <span class=\"s\">Apple</span>\n<span class=\"na\">two</span><span class=\"pi\">:</span> <span class=\"s\">Banana</span>\n<span class=\"na\">three</span><span class=\"pi\">:</span> <span class=\"s\">Cherry</span>\n</code></pre></div></div>\n\n<h2 id=\"c\">C++</h2>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span>\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"c1\">// Outputs Hello World to screen.</span>\n <span class=\"n\">std</span><span class=\"o\">::</span><span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"python\">Python</h2>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kn\">import</span> <span class=\"nn\">sys</span>\n\n<span class=\"k\">def</span> <span class=\"nf\">my_function</span><span class=\"p\">():</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s\">\"Hello from a function\"</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<h2 id=\"using-liquid\">Using liquid</h2>\n\n<h3 id=\"without-line-numbers\">Without line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span></code></pre></figure>\n\n<h3 id=\"with-line-numbers\">With line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><table class=\"rouge-table\"><tbody><tr><td class=\"gutter gl\"><pre class=\"lineno\">1\n2\n</pre></td><td class=\"code\"><pre><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span>\n</pre></td></tr></tbody></table></code></pre></figure>\n\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Welcome to Jekyll! | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Welcome to Jekyll!\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<meta property=\"og:description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Welcome to Jekyll!\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\",\"headline\":\"Welcome to Jekyll!\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Welcome to Jekyll!</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Welcome to Jekyll!\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Welcome+to+Jekyll%21&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F;t=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F%2F&title=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n<p>To add new posts, simply add a file in the <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory that follows the convention <code class=\"language-plaintext highlighter-rouge\">YYYY-MM-DD-name-of-post.ext</code> and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.</p>\n\n<p>Check out the <a href=\"https://jekyllrb.com/docs/home\">Jekyll docs</a> for more info on how to get the most out of Jekyll. File all bugs/feature requests at <a href=\"https://github.com/jekyll/jekyll\">Jekyll’s GitHub repo</a>. If you have questions, you can ask them on <a href=\"https://talk.jekyllrb.com/\">Jekyll Talk</a>.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>. <a href=\"https://github.com\">Links</a> should be blue with no underlines (unless hovered over).</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<blockquote>\n <p>There should be no margin above this first sentence.\nBlockquotes should be a lighter gray with a gray border along the left side.\nThere should be no margin below this final sentence.</p>\n</blockquote>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th>What</th>\n <th>Follows</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>There’s a horizontal rule above and below this.</p>\n\n<hr />\n\n<p>Here is an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Carrots</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<p>And an unordered task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Create a sample markdown document</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Add task lists to it</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Take a vacation</li>\n</ul>\n\n<p>And a “mixed” task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Steal underpants</li>\n <li class=\"task-list-item\">[ ]</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Profit!</li>\n</ul>\n\n<p>And a nested list:</p>\n\n<ul>\n <li>Fruits\n <ul>\n <li>Apple</li>\n <li>Banana</li>\n <li>Cherry</li>\n <li>Grape</li>\n <li>Orange</li>\n </ul>\n </li>\n <li>Tools\n <ul>\n <li>Hammer</li>\n <li>Screwdriver</li>\n <li>Wrench</li>\n <li>Pliers</li>\n </ul>\n </li>\n</ul>\n\n<p>Definition lists can be used with HTML syntax. Definition terms are <strong>bold and italic</strong>.</p>\n\n<dl>\n <dt>Name</dt>\n <dd>Godzilla</dd>\n <dt>Born</dt>\n <dd>1952</dd>\n <dt>Birthplace</dt>\n <dd>Japan</dd>\n <dt>Color</dt>\n <dd>Green</dd>\n</dl>\n\n<hr />\n\n<p>Tables should have bold headings and alternating shaded rows.</p>\n\n<table>\n <thead>\n <tr>\n <th>Artist</th>\n <th>Album</th>\n <th>Year</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>David Bowie</td>\n <td>Scary Monsters</td>\n <td>1980</td>\n </tr>\n <tr>\n <td>Prince</td>\n <td>Purple Rain</td>\n <td>1982</td>\n </tr>\n <tr>\n <td>Beastie Boys</td>\n <td>License to Ill</td>\n <td>1986</td>\n </tr>\n <tr>\n <td>Janet Jackson</td>\n <td>Rhythm Nation 1814</td>\n <td>1989</td>\n </tr>\n </tbody>\n</table>\n\n<p>If a table is too wide, it should condense down and/or scroll horizontally.</p>\n\n<table>\n <thead>\n <tr>\n <th>Item</th>\n <th>Description</th>\n <th>Color</th>\n <th>Size</th>\n <th>Material</th>\n <th>Weight</th>\n <th>Price</th>\n <th>Rating</th>\n <th>Stock</th>\n <th>Notes</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>Office chair</td>\n <td>Black</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>12kg</td>\n <td>$120</td>\n <td>4.5</td>\n <td>Yes</td>\n <td>Adjustable height</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>Dining table</td>\n <td>Brown</td>\n <td>Large</td>\n <td>Wood</td>\n <td>30kg</td>\n <td>$450</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Seats six</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>Desk lamp</td>\n <td>White</td>\n <td>Small</td>\n <td>Metal</td>\n <td>2kg</td>\n <td>$35</td>\n <td>4.2</td>\n <td>No</td>\n <td>LED light included</td>\n </tr>\n <tr>\n <td>Sofa</td>\n <td>Living room sofa</td>\n <td>Gray</td>\n <td>Large</td>\n <td>Fabric</td>\n <td>45kg</td>\n <td>$780</td>\n <td>4.8</td>\n <td>Yes</td>\n <td>Three seats</td>\n </tr>\n <tr>\n <td>Shelf</td>\n <td>Wall shelf</td>\n <td>Oak</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>8kg</td>\n <td>$60</td>\n <td>4.6</td>\n <td>Yes</td>\n <td>Easy to install</td>\n </tr>\n <tr>\n <td>Bed</td>\n <td>Queen bed frame</td>\n <td>Black</td>\n <td>Large</td>\n <td>Metal</td>\n <td>40kg</td>\n <td>$550</td>\n <td>4.9</td>\n <td>Yes</td>\n <td>Mattress not included</td>\n </tr>\n <tr>\n <td>Mirror</td>\n <td>Wall mirror</td>\n <td>Silver</td>\n <td>Medium</td>\n <td>Glass</td>\n <td>5kg</td>\n <td>$90</td>\n <td>4.3</td>\n <td>Yes</td>\n <td>Comes with mounting kit</td>\n </tr>\n <tr>\n <td>Rug</td>\n <td>Area rug</td>\n <td>Beige</td>\n <td>Large</td>\n <td>Wool</td>\n <td>10kg</td>\n <td>$300</td>\n <td>4.4</td>\n <td>No</td>\n <td>Hand-woven</td>\n </tr>\n <tr>\n <td>Cabinet</td>\n <td>Storage cabinet</td>\n <td>White</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>20kg</td>\n <td>$250</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Multiple compartments</td>\n </tr>\n <tr>\n <td>Fan</td>\n <td>Standing fan</td>\n <td>Gray</td>\n <td>Medium</td>\n <td>Plastic</td>\n <td>4kg</td>\n <td>$80</td>\n <td>4.1</td>\n <td>Yes</td>\n <td>Adjustable speed settings</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>Code snippets like <code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code> can be shown inline.</p>\n\n<p>Also, <code class=\"language-plaintext highlighter-rouge\">this should vertically align</code> <code>with this</code> <code>and this</code>.</p>\n\n<p>Code can also be shown in a block element.</p>\n\n<p>$ a * b = c ^ b $</p>\n\n<p>$ 2^{\\frac{n-1}{3}} $</p>\n\n<p>$ \\int_a^b f(x)\\,dx. $</p>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span><span class=\"k\">using</span> <span class=\"k\">namespace</span> <span class=\"n\">std</span><span class=\"p\">;</span>\n\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n<span class=\"c1\">// prints 'Hi, Tom' to STDOUT.</span>\n</code></pre></div></div>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">class</span> <span class=\"nc\">Person</span><span class=\"p\">:</span>\n <span class=\"k\">def</span> <span class=\"nf\">__init__</span><span class=\"p\">(</span><span class=\"bp\">self</span><span class=\"p\">,</span> <span class=\"n\">name</span><span class=\"p\">,</span> <span class=\"n\">age</span><span class=\"p\">):</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">name</span> <span class=\"o\">=</span> <span class=\"n\">name</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">age</span> <span class=\"o\">=</span> <span class=\"n\">age</span>\n\n<span class=\"n\">p1</span> <span class=\"o\">=</span> <span class=\"n\">Person</span><span class=\"p\">(</span><span class=\"s\">\"John\"</span><span class=\"p\">,</span> <span class=\"mi\">36</span><span class=\"p\">)</span>\n\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">name</span><span class=\"p\">)</span>\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">age</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<p>Inline code inside table cells should still be distinguishable.</p>\n\n<table>\n <thead>\n <tr>\n <th>Language</th>\n <th>Code</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>JavasScript</td>\n <td><code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code></td>\n </tr>\n <tr>\n <td>Ruby</td>\n <td><code class=\"language-plaintext highlighter-rouge\">foo = \"bar\"</code></td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>The <code class=\"language-plaintext highlighter-rouge\"><samp></code> HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: <code class=\"language-plaintext highlighter-rouge\">File not found</code>.</p>\n\n<hr />\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<p><code class=\"language-plaintext highlighter-rouge\">This is the final element on the page, and there should be no margin below this.</code></p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"style": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a topbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a topbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the topbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the topbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a topbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the topbar style.\",\"headline\":\"This is a topbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n<script>\n $(document).ready(function () {\n $('#expansion-btn').click(function () {\n $('.Extend').toggleClass('hide-sm');\n });\n });\n</script>\n<div class=\"Header position-sticky top-0 topbar\">\n <div class=\"flex-1\">\n <div class=\"d-flex\">\n <div class=\"Header-item\">\n <button id=\"expansion-btn\" class=\"btn-octicon mr-2 d-sm-none\"><span class=\"octicon octicon-three-bars-16\"></span></button>\n <a href=\"/github-pages-demo/\" class=\"Header-link h1 f4 d-flex flex-items-center\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </a>\n </div>\n <a href=\"/github-pages-demo/\" class=\"Header-item Header-link Header-item--full\">Jekyll Theme Profile</a>\n <div class=\"Header-item\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Header-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"Header-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"Header-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n <div class=\"d-flex\">\n <div class=\"Extend Header-item flex-column flex-sm-row flex-items-center width-full hide-sm\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a topbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the topbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a topbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+topbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F;t=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F%2F&title=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a stacked post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a stacked post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the stacked style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the stacked style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"twitter:title\" content=\"This is a stacked post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the stacked style.\",\"headline\":\"This is a stacked post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"Profile text-center mt-3\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 256px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n</div>\n<div class=\"Header d-flex z-2 position-sticky top-0 topbar\">\n <div class=\"Header-item flex-row flex-justify-center flex-1 hide-sm\">\n \n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-1 flex-sm-grow-0 flex-justify-start\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a stacked post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the stacked style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" class=\"cover-image rounded-2\" alt=\"This is a stacked post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+stacked+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F;t=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F%2F&title=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a sidebar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a sidebar post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the sidebar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the sidebar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"twitter:title\" content=\"This is a sidebar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the sidebar style.\",\"headline\":\"This is a sidebar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a sidebar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the sidebar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" class=\"cover-image rounded-2\" alt=\"This is a sidebar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+sidebar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F;t=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F%2F&title=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a appbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a appbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the appbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the appbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a appbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the appbar style.\",\"headline\":\"This is a appbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a appbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the appbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a appbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+appbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F;t=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F%2F&title=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
]
},
"collections": [
{
"directory": "/github/workspace/_docs",
"files": [
],
"relative_directory": "_docs",
"output": true,
"docs": [
"## Jekyll version\n\n<pre>{{ jekyll.version }}</pre>\n\n## Jekyll environment\n\n<pre>{{ jekyll.environment }}</pre>\n\n## Site Variables\n\n<pre>{{ site | inspect }}</pre>\n\n## Page Variables\n\n<pre>{{ page | inspect }}</pre>\n\n{% if paginator %}\n## Paginator Variables\n\n<pre>{{ paginator | inspect }}</pre>\n{% endif %}\n",
"This theme is based on GitHub's primer style. It supports both light and dark modes, and four style options: [appbar](/github-pages-demo/appbar/), [sidebar](/github-pages-demo/sidebar/), [stacked](/github-pages-demo/stacked/), and [topbar](/github-pages-demo/topbar/),.\n\n\n\n## Installation\n\nAdd this line to your Jekyll site's `Gemfile`:\n\n```ruby\ngem \"jekyll-theme-profile\"\n```\n\nAnd then execute:\n\n```shell\nbundle install\n```\n\nOr install it yourself as:\n\n```shell\ngem install jekyll-theme-profile\n```\n\n## Configuration\n\nAnd add this line to your Jekyll site's `_config.yml`:\n\n```yaml\ntheme: jekyll-theme-profile\nstyle: topbar # One of \"stacked\", \"sidebar\", \"topbar\", \"appbar\"\nrepository: PrimerPages/jekyll-theme-profile # for repository info to be included\nrepo_info: true # Show the information for the source of this project\nuser_metadata: true # Show the metadata associated with the user\nprofile_link: true # Show a link to the github profile for the user\n```\n\nOr you can start with a [sample config](https://github.com/PrimerPages/jekyll-theme-profile/blob/main/demo/_config.yml) that you can copy and customize.\n\n## Building\n\nBuild the site and make it available on a local server\n\n```shell\nbundle exec jekyll serve\n```\n",
"<div class=\"d-flex flex-wrap gutter\">\n <div class=\"d-flex flex-column col-12 col-sm-6 col-lg-4 col-xl-3 pb-4\">\n <div class=\"pt-2 mb-4 text-normal\">\n <ul class=\"list-style-none pl-0\">\n {% for doc in site.docs %}\n {% unless doc.url == page.url %}\n <li>\n <a class=\"pt-2\" href=\"{{ doc.url | relative_url }}\">{{ doc.title }}</a>\n </li>\n {% endunless %}\n {% endfor %}\n </ul>\n </div>\n </div>\n</div>\n",
"To add new posts, simply add a file in the `_posts` directory that follows the convention `YYYY-MM-DD-name-of-post.ext` and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.\n\nCheck out the [Jekyll docs][jekyll-docs] for more info on how to get the most out of Jekyll. File all bugs/feature requests at [Jekyll’s GitHub repo][jekyll-gh]. If you have questions, you can ask them on [Jekyll Talk][jekyll-talk].\n\n[jekyll-docs]: https://jekyllrb.com/docs/home\n[jekyll-gh]: https://github.com/jekyll/jekyll\n[jekyll-talk]: https://talk.jekyllrb.com/\n\n## Front matter\n\nAll blog posts must begin with front matter which is typically used to set a layout or other meta data. For a simple example, this can just be empty:\n\n```markdown\n---\nlayout: post\ntitle: \"welcome to Jekyll!\"\n---\n\n# Welcome\n\n**Hello world**, this is my first Jekyll blog post.\n\nI hope you like it!\n```\n\nHere's a list of variables for this theme\n\n| Variable | Description |\n|---|---|\n| `layout` | Specifies the layout file to use. Use the layout file name without the file extension. <br/><br/> Go to [docs](/github-pages-demo/docs/index.html) to learn about options |\n| `permalink` | If you need or processed blog post URLs to be something other than the site-wide default (`/year/month/day/title.html`), then you can set this variable and it will be used as the final URL |\n| `published` | Set to false if you don't want a specific post to show up when the site is generated |\n| `date` | A date here overrides the date from the name of the post. This can be used to ensure correct sorting of posts. A date is specified in the format `YYYY-MM-DD HH:MM:SS +/-TTTT`: hours, minutes,seconds, and timezone offset are optional |\n| `category` or `categories` | Instead of placing posts inside of folders, you can specify one or more categories that the post belongs to. When the site is generated the post will act as though it had been set with these categories normally. Categories (plural key) can be specified as a YAML list or a space-separated string |\n| `tags` | Similar to categories, one or multiple tags can be added to a post. Also like categories, tags can be specified as a YAML list or a space-separated string |\n| `description` | A longer description used for hte description meta tag |\n| `image` | URL to an image associated with the post for SEO |\n| `author` | Post-specific author information |\n| `locale` | Post-specific locale information |\n| `excerpt_separator` | You can access a snippet of a posts' content by using `excerpt` variable on a post. By default this is the first paragraph of content in the post, but can be customized by using `excerpt_separator`. <br/><br/>Example `excerpt_separator: <!--more-->` |\n\n\n## Including images and resources\n\nAt some point, you’ll want to include images, downloads, or other digital assets along with your text content. One common solution is to create a folder in the root of the project directory called something like `assets`, into which any images, files or other resources are placed. Then, from within any post, they can be linked to using the site’s root as the path for the asset to include. The best way to do this depends on the way your site’s (sub)domain and path are configured, but here are some simple examples in Markdown:\n\nIncluding an image asset in a post:\n\n```markdown\n... which is shown in the screenshot below:\n\n```\n\nLinking to a PDF for readers to download:\n\n```markdown\n... you can [get the PDF](/assets/mydoc.pdf) directly.\n```\n\n## Tags and Categories\n\nJekyll has first class support for *tags* and *categories* in blog posts.\n\n### Tags\n\nTags for a post are defined in the post’s front matter using either the key `tag` for a single entry or `tags` for multiple entries.\nSince Jekyll expects multiple items mapped to the key `tags`, it will automatically split a string entry if it contains whitespace. For example, while front matter `tag: classic hollywood` will be processed into a singular entity `\"classic hollywood\"`, front matter `tags: classic hollywood` will be processed into an array of entries `[\"classic\", \"hollywood\"]`.\n\nIrrespective of the front matter key chosen, Jekyll stores the metadata mapped to the plural key which is exposed to Liquid templates.\n\nBy default the theme will show posts related by tags or categories with the setting:\n\n```yaml\n# related\nrelated_by: \"tags or categories\"\n```\n\nThese show up as \"related posts\" underneath a post.\n\n### Categories\n\nCategories of a post work similar to the tags above:\n\n- They can be defined via the front matter using keys `category` or `categories` (that follow the same logic as for tags)\n- All categories registered in the site are exposed to Liquid templates via `site.categories` which can be iterated over (similar to the loop for tags above.)\n\n*The similarity between categories and tags however, ends there.*\n\nUnlike tags, categories for posts can also be defined by a post’s file path. Any directory above _posts will be read-in as a category. For example, if a post is at path `movies/horror/_posts/2019-05-21-bride-of-chucky.markdown`, then `movies` and `horror` are automatically registered as categories for that post.\n\nWhen the post also has front matter defining categories, they just get added to the existing list if not present already.\n\nThe hallmark difference between categories and tags is that categories of a post may be incorporated into the generated URL for the post, while tags cannot be.\n\nTherefore, depending on whether front matter has `category: classic hollywood`, or `categories: classic hollywood`, the example post above would have the URL as either `movies/horror/classic%20hollywood/2019/05/21/bride-of-chucky.html` or `movies/horror/classic/hollywood/2019/05/21/bride-of-chucky.html` respectively.\n\n"
],
"label": "docs",
"sort_by": "order"
},
{
"directory": "/github/workspace/_posts",
"files": [
],
"relative_directory": "_posts",
"output": true,
"docs": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Welcome to Jekyll! | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Welcome to Jekyll!\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<meta property=\"og:description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Welcome to Jekyll!\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\",\"headline\":\"Welcome to Jekyll!\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Welcome to Jekyll!</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Welcome to Jekyll!\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Welcome+to+Jekyll%21&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F;t=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F%2F&title=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n<p>To add new posts, simply add a file in the <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory that follows the convention <code class=\"language-plaintext highlighter-rouge\">YYYY-MM-DD-name-of-post.ext</code> and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.</p>\n\n<p>Check out the <a href=\"https://jekyllrb.com/docs/home\">Jekyll docs</a> for more info on how to get the most out of Jekyll. File all bugs/feature requests at <a href=\"https://github.com/jekyll/jekyll\">Jekyll’s GitHub repo</a>. If you have questions, you can ask them on <a href=\"https://talk.jekyllrb.com/\">Jekyll Talk</a>.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>. <a href=\"https://github.com\">Links</a> should be blue with no underlines (unless hovered over).</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<blockquote>\n <p>There should be no margin above this first sentence.\nBlockquotes should be a lighter gray with a gray border along the left side.\nThere should be no margin below this final sentence.</p>\n</blockquote>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th>What</th>\n <th>Follows</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>There’s a horizontal rule above and below this.</p>\n\n<hr />\n\n<p>Here is an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Carrots</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<p>And an unordered task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Create a sample markdown document</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Add task lists to it</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Take a vacation</li>\n</ul>\n\n<p>And a “mixed” task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Steal underpants</li>\n <li class=\"task-list-item\">[ ]</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Profit!</li>\n</ul>\n\n<p>And a nested list:</p>\n\n<ul>\n <li>Fruits\n <ul>\n <li>Apple</li>\n <li>Banana</li>\n <li>Cherry</li>\n <li>Grape</li>\n <li>Orange</li>\n </ul>\n </li>\n <li>Tools\n <ul>\n <li>Hammer</li>\n <li>Screwdriver</li>\n <li>Wrench</li>\n <li>Pliers</li>\n </ul>\n </li>\n</ul>\n\n<p>Definition lists can be used with HTML syntax. Definition terms are <strong>bold and italic</strong>.</p>\n\n<dl>\n <dt>Name</dt>\n <dd>Godzilla</dd>\n <dt>Born</dt>\n <dd>1952</dd>\n <dt>Birthplace</dt>\n <dd>Japan</dd>\n <dt>Color</dt>\n <dd>Green</dd>\n</dl>\n\n<hr />\n\n<p>Tables should have bold headings and alternating shaded rows.</p>\n\n<table>\n <thead>\n <tr>\n <th>Artist</th>\n <th>Album</th>\n <th>Year</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>David Bowie</td>\n <td>Scary Monsters</td>\n <td>1980</td>\n </tr>\n <tr>\n <td>Prince</td>\n <td>Purple Rain</td>\n <td>1982</td>\n </tr>\n <tr>\n <td>Beastie Boys</td>\n <td>License to Ill</td>\n <td>1986</td>\n </tr>\n <tr>\n <td>Janet Jackson</td>\n <td>Rhythm Nation 1814</td>\n <td>1989</td>\n </tr>\n </tbody>\n</table>\n\n<p>If a table is too wide, it should condense down and/or scroll horizontally.</p>\n\n<table>\n <thead>\n <tr>\n <th>Item</th>\n <th>Description</th>\n <th>Color</th>\n <th>Size</th>\n <th>Material</th>\n <th>Weight</th>\n <th>Price</th>\n <th>Rating</th>\n <th>Stock</th>\n <th>Notes</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>Office chair</td>\n <td>Black</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>12kg</td>\n <td>$120</td>\n <td>4.5</td>\n <td>Yes</td>\n <td>Adjustable height</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>Dining table</td>\n <td>Brown</td>\n <td>Large</td>\n <td>Wood</td>\n <td>30kg</td>\n <td>$450</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Seats six</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>Desk lamp</td>\n <td>White</td>\n <td>Small</td>\n <td>Metal</td>\n <td>2kg</td>\n <td>$35</td>\n <td>4.2</td>\n <td>No</td>\n <td>LED light included</td>\n </tr>\n <tr>\n <td>Sofa</td>\n <td>Living room sofa</td>\n <td>Gray</td>\n <td>Large</td>\n <td>Fabric</td>\n <td>45kg</td>\n <td>$780</td>\n <td>4.8</td>\n <td>Yes</td>\n <td>Three seats</td>\n </tr>\n <tr>\n <td>Shelf</td>\n <td>Wall shelf</td>\n <td>Oak</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>8kg</td>\n <td>$60</td>\n <td>4.6</td>\n <td>Yes</td>\n <td>Easy to install</td>\n </tr>\n <tr>\n <td>Bed</td>\n <td>Queen bed frame</td>\n <td>Black</td>\n <td>Large</td>\n <td>Metal</td>\n <td>40kg</td>\n <td>$550</td>\n <td>4.9</td>\n <td>Yes</td>\n <td>Mattress not included</td>\n </tr>\n <tr>\n <td>Mirror</td>\n <td>Wall mirror</td>\n <td>Silver</td>\n <td>Medium</td>\n <td>Glass</td>\n <td>5kg</td>\n <td>$90</td>\n <td>4.3</td>\n <td>Yes</td>\n <td>Comes with mounting kit</td>\n </tr>\n <tr>\n <td>Rug</td>\n <td>Area rug</td>\n <td>Beige</td>\n <td>Large</td>\n <td>Wool</td>\n <td>10kg</td>\n <td>$300</td>\n <td>4.4</td>\n <td>No</td>\n <td>Hand-woven</td>\n </tr>\n <tr>\n <td>Cabinet</td>\n <td>Storage cabinet</td>\n <td>White</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>20kg</td>\n <td>$250</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Multiple compartments</td>\n </tr>\n <tr>\n <td>Fan</td>\n <td>Standing fan</td>\n <td>Gray</td>\n <td>Medium</td>\n <td>Plastic</td>\n <td>4kg</td>\n <td>$80</td>\n <td>4.1</td>\n <td>Yes</td>\n <td>Adjustable speed settings</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>Code snippets like <code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code> can be shown inline.</p>\n\n<p>Also, <code class=\"language-plaintext highlighter-rouge\">this should vertically align</code> <code>with this</code> <code>and this</code>.</p>\n\n<p>Code can also be shown in a block element.</p>\n\n<p>$ a * b = c ^ b $</p>\n\n<p>$ 2^{\\frac{n-1}{3}} $</p>\n\n<p>$ \\int_a^b f(x)\\,dx. $</p>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span><span class=\"k\">using</span> <span class=\"k\">namespace</span> <span class=\"n\">std</span><span class=\"p\">;</span>\n\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n<span class=\"c1\">// prints 'Hi, Tom' to STDOUT.</span>\n</code></pre></div></div>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">class</span> <span class=\"nc\">Person</span><span class=\"p\">:</span>\n <span class=\"k\">def</span> <span class=\"nf\">__init__</span><span class=\"p\">(</span><span class=\"bp\">self</span><span class=\"p\">,</span> <span class=\"n\">name</span><span class=\"p\">,</span> <span class=\"n\">age</span><span class=\"p\">):</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">name</span> <span class=\"o\">=</span> <span class=\"n\">name</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">age</span> <span class=\"o\">=</span> <span class=\"n\">age</span>\n\n<span class=\"n\">p1</span> <span class=\"o\">=</span> <span class=\"n\">Person</span><span class=\"p\">(</span><span class=\"s\">\"John\"</span><span class=\"p\">,</span> <span class=\"mi\">36</span><span class=\"p\">)</span>\n\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">name</span><span class=\"p\">)</span>\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">age</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<p>Inline code inside table cells should still be distinguishable.</p>\n\n<table>\n <thead>\n <tr>\n <th>Language</th>\n <th>Code</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>JavasScript</td>\n <td><code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code></td>\n </tr>\n <tr>\n <td>Ruby</td>\n <td><code class=\"language-plaintext highlighter-rouge\">foo = \"bar\"</code></td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>The <code class=\"language-plaintext highlighter-rouge\"><samp></code> HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: <code class=\"language-plaintext highlighter-rouge\">File not found</code>.</p>\n\n<hr />\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<p><code class=\"language-plaintext highlighter-rouge\">This is the final element on the page, and there should be no margin below this.</code></p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Syntax highlighter | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Syntax highlighter\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"Below are some languages and their representative styles.\" />\n<meta property=\"og:description\" content=\"Below are some languages and their representative styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Syntax highlighter\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"Below are some languages and their representative styles.\",\"headline\":\"Syntax highlighter\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Syntax highlighter</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Syntax highlighter\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Syntax+highlighter&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F;t=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F%2F&title=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>Below are some languages and their representative styles.</p>\n\n<h2 id=\"ruby\">Ruby</h2>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">def</span> <span class=\"nf\">show</span>\n <span class=\"nb\">puts</span> <span class=\"s2\">\"Outputting a very lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong line\"</span>\n <span class=\"vi\">@widget</span> <span class=\"o\">=</span> <span class=\"no\">Widget</span><span class=\"p\">(</span><span class=\"n\">params</span><span class=\"p\">[</span><span class=\"ss\">:id</span><span class=\"p\">])</span>\n <span class=\"n\">respond_to</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"nb\">format</span><span class=\"o\">|</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">html</span> <span class=\"c1\"># show.html.erb</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">json</span> <span class=\"p\">{</span> <span class=\"n\">render</span> <span class=\"ss\">json: </span><span class=\"vi\">@widget</span> <span class=\"p\">}</span>\n <span class=\"k\">end</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h2 id=\"php\">Php</h2>\n\n<div class=\"language-php highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\"><?php</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s2\">\"Hello </span><span class=\"si\">{</span><span class=\"nv\">$world</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">);</span>\n<span class=\"cp\">?></span>\n</code></pre></div></div>\n\n<h2 id=\"java\">Java</h2>\n\n<div class=\"language-java highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kd\">public</span> <span class=\"kd\">class</span> <span class=\"nc\">java</span> <span class=\"o\">{</span>\n <span class=\"kd\">public</span> <span class=\"kd\">static</span> <span class=\"kt\">void</span> <span class=\"nf\">main</span><span class=\"o\">(</span><span class=\"nc\">String</span><span class=\"o\">[]</span> <span class=\"n\">args</span><span class=\"o\">)</span> <span class=\"o\">{</span>\n <span class=\"nc\">System</span><span class=\"o\">.</span><span class=\"na\">out</span><span class=\"o\">.</span><span class=\"na\">println</span><span class=\"o\">(</span><span class=\"s\">\"Hello World\"</span><span class=\"o\">);</span>\n <span class=\"o\">}</span>\n<span class=\"o\">}</span>\n</code></pre></div></div>\n\n<h3 id=\"html\">HTML</h3>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><html></span>\n <span class=\"nt\"><head><title></span>Title!<span class=\"nt\"></title></head></span>\n <span class=\"nt\"><body></span>\n <span class=\"nt\"><p</span> <span class=\"na\">id=</span><span class=\"s\">\"foo\"</span><span class=\"nt\">></span>Hello, World!<span class=\"nt\"></p></span>\n <span class=\"nt\"><script </span><span class=\"na\">type=</span><span class=\"s\">\"text/javascript\"</span><span class=\"nt\">></span><span class=\"kd\">var</span> <span class=\"nx\">a</span> <span class=\"o\">=</span> <span class=\"mi\">1</span><span class=\"p\">;</span><span class=\"nt\"></script></span>\n <span class=\"nt\"><style </span><span class=\"na\">type=</span><span class=\"s\">\"text/css\"</span><span class=\"nt\">></span><span class=\"nf\">#foo</span> <span class=\"p\">{</span> <span class=\"nl\">font-weight</span><span class=\"p\">:</span> <span class=\"nb\">bold</span><span class=\"p\">;</span> <span class=\"p\">}</span><span class=\"nt\"></style></span>\n <span class=\"nt\"></body></span>\n<span class=\"nt\"></html></span>\n</code></pre></div></div>\n\n<h2 id=\"console\">Console</h2>\n\n<div class=\"language-console highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"gp\">#</span><span class=\"w\"> </span>prints <span class=\"s2\">\"hello, world\"</span> to the screen\n<span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"nb\">echo </span>Hello, World\n<span class=\"go\">Hello, World\n\n</span><span class=\"gp\">#</span><span class=\"w\"> </span>don<span class=\"s1\">'t run this\n</span><span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"s1\">rm -rf --no-preserve-root /\n</span></code></pre></div></div>\n\n<h2 id=\"css\">Css</h2>\n\n<div class=\"language-css highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\">body</span> <span class=\"p\">{</span>\n <span class=\"nl\">font-size</span><span class=\"p\">:</span> <span class=\"m\">12pt</span><span class=\"p\">;</span>\n <span class=\"nl\">background</span><span class=\"p\">:</span> <span class=\"m\">#fff</span> <span class=\"sx\">url(temp.png)</span> <span class=\"nb\">top</span> <span class=\"nb\">left</span> <span class=\"nb\">no-repeat</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"yaml\">Yaml</h2>\n\n<div class=\"language-yaml highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nn\">---</span>\n<span class=\"na\">one</span><span class=\"pi\">:</span> <span class=\"s\">Apple</span>\n<span class=\"na\">two</span><span class=\"pi\">:</span> <span class=\"s\">Banana</span>\n<span class=\"na\">three</span><span class=\"pi\">:</span> <span class=\"s\">Cherry</span>\n</code></pre></div></div>\n\n<h2 id=\"c\">C++</h2>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span>\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"c1\">// Outputs Hello World to screen.</span>\n <span class=\"n\">std</span><span class=\"o\">::</span><span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"python\">Python</h2>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kn\">import</span> <span class=\"nn\">sys</span>\n\n<span class=\"k\">def</span> <span class=\"nf\">my_function</span><span class=\"p\">():</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s\">\"Hello from a function\"</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<h2 id=\"using-liquid\">Using liquid</h2>\n\n<h3 id=\"without-line-numbers\">Without line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span></code></pre></figure>\n\n<h3 id=\"with-line-numbers\">With line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><table class=\"rouge-table\"><tbody><tr><td class=\"gutter gl\"><pre class=\"lineno\">1\n2\n</pre></td><td class=\"code\"><pre><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span>\n</pre></td></tr></tbody></table></code></pre></figure>\n\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a basic post with various styles.\" />\n<meta property=\"og:description\" content=\"This is an example of a basic post with various styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"This is an example of a basic post with various styles.\",\"headline\":\"Test post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F;t=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F%2F&title=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is an example of a basic post with various styles.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>.</p>\n\n<p><a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Link to another post</a>.</p>\n\n<p>There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.</p>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header.</p>\n\n <p>When something is important enough, you do it even if the odds are not in your favor.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<div class=\"language-js highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\">// Javascript code with syntax highlighting.</span>\n<span class=\"kd\">var</span> <span class=\"nx\">fun</span> <span class=\"o\">=</span> <span class=\"kd\">function</span> <span class=\"nx\">lang</span><span class=\"p\">(</span><span class=\"nx\">l</span><span class=\"p\">)</span> <span class=\"p\">{</span>\n <span class=\"nx\">dateformat</span><span class=\"p\">.</span><span class=\"nx\">i18n</span> <span class=\"o\">=</span> <span class=\"nx\">require</span><span class=\"p\">(</span><span class=\"dl\">'</span><span class=\"s1\">./lang/</span><span class=\"dl\">'</span> <span class=\"o\">+</span> <span class=\"nx\">l</span><span class=\"p\">)</span>\n <span class=\"k\">return</span> <span class=\"kc\">true</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\"># Ruby code with syntax highlighting</span>\n<span class=\"no\">GitHubPages</span><span class=\"o\">::</span><span class=\"no\">Dependencies</span><span class=\"p\">.</span><span class=\"nf\">gems</span><span class=\"p\">.</span><span class=\"nf\">each</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"n\">version</span><span class=\"o\">|</span>\n <span class=\"n\">s</span><span class=\"p\">.</span><span class=\"nf\">add_dependency</span><span class=\"p\">(</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"s2\">\"= </span><span class=\"si\">#{</span><span class=\"n\">version</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">)</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th style=\"text-align: left\">head1</th>\n <th style=\"text-align: left\">head two</th>\n <th style=\"text-align: left\">three</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good swedish fish</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">out of stock</td>\n <td style=\"text-align: left\">good and plenty</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good cookies</td>\n <td style=\"text-align: left\">good</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good licorice</td>\n <td style=\"text-align: left\">yum</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"theres-a-horizontal-rule-below-this\">There’s a horizontal rule below this.</h3>\n\n<hr />\n\n<h3 id=\"here-is-an-unordered-list\">Here is an unordered list:</h3>\n\n<ul>\n <li>Item foo</li>\n <li>Item bar</li>\n <li>Item baz</li>\n <li>Item zip</li>\n</ul>\n\n<h3 id=\"and-an-ordered-list\">And an ordered list:</h3>\n\n<ol>\n <li>Item one</li>\n <li>Item two</li>\n <li>Item three</li>\n <li>Item four</li>\n</ol>\n\n<h3 id=\"and-a-nested-list\">And a nested list:</h3>\n\n<ul>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item\n <ul>\n <li>level 3 item</li>\n <li>level 3 item</li>\n </ul>\n </li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item</li>\n</ul>\n\n<h3 id=\"small-image\">Small image</h3>\n\n<p><img src=\"https://github.githubassets.com/images/icons/emoji/octocat.png\" alt=\"Octocat\" /></p>\n\n<h3 id=\"large-image\">Large image</h3>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Branching\" /></p>\n\n<h3 id=\"definition-lists-can-be-used-with-html-syntax\">Definition lists can be used with HTML syntax.</h3>\n\n<dl>\n<dt>Name</dt>\n<dd>Godzilla</dd>\n<dt>Born</dt>\n<dd>1952</dd>\n<dt>Birthplace</dt>\n<dd>Japan</dd>\n<dt>Color</dt>\n<dd>Green</dd>\n</dl>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.\n</code></pre></div></div>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>The final element.\n</code></pre></div></div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test short post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test short post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<meta property=\"og:description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-30T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test short post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-30T00:00:00+00:00\",\"datePublished\":\"2019-01-30T00:00:00+00:00\",\"description\":\"This is a short post. It should show up on the timeline without a “continue” option.\",\"headline\":\"Test short post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test short post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test short post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 30, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+short+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F;t=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F%2F&title=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a appbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a appbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the appbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the appbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a appbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the appbar style.\",\"headline\":\"This is a appbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a appbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the appbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a appbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+appbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F;t=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F%2F&title=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a sidebar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a sidebar post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the sidebar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the sidebar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"twitter:title\" content=\"This is a sidebar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the sidebar style.\",\"headline\":\"This is a sidebar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a sidebar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the sidebar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" class=\"cover-image rounded-2\" alt=\"This is a sidebar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+sidebar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F;t=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F%2F&title=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a stacked post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a stacked post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the stacked style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the stacked style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"twitter:title\" content=\"This is a stacked post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the stacked style.\",\"headline\":\"This is a stacked post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"Profile text-center mt-3\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 256px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n</div>\n<div class=\"Header d-flex z-2 position-sticky top-0 topbar\">\n <div class=\"Header-item flex-row flex-justify-center flex-1 hide-sm\">\n \n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-1 flex-sm-grow-0 flex-justify-start\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a stacked post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the stacked style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" class=\"cover-image rounded-2\" alt=\"This is a stacked post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+stacked+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F;t=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F%2F&title=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a topbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a topbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the topbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the topbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a topbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the topbar style.\",\"headline\":\"This is a topbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n<script>\n $(document).ready(function () {\n $('#expansion-btn').click(function () {\n $('.Extend').toggleClass('hide-sm');\n });\n });\n</script>\n<div class=\"Header position-sticky top-0 topbar\">\n <div class=\"flex-1\">\n <div class=\"d-flex\">\n <div class=\"Header-item\">\n <button id=\"expansion-btn\" class=\"btn-octicon mr-2 d-sm-none\"><span class=\"octicon octicon-three-bars-16\"></span></button>\n <a href=\"/github-pages-demo/\" class=\"Header-link h1 f4 d-flex flex-items-center\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </a>\n </div>\n <a href=\"/github-pages-demo/\" class=\"Header-item Header-link Header-item--full\">Jekyll Theme Profile</a>\n <div class=\"Header-item\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Header-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"Header-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"Header-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n <div class=\"d-flex\">\n <div class=\"Extend Header-item flex-column flex-sm-row flex-items-center width-full hide-sm\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a topbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the topbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a topbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+topbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F;t=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F%2F&title=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with image | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with image\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-11-21T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"twitter:title\" content=\"Empty post with image\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-11-21T00:00:00+00:00\",\"datePublished\":\"2023-11-21T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with image\",\"image\":\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with image</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" class=\"cover-image rounded-2\" alt=\"Empty post with image\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Nov 21, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+image&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F;t=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F%2F&title=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with video | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with video\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-12-14T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Empty post with video\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-12-14T00:00:00+00:00\",\"datePublished\":\"2023-12-14T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with video\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with video</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Empty post with video\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Dec 14, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+video&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F;t=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F%2F&title=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <div id=\"Timeline-video-container\" class=\"image-container mb-5\">\n <iframe id=\"Timeline-video\" src=\"https://www.youtube.com/embed/E4WlUXrJgy4?si=BhUjhwehMIZME9Cf\" frameborder=\"0\" height=\"inherited\"\n width=\"inherited\"></iframe>\n </div>\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"label": "posts",
"permalink": "/:categories/:year/:month/:day/:title/"
}
],
"html_pages": [
"## Welcome to another page\n\n_yay_\n",
"Text can be **bold**, *italic*, or ~~strikethrough~~. [Links](https://github.com) should be blue with no underlines (unless hovered over).\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\n> There should be no margin above this first sentence.\n> Blockquotes should be a lighter gray with a gray border along the left side.\n> There should be no margin below this final sentence.\n\n# Header 1\n\nThis is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n\n## Header 2\n\n> This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n### Header 3\n\n#### Header 4\n\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n\n##### Header 5\n\n1. This is an ordered list following a header.\n2. This is an ordered list following a header.\n3. This is an ordered list following a header.\n\n###### Header 6\n\n| What | Follows |\n|------------|------------|\n| A table | A header |\n| A table | A header |\n| A table | A header |\n\n---\n\nThere's a horizontal rule above and below this.\n\n---\n\nHere is an unordered list:\n\n- Apples\n- Bananas\n- Carrots\n\nAnd an ordered list:\n\n1. First item\n2. Second item\n3. Third item\n\nAnd an unordered task list:\n\n- [x] Create a sample markdown document\n- [ ] Add task lists to it\n- [ ] Take a vacation\n\nAnd a \"mixed\" task list:\n\n- [x] Steal underpants\n- [ ]\n- [x] Profit!\n\nAnd a nested list:\n\n- Fruits\n - Apple\n - Banana\n - Cherry\n - Grape\n - Orange\n- Tools\n - Hammer\n - Screwdriver\n - Wrench\n - Pliers\n\n\nDefinition lists can be used with HTML syntax. Definition terms are **bold and italic**.\n\nName\n: Godzilla\n\nBorn\n: 1952\n\nBirthplace\n: Japan\n\nColor\n: Green\n\n---\n\nTables should have bold headings and alternating shaded rows.\n\n| Artist | Album | Year |\n|---------------|----------------------|------|\n| David Bowie | Scary Monsters | 1980 |\n| Prince | Purple Rain | 1982 |\n| Beastie Boys | License to Ill | 1986 |\n| Janet Jackson | Rhythm Nation 1814 | 1989 |\n\nIf a table is too wide, it should condense down and/or scroll horizontally.\n\n| Item | Description | Color | Size | Material | Weight | Price | Rating | Stock | Notes |\n|--------------|------------------|-----------|---------|-----------|--------|--------|--------|-------|-------------------------------|\n| Chair | Office chair | Black | Medium | Wood | 12kg | $120 | 4.5 | Yes | Adjustable height |\n| Table | Dining table | Brown | Large | Wood | 30kg | $450 | 4.7 | Yes | Seats six |\n| Lamp | Desk lamp | White | Small | Metal | 2kg | $35 | 4.2 | No | LED light included |\n| Sofa | Living room sofa | Gray | Large | Fabric | 45kg | $780 | 4.8 | Yes | Three seats |\n| Shelf | Wall shelf | Oak | Medium | Wood | 8kg | $60 | 4.6 | Yes | Easy to install |\n| Bed | Queen bed frame | Black | Large | Metal | 40kg | $550 | 4.9 | Yes | Mattress not included |\n| Mirror | Wall mirror | Silver | Medium | Glass | 5kg | $90 | 4.3 | Yes | Comes with mounting kit |\n| Rug | Area rug | Beige | Large | Wool | 10kg | $300 | 4.4 | No | Hand-woven |\n| Cabinet | Storage cabinet | White | Medium | Wood | 20kg | $250 | 4.7 | Yes | Multiple compartments |\n| Fan | Standing fan | Gray | Medium | Plastic | 4kg | $80 | 4.1 | Yes | Adjustable speed settings |\n\n\n---\n\nCode snippets like `var foo = \"bar\";` can be shown inline.\n\nAlso, `this should vertically align` <code>with this</code> <code>and this</code>.\n\nCode can also be shown in a block element.\n\n\n$ a \\* b = c ^ b $\n\n$ 2^{\\frac{n-1}{3}} $\n\n$ \\int_a^b f(x)\\,dx. $\n\n```cpp\n#include <iostream>\nusing namespace std;\n\nint main() {\n cout << \"Hello World!\";\n return 0;\n}\n// prints 'Hi, Tom' to STDOUT.\n```\n\n```python\nclass Person:\n def __init__(self, name, age):\n self.name = name\n self.age = age\n\np1 = Person(\"John\", 36)\n\nprint(p1.name)\nprint(p1.age)\n```\n\nInline code inside table cells should still be distinguishable.\n\n| Language | Code |\n|-------------|-------------------|\n| JavasScript | `var foo = \"bar\";`|\n| Ruby | `foo = \"bar\"` |\n\n---\n\nThe `<samp>` HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: `File not found`.\n\n---\n\nSmall images should be shown at their actual size.\n\n\n\nLarge images should always scale down and fit in the content container.\n\n\n\nHere's a simple footnote,[^1] and here's a longer one.[^2]\n\n[^1]: This is the first footnote.\n\n[^2]: Here's one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n `my code`\n Add as many paragraphs as you like.\n\n`This is the final element on the page, and there should be no margin below this.`\n",
"",
"This is a appbar style page with a custom background and overlay.\n",
"This is a docs layout with a custom background image and overlay.\n",
"This is a sidebar style page with custom background and overlay.\n",
"This is a stacked style page with a custom background and overlay.\n",
"This is a topbar style page with a custom background and overlay.\n",
"This is a custom background and overlay\n",
"This is a landing page with a custom header color.\n",
"This is a sidebar style page with a custom header color\n",
"This is a stacked page with a custom header color\n",
"This is a topbar style page with a custom header color\n",
"This is a landing layout with a custom header image.\n",
"This is a sidebar style page with a custom header image.\n",
"This is a stacked style page with a custom header image.\n",
"This is a topbar style page with a custom header image.\n",
"",
"## Jekyll version\n\n<pre>{{ jekyll.version }}</pre>\n\n## Jekyll environment\n\n<pre>{{ jekyll.environment }}</pre>\n\n## Site Variables\n\n<pre>{{ site | inspect }}</pre>\n\n## Page Variables\n\n<pre>{{ page | inspect }}</pre>\n\n{% if paginator %}\n## Paginator Variables\n\n<pre>{{ paginator | inspect }}</pre>\n{% endif %}\n",
"",
"",
"",
"# Welcome to jekyll-theme-profile theme!\n\nThis theme is based on GitHub's primer style. It supports both light and dark modes, and four style options: \n\n- [appbar](/github-pages-demo/appbar/)\n- [sidebar](/github-pages-demo/sidebar/)\n- [topbar](/github-pages-demo/topbar/)\n- [stacked](/github-pages-demo/stacked/)\n\nSetting up is a breeze, as it automatically populates your profile using your GitHub user info. Add custom links like Linktree and share engaging blog posts effortlessly.\n",
"",
"",
"",
"",
"",
"Text can be **bold**, *italic*, or ~~strikethrough~~. [Links](https://github.com) should be blue with no underlines (unless hovered over).\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\n> There should be no margin above this first sentence.\n> Blockquotes should be a lighter gray with a gray border along the left side.\n> There should be no margin below this final sentence.\n\n# Header 1\n\nThis is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n\n## Header 2\n\n> This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n### Header 3\n\n#### Header 4\n\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n\n##### Header 5\n\n1. This is an ordered list following a header.\n2. This is an ordered list following a header.\n3. This is an ordered list following a header.\n\n###### Header 6\n\n| What | Follows |\n|------------|------------|\n| A table | A header |\n| A table | A header |\n| A table | A header |\n\n---\n\nThere's a horizontal rule above and below this.\n\n---\n\nHere is an unordered list:\n\n- Apples\n- Bananas\n- Carrots\n\nAnd an ordered list:\n\n1. First item\n2. Second item\n3. Third item\n\nAnd an unordered task list:\n\n- [x] Create a sample markdown document\n- [ ] Add task lists to it\n- [ ] Take a vacation\n\nAnd a \"mixed\" task list:\n\n- [x] Steal underpants\n- [ ]\n- [x] Profit!\n\nAnd a nested list:\n\n- Fruits\n - Apple\n - Banana\n - Cherry\n - Grape\n - Orange\n- Tools\n - Hammer\n - Screwdriver\n - Wrench\n - Pliers\n\n\nDefinition lists can be used with HTML syntax. Definition terms are **bold and italic**.\n\nName\n: Godzilla\n\nBorn\n: 1952\n\nBirthplace\n: Japan\n\nColor\n: Green\n\n---\n\nTables should have bold headings and alternating shaded rows.\n\n| Artist | Album | Year |\n|---------------|----------------------|------|\n| David Bowie | Scary Monsters | 1980 |\n| Prince | Purple Rain | 1982 |\n| Beastie Boys | License to Ill | 1986 |\n| Janet Jackson | Rhythm Nation 1814 | 1989 |\n\nIf a table is too wide, it should condense down and/or scroll horizontally.\n\n| Item | Description | Color | Size | Material | Weight | Price | Rating | Stock | Notes |\n|--------------|------------------|-----------|---------|-----------|--------|--------|--------|-------|-------------------------------|\n| Chair | Office chair | Black | Medium | Wood | 12kg | $120 | 4.5 | Yes | Adjustable height |\n| Table | Dining table | Brown | Large | Wood | 30kg | $450 | 4.7 | Yes | Seats six |\n| Lamp | Desk lamp | White | Small | Metal | 2kg | $35 | 4.2 | No | LED light included |\n| Sofa | Living room sofa | Gray | Large | Fabric | 45kg | $780 | 4.8 | Yes | Three seats |\n| Shelf | Wall shelf | Oak | Medium | Wood | 8kg | $60 | 4.6 | Yes | Easy to install |\n| Bed | Queen bed frame | Black | Large | Metal | 40kg | $550 | 4.9 | Yes | Mattress not included |\n| Mirror | Wall mirror | Silver | Medium | Glass | 5kg | $90 | 4.3 | Yes | Comes with mounting kit |\n| Rug | Area rug | Beige | Large | Wool | 10kg | $300 | 4.4 | No | Hand-woven |\n| Cabinet | Storage cabinet | White | Medium | Wood | 20kg | $250 | 4.7 | Yes | Multiple compartments |\n| Fan | Standing fan | Gray | Medium | Plastic | 4kg | $80 | 4.1 | Yes | Adjustable speed settings |\n\n\n---\n\nCode snippets like `var foo = \"bar\";` can be shown inline.\n\nAlso, `this should vertically align` <code>with this</code> <code>and this</code>.\n\nCode can also be shown in a block element.\n\n\n$ a \\* b = c ^ b $\n\n$ 2^{\\frac{n-1}{3}} $\n\n$ \\int_a^b f(x)\\,dx. $\n\n```cpp\n#include <iostream>\nusing namespace std;\n\nint main() {\n cout << \"Hello World!\";\n return 0;\n}\n// prints 'Hi, Tom' to STDOUT.\n```\n\n```python\nclass Person:\n def __init__(self, name, age):\n self.name = name\n self.age = age\n\np1 = Person(\"John\", 36)\n\nprint(p1.name)\nprint(p1.age)\n```\n\nInline code inside table cells should still be distinguishable.\n\n| Language | Code |\n|-------------|-------------------|\n| JavasScript | `var foo = \"bar\";`|\n| Ruby | `foo = \"bar\"` |\n\n---\n\nThe `<samp>` HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: `File not found`.\n\n---\n\nSmall images should be shown at their actual size.\n\n\n\nLarge images should always scale down and fit in the content container.\n\n\n\nHere's a simple footnote,[^1] and here's a longer one.[^2]\n\n[^1]: This is the first footnote.\n\n[^2]: Here's one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n `my code`\n Add as many paragraphs as you like.\n\n`This is the final element on the page, and there should be no margin below this.`\n",
"",
"Text can be **bold**, *italic*, or ~~strikethrough~~. [Links](https://github.com) should be blue with no underlines (unless hovered over).\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\n> There should be no margin above this first sentence.\n> Blockquotes should be a lighter gray with a gray border along the left side.\n> There should be no margin below this final sentence.\n\n# Header 1\n\nThis is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n\n## Header 2\n\n> This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n### Header 3\n\n#### Header 4\n\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n\n##### Header 5\n\n1. This is an ordered list following a header.\n2. This is an ordered list following a header.\n3. This is an ordered list following a header.\n\n###### Header 6\n\n| What | Follows |\n|------------|------------|\n| A table | A header |\n| A table | A header |\n| A table | A header |\n\n---\n\nThere's a horizontal rule above and below this.\n\n---\n\nHere is an unordered list:\n\n- Apples\n- Bananas\n- Carrots\n\nAnd an ordered list:\n\n1. First item\n2. Second item\n3. Third item\n\nAnd an unordered task list:\n\n- [x] Create a sample markdown document\n- [ ] Add task lists to it\n- [ ] Take a vacation\n\nAnd a \"mixed\" task list:\n\n- [x] Steal underpants\n- [ ]\n- [x] Profit!\n\nAnd a nested list:\n\n- Fruits\n - Apple\n - Banana\n - Cherry\n - Grape\n - Orange\n- Tools\n - Hammer\n - Screwdriver\n - Wrench\n - Pliers\n\n\nDefinition lists can be used with HTML syntax. Definition terms are **bold and italic**.\n\nName\n: Godzilla\n\nBorn\n: 1952\n\nBirthplace\n: Japan\n\nColor\n: Green\n\n---\n\nTables should have bold headings and alternating shaded rows.\n\n| Artist | Album | Year |\n|---------------|----------------------|------|\n| David Bowie | Scary Monsters | 1980 |\n| Prince | Purple Rain | 1982 |\n| Beastie Boys | License to Ill | 1986 |\n| Janet Jackson | Rhythm Nation 1814 | 1989 |\n\nIf a table is too wide, it should condense down and/or scroll horizontally.\n\n| Item | Description | Color | Size | Material | Weight | Price | Rating | Stock | Notes |\n|--------------|------------------|-----------|---------|-----------|--------|--------|--------|-------|-------------------------------|\n| Chair | Office chair | Black | Medium | Wood | 12kg | $120 | 4.5 | Yes | Adjustable height |\n| Table | Dining table | Brown | Large | Wood | 30kg | $450 | 4.7 | Yes | Seats six |\n| Lamp | Desk lamp | White | Small | Metal | 2kg | $35 | 4.2 | No | LED light included |\n| Sofa | Living room sofa | Gray | Large | Fabric | 45kg | $780 | 4.8 | Yes | Three seats |\n| Shelf | Wall shelf | Oak | Medium | Wood | 8kg | $60 | 4.6 | Yes | Easy to install |\n| Bed | Queen bed frame | Black | Large | Metal | 40kg | $550 | 4.9 | Yes | Mattress not included |\n| Mirror | Wall mirror | Silver | Medium | Glass | 5kg | $90 | 4.3 | Yes | Comes with mounting kit |\n| Rug | Area rug | Beige | Large | Wool | 10kg | $300 | 4.4 | No | Hand-woven |\n| Cabinet | Storage cabinet | White | Medium | Wood | 20kg | $250 | 4.7 | Yes | Multiple compartments |\n| Fan | Standing fan | Gray | Medium | Plastic | 4kg | $80 | 4.1 | Yes | Adjustable speed settings |\n\n\n---\n\nCode snippets like `var foo = \"bar\";` can be shown inline.\n\nAlso, `this should vertically align` <code>with this</code> <code>and this</code>.\n\nCode can also be shown in a block element.\n\n\n$ a \\* b = c ^ b $\n\n$ 2^{\\frac{n-1}{3}} $\n\n$ \\int_a^b f(x)\\,dx. $\n\n```cpp\n#include <iostream>\nusing namespace std;\n\nint main() {\n cout << \"Hello World!\";\n return 0;\n}\n// prints 'Hi, Tom' to STDOUT.\n```\n\n```python\nclass Person:\n def __init__(self, name, age):\n self.name = name\n self.age = age\n\np1 = Person(\"John\", 36)\n\nprint(p1.name)\nprint(p1.age)\n```\n\nInline code inside table cells should still be distinguishable.\n\n| Language | Code |\n|-------------|-------------------|\n| JavasScript | `var foo = \"bar\";`|\n| Ruby | `foo = \"bar\"` |\n\n---\n\nThe `<samp>` HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: `File not found`.\n\n---\n\nSmall images should be shown at their actual size.\n\n\n\nLarge images should always scale down and fit in the content container.\n\n\n\nHere's a simple footnote,[^1] and here's a longer one.[^2]\n\n[^1]: This is the first footnote.\n\n[^2]: Here's one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n `my code`\n Add as many paragraphs as you like.\n\n`This is the final element on the page, and there should be no margin below this.`\n",
"",
"",
"Text can be **bold**, *italic*, or ~~strikethrough~~. [Links](https://github.com) should be blue with no underlines (unless hovered over).\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\n> There should be no margin above this first sentence.\n> Blockquotes should be a lighter gray with a gray border along the left side.\n> There should be no margin below this final sentence.\n\n# Header 1\n\nThis is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n\n## Header 2\n\n> This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n### Header 3\n\n#### Header 4\n\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n\n##### Header 5\n\n1. This is an ordered list following a header.\n2. This is an ordered list following a header.\n3. This is an ordered list following a header.\n\n###### Header 6\n\n| What | Follows |\n|------------|------------|\n| A table | A header |\n| A table | A header |\n| A table | A header |\n\n---\n\nThere's a horizontal rule above and below this.\n\n---\n\nHere is an unordered list:\n\n- Apples\n- Bananas\n- Carrots\n\nAnd an ordered list:\n\n1. First item\n2. Second item\n3. Third item\n\nAnd an unordered task list:\n\n- [x] Create a sample markdown document\n- [ ] Add task lists to it\n- [ ] Take a vacation\n\nAnd a \"mixed\" task list:\n\n- [x] Steal underpants\n- [ ]\n- [x] Profit!\n\nAnd a nested list:\n\n- Fruits\n - Apple\n - Banana\n - Cherry\n - Grape\n - Orange\n- Tools\n - Hammer\n - Screwdriver\n - Wrench\n - Pliers\n\n\nDefinition lists can be used with HTML syntax. Definition terms are **bold and italic**.\n\nName\n: Godzilla\n\nBorn\n: 1952\n\nBirthplace\n: Japan\n\nColor\n: Green\n\n---\n\nTables should have bold headings and alternating shaded rows.\n\n| Artist | Album | Year |\n|---------------|----------------------|------|\n| David Bowie | Scary Monsters | 1980 |\n| Prince | Purple Rain | 1982 |\n| Beastie Boys | License to Ill | 1986 |\n| Janet Jackson | Rhythm Nation 1814 | 1989 |\n\nIf a table is too wide, it should condense down and/or scroll horizontally.\n\n| Item | Description | Color | Size | Material | Weight | Price | Rating | Stock | Notes |\n|--------------|------------------|-----------|---------|-----------|--------|--------|--------|-------|-------------------------------|\n| Chair | Office chair | Black | Medium | Wood | 12kg | $120 | 4.5 | Yes | Adjustable height |\n| Table | Dining table | Brown | Large | Wood | 30kg | $450 | 4.7 | Yes | Seats six |\n| Lamp | Desk lamp | White | Small | Metal | 2kg | $35 | 4.2 | No | LED light included |\n| Sofa | Living room sofa | Gray | Large | Fabric | 45kg | $780 | 4.8 | Yes | Three seats |\n| Shelf | Wall shelf | Oak | Medium | Wood | 8kg | $60 | 4.6 | Yes | Easy to install |\n| Bed | Queen bed frame | Black | Large | Metal | 40kg | $550 | 4.9 | Yes | Mattress not included |\n| Mirror | Wall mirror | Silver | Medium | Glass | 5kg | $90 | 4.3 | Yes | Comes with mounting kit |\n| Rug | Area rug | Beige | Large | Wool | 10kg | $300 | 4.4 | No | Hand-woven |\n| Cabinet | Storage cabinet | White | Medium | Wood | 20kg | $250 | 4.7 | Yes | Multiple compartments |\n| Fan | Standing fan | Gray | Medium | Plastic | 4kg | $80 | 4.1 | Yes | Adjustable speed settings |\n\n\n---\n\nCode snippets like `var foo = \"bar\";` can be shown inline.\n\nAlso, `this should vertically align` <code>with this</code> <code>and this</code>.\n\nCode can also be shown in a block element.\n\n\n$ a \\* b = c ^ b $\n\n$ 2^{\\frac{n-1}{3}} $\n\n$ \\int_a^b f(x)\\,dx. $\n\n```cpp\n#include <iostream>\nusing namespace std;\n\nint main() {\n cout << \"Hello World!\";\n return 0;\n}\n// prints 'Hi, Tom' to STDOUT.\n```\n\n```python\nclass Person:\n def __init__(self, name, age):\n self.name = name\n self.age = age\n\np1 = Person(\"John\", 36)\n\nprint(p1.name)\nprint(p1.age)\n```\n\nInline code inside table cells should still be distinguishable.\n\n| Language | Code |\n|-------------|-------------------|\n| JavasScript | `var foo = \"bar\";`|\n| Ruby | `foo = \"bar\"` |\n\n---\n\nThe `<samp>` HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: `File not found`.\n\n---\n\nSmall images should be shown at their actual size.\n\n\n\nLarge images should always scale down and fit in the content container.\n\n\n\nHere's a simple footnote,[^1] and here's a longer one.[^2]\n\n[^1]: This is the first footnote.\n\n[^2]: Here's one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n `my code`\n Add as many paragraphs as you like.\n\n`This is the final element on the page, and there should be no margin below this.`\n",
"",
""
],
"documents": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Welcome to Jekyll! | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Welcome to Jekyll!\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<meta property=\"og:description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Welcome to Jekyll!\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\",\"headline\":\"Welcome to Jekyll!\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Welcome to Jekyll!</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Welcome to Jekyll!\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Welcome+to+Jekyll%21&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F;t=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F%2F&title=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n<p>To add new posts, simply add a file in the <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory that follows the convention <code class=\"language-plaintext highlighter-rouge\">YYYY-MM-DD-name-of-post.ext</code> and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.</p>\n\n<p>Check out the <a href=\"https://jekyllrb.com/docs/home\">Jekyll docs</a> for more info on how to get the most out of Jekyll. File all bugs/feature requests at <a href=\"https://github.com/jekyll/jekyll\">Jekyll’s GitHub repo</a>. If you have questions, you can ask them on <a href=\"https://talk.jekyllrb.com/\">Jekyll Talk</a>.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>. <a href=\"https://github.com\">Links</a> should be blue with no underlines (unless hovered over).</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<blockquote>\n <p>There should be no margin above this first sentence.\nBlockquotes should be a lighter gray with a gray border along the left side.\nThere should be no margin below this final sentence.</p>\n</blockquote>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th>What</th>\n <th>Follows</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>There’s a horizontal rule above and below this.</p>\n\n<hr />\n\n<p>Here is an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Carrots</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<p>And an unordered task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Create a sample markdown document</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Add task lists to it</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Take a vacation</li>\n</ul>\n\n<p>And a “mixed” task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Steal underpants</li>\n <li class=\"task-list-item\">[ ]</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Profit!</li>\n</ul>\n\n<p>And a nested list:</p>\n\n<ul>\n <li>Fruits\n <ul>\n <li>Apple</li>\n <li>Banana</li>\n <li>Cherry</li>\n <li>Grape</li>\n <li>Orange</li>\n </ul>\n </li>\n <li>Tools\n <ul>\n <li>Hammer</li>\n <li>Screwdriver</li>\n <li>Wrench</li>\n <li>Pliers</li>\n </ul>\n </li>\n</ul>\n\n<p>Definition lists can be used with HTML syntax. Definition terms are <strong>bold and italic</strong>.</p>\n\n<dl>\n <dt>Name</dt>\n <dd>Godzilla</dd>\n <dt>Born</dt>\n <dd>1952</dd>\n <dt>Birthplace</dt>\n <dd>Japan</dd>\n <dt>Color</dt>\n <dd>Green</dd>\n</dl>\n\n<hr />\n\n<p>Tables should have bold headings and alternating shaded rows.</p>\n\n<table>\n <thead>\n <tr>\n <th>Artist</th>\n <th>Album</th>\n <th>Year</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>David Bowie</td>\n <td>Scary Monsters</td>\n <td>1980</td>\n </tr>\n <tr>\n <td>Prince</td>\n <td>Purple Rain</td>\n <td>1982</td>\n </tr>\n <tr>\n <td>Beastie Boys</td>\n <td>License to Ill</td>\n <td>1986</td>\n </tr>\n <tr>\n <td>Janet Jackson</td>\n <td>Rhythm Nation 1814</td>\n <td>1989</td>\n </tr>\n </tbody>\n</table>\n\n<p>If a table is too wide, it should condense down and/or scroll horizontally.</p>\n\n<table>\n <thead>\n <tr>\n <th>Item</th>\n <th>Description</th>\n <th>Color</th>\n <th>Size</th>\n <th>Material</th>\n <th>Weight</th>\n <th>Price</th>\n <th>Rating</th>\n <th>Stock</th>\n <th>Notes</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>Office chair</td>\n <td>Black</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>12kg</td>\n <td>$120</td>\n <td>4.5</td>\n <td>Yes</td>\n <td>Adjustable height</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>Dining table</td>\n <td>Brown</td>\n <td>Large</td>\n <td>Wood</td>\n <td>30kg</td>\n <td>$450</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Seats six</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>Desk lamp</td>\n <td>White</td>\n <td>Small</td>\n <td>Metal</td>\n <td>2kg</td>\n <td>$35</td>\n <td>4.2</td>\n <td>No</td>\n <td>LED light included</td>\n </tr>\n <tr>\n <td>Sofa</td>\n <td>Living room sofa</td>\n <td>Gray</td>\n <td>Large</td>\n <td>Fabric</td>\n <td>45kg</td>\n <td>$780</td>\n <td>4.8</td>\n <td>Yes</td>\n <td>Three seats</td>\n </tr>\n <tr>\n <td>Shelf</td>\n <td>Wall shelf</td>\n <td>Oak</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>8kg</td>\n <td>$60</td>\n <td>4.6</td>\n <td>Yes</td>\n <td>Easy to install</td>\n </tr>\n <tr>\n <td>Bed</td>\n <td>Queen bed frame</td>\n <td>Black</td>\n <td>Large</td>\n <td>Metal</td>\n <td>40kg</td>\n <td>$550</td>\n <td>4.9</td>\n <td>Yes</td>\n <td>Mattress not included</td>\n </tr>\n <tr>\n <td>Mirror</td>\n <td>Wall mirror</td>\n <td>Silver</td>\n <td>Medium</td>\n <td>Glass</td>\n <td>5kg</td>\n <td>$90</td>\n <td>4.3</td>\n <td>Yes</td>\n <td>Comes with mounting kit</td>\n </tr>\n <tr>\n <td>Rug</td>\n <td>Area rug</td>\n <td>Beige</td>\n <td>Large</td>\n <td>Wool</td>\n <td>10kg</td>\n <td>$300</td>\n <td>4.4</td>\n <td>No</td>\n <td>Hand-woven</td>\n </tr>\n <tr>\n <td>Cabinet</td>\n <td>Storage cabinet</td>\n <td>White</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>20kg</td>\n <td>$250</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Multiple compartments</td>\n </tr>\n <tr>\n <td>Fan</td>\n <td>Standing fan</td>\n <td>Gray</td>\n <td>Medium</td>\n <td>Plastic</td>\n <td>4kg</td>\n <td>$80</td>\n <td>4.1</td>\n <td>Yes</td>\n <td>Adjustable speed settings</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>Code snippets like <code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code> can be shown inline.</p>\n\n<p>Also, <code class=\"language-plaintext highlighter-rouge\">this should vertically align</code> <code>with this</code> <code>and this</code>.</p>\n\n<p>Code can also be shown in a block element.</p>\n\n<p>$ a * b = c ^ b $</p>\n\n<p>$ 2^{\\frac{n-1}{3}} $</p>\n\n<p>$ \\int_a^b f(x)\\,dx. $</p>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span><span class=\"k\">using</span> <span class=\"k\">namespace</span> <span class=\"n\">std</span><span class=\"p\">;</span>\n\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n<span class=\"c1\">// prints 'Hi, Tom' to STDOUT.</span>\n</code></pre></div></div>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">class</span> <span class=\"nc\">Person</span><span class=\"p\">:</span>\n <span class=\"k\">def</span> <span class=\"nf\">__init__</span><span class=\"p\">(</span><span class=\"bp\">self</span><span class=\"p\">,</span> <span class=\"n\">name</span><span class=\"p\">,</span> <span class=\"n\">age</span><span class=\"p\">):</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">name</span> <span class=\"o\">=</span> <span class=\"n\">name</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">age</span> <span class=\"o\">=</span> <span class=\"n\">age</span>\n\n<span class=\"n\">p1</span> <span class=\"o\">=</span> <span class=\"n\">Person</span><span class=\"p\">(</span><span class=\"s\">\"John\"</span><span class=\"p\">,</span> <span class=\"mi\">36</span><span class=\"p\">)</span>\n\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">name</span><span class=\"p\">)</span>\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">age</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<p>Inline code inside table cells should still be distinguishable.</p>\n\n<table>\n <thead>\n <tr>\n <th>Language</th>\n <th>Code</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>JavasScript</td>\n <td><code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code></td>\n </tr>\n <tr>\n <td>Ruby</td>\n <td><code class=\"language-plaintext highlighter-rouge\">foo = \"bar\"</code></td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>The <code class=\"language-plaintext highlighter-rouge\"><samp></code> HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: <code class=\"language-plaintext highlighter-rouge\">File not found</code>.</p>\n\n<hr />\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<p><code class=\"language-plaintext highlighter-rouge\">This is the final element on the page, and there should be no margin below this.</code></p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Syntax highlighter | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Syntax highlighter\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"Below are some languages and their representative styles.\" />\n<meta property=\"og:description\" content=\"Below are some languages and their representative styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Syntax highlighter\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"Below are some languages and their representative styles.\",\"headline\":\"Syntax highlighter\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Syntax highlighter</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Syntax highlighter\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Syntax+highlighter&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F;t=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F%2F&title=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>Below are some languages and their representative styles.</p>\n\n<h2 id=\"ruby\">Ruby</h2>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">def</span> <span class=\"nf\">show</span>\n <span class=\"nb\">puts</span> <span class=\"s2\">\"Outputting a very lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong line\"</span>\n <span class=\"vi\">@widget</span> <span class=\"o\">=</span> <span class=\"no\">Widget</span><span class=\"p\">(</span><span class=\"n\">params</span><span class=\"p\">[</span><span class=\"ss\">:id</span><span class=\"p\">])</span>\n <span class=\"n\">respond_to</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"nb\">format</span><span class=\"o\">|</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">html</span> <span class=\"c1\"># show.html.erb</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">json</span> <span class=\"p\">{</span> <span class=\"n\">render</span> <span class=\"ss\">json: </span><span class=\"vi\">@widget</span> <span class=\"p\">}</span>\n <span class=\"k\">end</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h2 id=\"php\">Php</h2>\n\n<div class=\"language-php highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\"><?php</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s2\">\"Hello </span><span class=\"si\">{</span><span class=\"nv\">$world</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">);</span>\n<span class=\"cp\">?></span>\n</code></pre></div></div>\n\n<h2 id=\"java\">Java</h2>\n\n<div class=\"language-java highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kd\">public</span> <span class=\"kd\">class</span> <span class=\"nc\">java</span> <span class=\"o\">{</span>\n <span class=\"kd\">public</span> <span class=\"kd\">static</span> <span class=\"kt\">void</span> <span class=\"nf\">main</span><span class=\"o\">(</span><span class=\"nc\">String</span><span class=\"o\">[]</span> <span class=\"n\">args</span><span class=\"o\">)</span> <span class=\"o\">{</span>\n <span class=\"nc\">System</span><span class=\"o\">.</span><span class=\"na\">out</span><span class=\"o\">.</span><span class=\"na\">println</span><span class=\"o\">(</span><span class=\"s\">\"Hello World\"</span><span class=\"o\">);</span>\n <span class=\"o\">}</span>\n<span class=\"o\">}</span>\n</code></pre></div></div>\n\n<h3 id=\"html\">HTML</h3>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><html></span>\n <span class=\"nt\"><head><title></span>Title!<span class=\"nt\"></title></head></span>\n <span class=\"nt\"><body></span>\n <span class=\"nt\"><p</span> <span class=\"na\">id=</span><span class=\"s\">\"foo\"</span><span class=\"nt\">></span>Hello, World!<span class=\"nt\"></p></span>\n <span class=\"nt\"><script </span><span class=\"na\">type=</span><span class=\"s\">\"text/javascript\"</span><span class=\"nt\">></span><span class=\"kd\">var</span> <span class=\"nx\">a</span> <span class=\"o\">=</span> <span class=\"mi\">1</span><span class=\"p\">;</span><span class=\"nt\"></script></span>\n <span class=\"nt\"><style </span><span class=\"na\">type=</span><span class=\"s\">\"text/css\"</span><span class=\"nt\">></span><span class=\"nf\">#foo</span> <span class=\"p\">{</span> <span class=\"nl\">font-weight</span><span class=\"p\">:</span> <span class=\"nb\">bold</span><span class=\"p\">;</span> <span class=\"p\">}</span><span class=\"nt\"></style></span>\n <span class=\"nt\"></body></span>\n<span class=\"nt\"></html></span>\n</code></pre></div></div>\n\n<h2 id=\"console\">Console</h2>\n\n<div class=\"language-console highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"gp\">#</span><span class=\"w\"> </span>prints <span class=\"s2\">\"hello, world\"</span> to the screen\n<span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"nb\">echo </span>Hello, World\n<span class=\"go\">Hello, World\n\n</span><span class=\"gp\">#</span><span class=\"w\"> </span>don<span class=\"s1\">'t run this\n</span><span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"s1\">rm -rf --no-preserve-root /\n</span></code></pre></div></div>\n\n<h2 id=\"css\">Css</h2>\n\n<div class=\"language-css highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\">body</span> <span class=\"p\">{</span>\n <span class=\"nl\">font-size</span><span class=\"p\">:</span> <span class=\"m\">12pt</span><span class=\"p\">;</span>\n <span class=\"nl\">background</span><span class=\"p\">:</span> <span class=\"m\">#fff</span> <span class=\"sx\">url(temp.png)</span> <span class=\"nb\">top</span> <span class=\"nb\">left</span> <span class=\"nb\">no-repeat</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"yaml\">Yaml</h2>\n\n<div class=\"language-yaml highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nn\">---</span>\n<span class=\"na\">one</span><span class=\"pi\">:</span> <span class=\"s\">Apple</span>\n<span class=\"na\">two</span><span class=\"pi\">:</span> <span class=\"s\">Banana</span>\n<span class=\"na\">three</span><span class=\"pi\">:</span> <span class=\"s\">Cherry</span>\n</code></pre></div></div>\n\n<h2 id=\"c\">C++</h2>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span>\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"c1\">// Outputs Hello World to screen.</span>\n <span class=\"n\">std</span><span class=\"o\">::</span><span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"python\">Python</h2>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kn\">import</span> <span class=\"nn\">sys</span>\n\n<span class=\"k\">def</span> <span class=\"nf\">my_function</span><span class=\"p\">():</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s\">\"Hello from a function\"</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<h2 id=\"using-liquid\">Using liquid</h2>\n\n<h3 id=\"without-line-numbers\">Without line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span></code></pre></figure>\n\n<h3 id=\"with-line-numbers\">With line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><table class=\"rouge-table\"><tbody><tr><td class=\"gutter gl\"><pre class=\"lineno\">1\n2\n</pre></td><td class=\"code\"><pre><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span>\n</pre></td></tr></tbody></table></code></pre></figure>\n\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a basic post with various styles.\" />\n<meta property=\"og:description\" content=\"This is an example of a basic post with various styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"This is an example of a basic post with various styles.\",\"headline\":\"Test post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F;t=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F%2F&title=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is an example of a basic post with various styles.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>.</p>\n\n<p><a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Link to another post</a>.</p>\n\n<p>There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.</p>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header.</p>\n\n <p>When something is important enough, you do it even if the odds are not in your favor.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<div class=\"language-js highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\">// Javascript code with syntax highlighting.</span>\n<span class=\"kd\">var</span> <span class=\"nx\">fun</span> <span class=\"o\">=</span> <span class=\"kd\">function</span> <span class=\"nx\">lang</span><span class=\"p\">(</span><span class=\"nx\">l</span><span class=\"p\">)</span> <span class=\"p\">{</span>\n <span class=\"nx\">dateformat</span><span class=\"p\">.</span><span class=\"nx\">i18n</span> <span class=\"o\">=</span> <span class=\"nx\">require</span><span class=\"p\">(</span><span class=\"dl\">'</span><span class=\"s1\">./lang/</span><span class=\"dl\">'</span> <span class=\"o\">+</span> <span class=\"nx\">l</span><span class=\"p\">)</span>\n <span class=\"k\">return</span> <span class=\"kc\">true</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\"># Ruby code with syntax highlighting</span>\n<span class=\"no\">GitHubPages</span><span class=\"o\">::</span><span class=\"no\">Dependencies</span><span class=\"p\">.</span><span class=\"nf\">gems</span><span class=\"p\">.</span><span class=\"nf\">each</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"n\">version</span><span class=\"o\">|</span>\n <span class=\"n\">s</span><span class=\"p\">.</span><span class=\"nf\">add_dependency</span><span class=\"p\">(</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"s2\">\"= </span><span class=\"si\">#{</span><span class=\"n\">version</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">)</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th style=\"text-align: left\">head1</th>\n <th style=\"text-align: left\">head two</th>\n <th style=\"text-align: left\">three</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good swedish fish</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">out of stock</td>\n <td style=\"text-align: left\">good and plenty</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good cookies</td>\n <td style=\"text-align: left\">good</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good licorice</td>\n <td style=\"text-align: left\">yum</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"theres-a-horizontal-rule-below-this\">There’s a horizontal rule below this.</h3>\n\n<hr />\n\n<h3 id=\"here-is-an-unordered-list\">Here is an unordered list:</h3>\n\n<ul>\n <li>Item foo</li>\n <li>Item bar</li>\n <li>Item baz</li>\n <li>Item zip</li>\n</ul>\n\n<h3 id=\"and-an-ordered-list\">And an ordered list:</h3>\n\n<ol>\n <li>Item one</li>\n <li>Item two</li>\n <li>Item three</li>\n <li>Item four</li>\n</ol>\n\n<h3 id=\"and-a-nested-list\">And a nested list:</h3>\n\n<ul>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item\n <ul>\n <li>level 3 item</li>\n <li>level 3 item</li>\n </ul>\n </li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item</li>\n</ul>\n\n<h3 id=\"small-image\">Small image</h3>\n\n<p><img src=\"https://github.githubassets.com/images/icons/emoji/octocat.png\" alt=\"Octocat\" /></p>\n\n<h3 id=\"large-image\">Large image</h3>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Branching\" /></p>\n\n<h3 id=\"definition-lists-can-be-used-with-html-syntax\">Definition lists can be used with HTML syntax.</h3>\n\n<dl>\n<dt>Name</dt>\n<dd>Godzilla</dd>\n<dt>Born</dt>\n<dd>1952</dd>\n<dt>Birthplace</dt>\n<dd>Japan</dd>\n<dt>Color</dt>\n<dd>Green</dd>\n</dl>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.\n</code></pre></div></div>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>The final element.\n</code></pre></div></div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test short post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test short post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<meta property=\"og:description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-30T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test short post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-30T00:00:00+00:00\",\"datePublished\":\"2019-01-30T00:00:00+00:00\",\"description\":\"This is a short post. It should show up on the timeline without a “continue” option.\",\"headline\":\"Test short post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test short post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test short post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 30, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+short+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F;t=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F%2F&title=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a appbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a appbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the appbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the appbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a appbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the appbar style.\",\"headline\":\"This is a appbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a appbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the appbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a appbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+appbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F;t=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F%2F&title=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a sidebar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a sidebar post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the sidebar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the sidebar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"twitter:title\" content=\"This is a sidebar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the sidebar style.\",\"headline\":\"This is a sidebar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a sidebar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the sidebar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" class=\"cover-image rounded-2\" alt=\"This is a sidebar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+sidebar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F;t=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F%2F&title=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a stacked post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a stacked post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the stacked style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the stacked style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"twitter:title\" content=\"This is a stacked post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the stacked style.\",\"headline\":\"This is a stacked post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"Profile text-center mt-3\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 256px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n</div>\n<div class=\"Header d-flex z-2 position-sticky top-0 topbar\">\n <div class=\"Header-item flex-row flex-justify-center flex-1 hide-sm\">\n \n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-1 flex-sm-grow-0 flex-justify-start\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a stacked post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the stacked style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" class=\"cover-image rounded-2\" alt=\"This is a stacked post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+stacked+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F;t=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F%2F&title=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a topbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a topbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the topbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the topbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a topbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the topbar style.\",\"headline\":\"This is a topbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n<script>\n $(document).ready(function () {\n $('#expansion-btn').click(function () {\n $('.Extend').toggleClass('hide-sm');\n });\n });\n</script>\n<div class=\"Header position-sticky top-0 topbar\">\n <div class=\"flex-1\">\n <div class=\"d-flex\">\n <div class=\"Header-item\">\n <button id=\"expansion-btn\" class=\"btn-octicon mr-2 d-sm-none\"><span class=\"octicon octicon-three-bars-16\"></span></button>\n <a href=\"/github-pages-demo/\" class=\"Header-link h1 f4 d-flex flex-items-center\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </a>\n </div>\n <a href=\"/github-pages-demo/\" class=\"Header-item Header-link Header-item--full\">Jekyll Theme Profile</a>\n <div class=\"Header-item\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Header-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"Header-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"Header-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n <div class=\"d-flex\">\n <div class=\"Extend Header-item flex-column flex-sm-row flex-items-center width-full hide-sm\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a topbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the topbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a topbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+topbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F;t=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F%2F&title=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with image | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with image\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-11-21T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"twitter:title\" content=\"Empty post with image\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-11-21T00:00:00+00:00\",\"datePublished\":\"2023-11-21T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with image\",\"image\":\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with image</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" class=\"cover-image rounded-2\" alt=\"Empty post with image\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Nov 21, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+image&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F;t=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F%2F&title=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with video | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with video\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-12-14T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Empty post with video\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-12-14T00:00:00+00:00\",\"datePublished\":\"2023-12-14T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with video\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with video</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Empty post with video\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Dec 14, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+video&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F;t=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F%2F&title=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <div id=\"Timeline-video-container\" class=\"image-container mb-5\">\n <iframe id=\"Timeline-video\" src=\"https://www.youtube.com/embed/E4WlUXrJgy4?si=BhUjhwehMIZME9Cf\" frameborder=\"0\" height=\"inherited\"\n width=\"inherited\"></iframe>\n </div>\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"## Jekyll version\n\n<pre>{{ jekyll.version }}</pre>\n\n## Jekyll environment\n\n<pre>{{ jekyll.environment }}</pre>\n\n## Site Variables\n\n<pre>{{ site | inspect }}</pre>\n\n## Page Variables\n\n<pre>{{ page | inspect }}</pre>\n\n{% if paginator %}\n## Paginator Variables\n\n<pre>{{ paginator | inspect }}</pre>\n{% endif %}\n",
"This theme is based on GitHub's primer style. It supports both light and dark modes, and four style options: [appbar](/github-pages-demo/appbar/), [sidebar](/github-pages-demo/sidebar/), [stacked](/github-pages-demo/stacked/), and [topbar](/github-pages-demo/topbar/),.\n\n\n\n## Installation\n\nAdd this line to your Jekyll site's `Gemfile`:\n\n```ruby\ngem \"jekyll-theme-profile\"\n```\n\nAnd then execute:\n\n```shell\nbundle install\n```\n\nOr install it yourself as:\n\n```shell\ngem install jekyll-theme-profile\n```\n\n## Configuration\n\nAnd add this line to your Jekyll site's `_config.yml`:\n\n```yaml\ntheme: jekyll-theme-profile\nstyle: topbar # One of \"stacked\", \"sidebar\", \"topbar\", \"appbar\"\nrepository: PrimerPages/jekyll-theme-profile # for repository info to be included\nrepo_info: true # Show the information for the source of this project\nuser_metadata: true # Show the metadata associated with the user\nprofile_link: true # Show a link to the github profile for the user\n```\n\nOr you can start with a [sample config](https://github.com/PrimerPages/jekyll-theme-profile/blob/main/demo/_config.yml) that you can copy and customize.\n\n## Building\n\nBuild the site and make it available on a local server\n\n```shell\nbundle exec jekyll serve\n```\n",
"<div class=\"d-flex flex-wrap gutter\">\n <div class=\"d-flex flex-column col-12 col-sm-6 col-lg-4 col-xl-3 pb-4\">\n <div class=\"pt-2 mb-4 text-normal\">\n <ul class=\"list-style-none pl-0\">\n {% for doc in site.docs %}\n {% unless doc.url == page.url %}\n <li>\n <a class=\"pt-2\" href=\"{{ doc.url | relative_url }}\">{{ doc.title }}</a>\n </li>\n {% endunless %}\n {% endfor %}\n </ul>\n </div>\n </div>\n</div>\n",
"To add new posts, simply add a file in the `_posts` directory that follows the convention `YYYY-MM-DD-name-of-post.ext` and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.\n\nCheck out the [Jekyll docs][jekyll-docs] for more info on how to get the most out of Jekyll. File all bugs/feature requests at [Jekyll’s GitHub repo][jekyll-gh]. If you have questions, you can ask them on [Jekyll Talk][jekyll-talk].\n\n[jekyll-docs]: https://jekyllrb.com/docs/home\n[jekyll-gh]: https://github.com/jekyll/jekyll\n[jekyll-talk]: https://talk.jekyllrb.com/\n\n## Front matter\n\nAll blog posts must begin with front matter which is typically used to set a layout or other meta data. For a simple example, this can just be empty:\n\n```markdown\n---\nlayout: post\ntitle: \"welcome to Jekyll!\"\n---\n\n# Welcome\n\n**Hello world**, this is my first Jekyll blog post.\n\nI hope you like it!\n```\n\nHere's a list of variables for this theme\n\n| Variable | Description |\n|---|---|\n| `layout` | Specifies the layout file to use. Use the layout file name without the file extension. <br/><br/> Go to [docs](/github-pages-demo/docs/index.html) to learn about options |\n| `permalink` | If you need or processed blog post URLs to be something other than the site-wide default (`/year/month/day/title.html`), then you can set this variable and it will be used as the final URL |\n| `published` | Set to false if you don't want a specific post to show up when the site is generated |\n| `date` | A date here overrides the date from the name of the post. This can be used to ensure correct sorting of posts. A date is specified in the format `YYYY-MM-DD HH:MM:SS +/-TTTT`: hours, minutes,seconds, and timezone offset are optional |\n| `category` or `categories` | Instead of placing posts inside of folders, you can specify one or more categories that the post belongs to. When the site is generated the post will act as though it had been set with these categories normally. Categories (plural key) can be specified as a YAML list or a space-separated string |\n| `tags` | Similar to categories, one or multiple tags can be added to a post. Also like categories, tags can be specified as a YAML list or a space-separated string |\n| `description` | A longer description used for hte description meta tag |\n| `image` | URL to an image associated with the post for SEO |\n| `author` | Post-specific author information |\n| `locale` | Post-specific locale information |\n| `excerpt_separator` | You can access a snippet of a posts' content by using `excerpt` variable on a post. By default this is the first paragraph of content in the post, but can be customized by using `excerpt_separator`. <br/><br/>Example `excerpt_separator: <!--more-->` |\n\n\n## Including images and resources\n\nAt some point, you’ll want to include images, downloads, or other digital assets along with your text content. One common solution is to create a folder in the root of the project directory called something like `assets`, into which any images, files or other resources are placed. Then, from within any post, they can be linked to using the site’s root as the path for the asset to include. The best way to do this depends on the way your site’s (sub)domain and path are configured, but here are some simple examples in Markdown:\n\nIncluding an image asset in a post:\n\n```markdown\n... which is shown in the screenshot below:\n\n```\n\nLinking to a PDF for readers to download:\n\n```markdown\n... you can [get the PDF](/assets/mydoc.pdf) directly.\n```\n\n## Tags and Categories\n\nJekyll has first class support for *tags* and *categories* in blog posts.\n\n### Tags\n\nTags for a post are defined in the post’s front matter using either the key `tag` for a single entry or `tags` for multiple entries.\nSince Jekyll expects multiple items mapped to the key `tags`, it will automatically split a string entry if it contains whitespace. For example, while front matter `tag: classic hollywood` will be processed into a singular entity `\"classic hollywood\"`, front matter `tags: classic hollywood` will be processed into an array of entries `[\"classic\", \"hollywood\"]`.\n\nIrrespective of the front matter key chosen, Jekyll stores the metadata mapped to the plural key which is exposed to Liquid templates.\n\nBy default the theme will show posts related by tags or categories with the setting:\n\n```yaml\n# related\nrelated_by: \"tags or categories\"\n```\n\nThese show up as \"related posts\" underneath a post.\n\n### Categories\n\nCategories of a post work similar to the tags above:\n\n- They can be defined via the front matter using keys `category` or `categories` (that follow the same logic as for tags)\n- All categories registered in the site are exposed to Liquid templates via `site.categories` which can be iterated over (similar to the loop for tags above.)\n\n*The similarity between categories and tags however, ends there.*\n\nUnlike tags, categories for posts can also be defined by a post’s file path. Any directory above _posts will be read-in as a category. For example, if a post is at path `movies/horror/_posts/2019-05-21-bride-of-chucky.markdown`, then `movies` and `horror` are automatically registered as categories for that post.\n\nWhen the post also has front matter defining categories, they just get added to the existing list if not present already.\n\nThe hallmark difference between categories and tags is that categories of a post may be incorporated into the generated URL for the post, while tags cannot be.\n\nTherefore, depending on whether front matter has `category: classic hollywood`, or `categories: classic hollywood`, the example post above would have the URL as either `movies/horror/classic%20hollywood/2019/05/21/bride-of-chucky.html` or `movies/horror/classic/hollywood/2019/05/21/bride-of-chucky.html` respectively.\n\n"
],
"config": null,
"data": {
},
"pages": [
"## Welcome to another page\n\n_yay_\n",
"Text can be **bold**, *italic*, or ~~strikethrough~~. [Links](https://github.com) should be blue with no underlines (unless hovered over).\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\n> There should be no margin above this first sentence.\n> Blockquotes should be a lighter gray with a gray border along the left side.\n> There should be no margin below this final sentence.\n\n# Header 1\n\nThis is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n\n## Header 2\n\n> This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n### Header 3\n\n#### Header 4\n\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n\n##### Header 5\n\n1. This is an ordered list following a header.\n2. This is an ordered list following a header.\n3. This is an ordered list following a header.\n\n###### Header 6\n\n| What | Follows |\n|------------|------------|\n| A table | A header |\n| A table | A header |\n| A table | A header |\n\n---\n\nThere's a horizontal rule above and below this.\n\n---\n\nHere is an unordered list:\n\n- Apples\n- Bananas\n- Carrots\n\nAnd an ordered list:\n\n1. First item\n2. Second item\n3. Third item\n\nAnd an unordered task list:\n\n- [x] Create a sample markdown document\n- [ ] Add task lists to it\n- [ ] Take a vacation\n\nAnd a \"mixed\" task list:\n\n- [x] Steal underpants\n- [ ]\n- [x] Profit!\n\nAnd a nested list:\n\n- Fruits\n - Apple\n - Banana\n - Cherry\n - Grape\n - Orange\n- Tools\n - Hammer\n - Screwdriver\n - Wrench\n - Pliers\n\n\nDefinition lists can be used with HTML syntax. Definition terms are **bold and italic**.\n\nName\n: Godzilla\n\nBorn\n: 1952\n\nBirthplace\n: Japan\n\nColor\n: Green\n\n---\n\nTables should have bold headings and alternating shaded rows.\n\n| Artist | Album | Year |\n|---------------|----------------------|------|\n| David Bowie | Scary Monsters | 1980 |\n| Prince | Purple Rain | 1982 |\n| Beastie Boys | License to Ill | 1986 |\n| Janet Jackson | Rhythm Nation 1814 | 1989 |\n\nIf a table is too wide, it should condense down and/or scroll horizontally.\n\n| Item | Description | Color | Size | Material | Weight | Price | Rating | Stock | Notes |\n|--------------|------------------|-----------|---------|-----------|--------|--------|--------|-------|-------------------------------|\n| Chair | Office chair | Black | Medium | Wood | 12kg | $120 | 4.5 | Yes | Adjustable height |\n| Table | Dining table | Brown | Large | Wood | 30kg | $450 | 4.7 | Yes | Seats six |\n| Lamp | Desk lamp | White | Small | Metal | 2kg | $35 | 4.2 | No | LED light included |\n| Sofa | Living room sofa | Gray | Large | Fabric | 45kg | $780 | 4.8 | Yes | Three seats |\n| Shelf | Wall shelf | Oak | Medium | Wood | 8kg | $60 | 4.6 | Yes | Easy to install |\n| Bed | Queen bed frame | Black | Large | Metal | 40kg | $550 | 4.9 | Yes | Mattress not included |\n| Mirror | Wall mirror | Silver | Medium | Glass | 5kg | $90 | 4.3 | Yes | Comes with mounting kit |\n| Rug | Area rug | Beige | Large | Wool | 10kg | $300 | 4.4 | No | Hand-woven |\n| Cabinet | Storage cabinet | White | Medium | Wood | 20kg | $250 | 4.7 | Yes | Multiple compartments |\n| Fan | Standing fan | Gray | Medium | Plastic | 4kg | $80 | 4.1 | Yes | Adjustable speed settings |\n\n\n---\n\nCode snippets like `var foo = \"bar\";` can be shown inline.\n\nAlso, `this should vertically align` <code>with this</code> <code>and this</code>.\n\nCode can also be shown in a block element.\n\n\n$ a \\* b = c ^ b $\n\n$ 2^{\\frac{n-1}{3}} $\n\n$ \\int_a^b f(x)\\,dx. $\n\n```cpp\n#include <iostream>\nusing namespace std;\n\nint main() {\n cout << \"Hello World!\";\n return 0;\n}\n// prints 'Hi, Tom' to STDOUT.\n```\n\n```python\nclass Person:\n def __init__(self, name, age):\n self.name = name\n self.age = age\n\np1 = Person(\"John\", 36)\n\nprint(p1.name)\nprint(p1.age)\n```\n\nInline code inside table cells should still be distinguishable.\n\n| Language | Code |\n|-------------|-------------------|\n| JavasScript | `var foo = \"bar\";`|\n| Ruby | `foo = \"bar\"` |\n\n---\n\nThe `<samp>` HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: `File not found`.\n\n---\n\nSmall images should be shown at their actual size.\n\n\n\nLarge images should always scale down and fit in the content container.\n\n\n\nHere's a simple footnote,[^1] and here's a longer one.[^2]\n\n[^1]: This is the first footnote.\n\n[^2]: Here's one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n `my code`\n Add as many paragraphs as you like.\n\n`This is the final element on the page, and there should be no margin below this.`\n",
"",
"This is a appbar style page with a custom background and overlay.\n",
"This is a docs layout with a custom background image and overlay.\n",
"This is a sidebar style page with custom background and overlay.\n",
"This is a stacked style page with a custom background and overlay.\n",
"This is a topbar style page with a custom background and overlay.\n",
"This is a custom background and overlay\n",
"This is a landing page with a custom header color.\n",
"This is a sidebar style page with a custom header color\n",
"This is a stacked page with a custom header color\n",
"This is a topbar style page with a custom header color\n",
"This is a landing layout with a custom header image.\n",
"This is a sidebar style page with a custom header image.\n",
"This is a stacked style page with a custom header image.\n",
"This is a topbar style page with a custom header image.\n",
"",
"## Jekyll version\n\n<pre>{{ jekyll.version }}</pre>\n\n## Jekyll environment\n\n<pre>{{ jekyll.environment }}</pre>\n\n## Site Variables\n\n<pre>{{ site | inspect }}</pre>\n\n## Page Variables\n\n<pre>{{ page | inspect }}</pre>\n\n{% if paginator %}\n## Paginator Variables\n\n<pre>{{ paginator | inspect }}</pre>\n{% endif %}\n",
"",
"",
"",
"# Welcome to jekyll-theme-profile theme!\n\nThis theme is based on GitHub's primer style. It supports both light and dark modes, and four style options: \n\n- [appbar](/github-pages-demo/appbar/)\n- [sidebar](/github-pages-demo/sidebar/)\n- [topbar](/github-pages-demo/topbar/)\n- [stacked](/github-pages-demo/stacked/)\n\nSetting up is a breeze, as it automatically populates your profile using your GitHub user info. Add custom links like Linktree and share engaging blog posts effortlessly.\n",
"",
"",
"",
"",
"",
"Text can be **bold**, *italic*, or ~~strikethrough~~. [Links](https://github.com) should be blue with no underlines (unless hovered over).\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\n> There should be no margin above this first sentence.\n> Blockquotes should be a lighter gray with a gray border along the left side.\n> There should be no margin below this final sentence.\n\n# Header 1\n\nThis is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n\n## Header 2\n\n> This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n### Header 3\n\n#### Header 4\n\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n\n##### Header 5\n\n1. This is an ordered list following a header.\n2. This is an ordered list following a header.\n3. This is an ordered list following a header.\n\n###### Header 6\n\n| What | Follows |\n|------------|------------|\n| A table | A header |\n| A table | A header |\n| A table | A header |\n\n---\n\nThere's a horizontal rule above and below this.\n\n---\n\nHere is an unordered list:\n\n- Apples\n- Bananas\n- Carrots\n\nAnd an ordered list:\n\n1. First item\n2. Second item\n3. Third item\n\nAnd an unordered task list:\n\n- [x] Create a sample markdown document\n- [ ] Add task lists to it\n- [ ] Take a vacation\n\nAnd a \"mixed\" task list:\n\n- [x] Steal underpants\n- [ ]\n- [x] Profit!\n\nAnd a nested list:\n\n- Fruits\n - Apple\n - Banana\n - Cherry\n - Grape\n - Orange\n- Tools\n - Hammer\n - Screwdriver\n - Wrench\n - Pliers\n\n\nDefinition lists can be used with HTML syntax. Definition terms are **bold and italic**.\n\nName\n: Godzilla\n\nBorn\n: 1952\n\nBirthplace\n: Japan\n\nColor\n: Green\n\n---\n\nTables should have bold headings and alternating shaded rows.\n\n| Artist | Album | Year |\n|---------------|----------------------|------|\n| David Bowie | Scary Monsters | 1980 |\n| Prince | Purple Rain | 1982 |\n| Beastie Boys | License to Ill | 1986 |\n| Janet Jackson | Rhythm Nation 1814 | 1989 |\n\nIf a table is too wide, it should condense down and/or scroll horizontally.\n\n| Item | Description | Color | Size | Material | Weight | Price | Rating | Stock | Notes |\n|--------------|------------------|-----------|---------|-----------|--------|--------|--------|-------|-------------------------------|\n| Chair | Office chair | Black | Medium | Wood | 12kg | $120 | 4.5 | Yes | Adjustable height |\n| Table | Dining table | Brown | Large | Wood | 30kg | $450 | 4.7 | Yes | Seats six |\n| Lamp | Desk lamp | White | Small | Metal | 2kg | $35 | 4.2 | No | LED light included |\n| Sofa | Living room sofa | Gray | Large | Fabric | 45kg | $780 | 4.8 | Yes | Three seats |\n| Shelf | Wall shelf | Oak | Medium | Wood | 8kg | $60 | 4.6 | Yes | Easy to install |\n| Bed | Queen bed frame | Black | Large | Metal | 40kg | $550 | 4.9 | Yes | Mattress not included |\n| Mirror | Wall mirror | Silver | Medium | Glass | 5kg | $90 | 4.3 | Yes | Comes with mounting kit |\n| Rug | Area rug | Beige | Large | Wool | 10kg | $300 | 4.4 | No | Hand-woven |\n| Cabinet | Storage cabinet | White | Medium | Wood | 20kg | $250 | 4.7 | Yes | Multiple compartments |\n| Fan | Standing fan | Gray | Medium | Plastic | 4kg | $80 | 4.1 | Yes | Adjustable speed settings |\n\n\n---\n\nCode snippets like `var foo = \"bar\";` can be shown inline.\n\nAlso, `this should vertically align` <code>with this</code> <code>and this</code>.\n\nCode can also be shown in a block element.\n\n\n$ a \\* b = c ^ b $\n\n$ 2^{\\frac{n-1}{3}} $\n\n$ \\int_a^b f(x)\\,dx. $\n\n```cpp\n#include <iostream>\nusing namespace std;\n\nint main() {\n cout << \"Hello World!\";\n return 0;\n}\n// prints 'Hi, Tom' to STDOUT.\n```\n\n```python\nclass Person:\n def __init__(self, name, age):\n self.name = name\n self.age = age\n\np1 = Person(\"John\", 36)\n\nprint(p1.name)\nprint(p1.age)\n```\n\nInline code inside table cells should still be distinguishable.\n\n| Language | Code |\n|-------------|-------------------|\n| JavasScript | `var foo = \"bar\";`|\n| Ruby | `foo = \"bar\"` |\n\n---\n\nThe `<samp>` HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: `File not found`.\n\n---\n\nSmall images should be shown at their actual size.\n\n\n\nLarge images should always scale down and fit in the content container.\n\n\n\nHere's a simple footnote,[^1] and here's a longer one.[^2]\n\n[^1]: This is the first footnote.\n\n[^2]: Here's one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n `my code`\n Add as many paragraphs as you like.\n\n`This is the final element on the page, and there should be no margin below this.`\n",
"",
"Text can be **bold**, *italic*, or ~~strikethrough~~. [Links](https://github.com) should be blue with no underlines (unless hovered over).\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\n> There should be no margin above this first sentence.\n> Blockquotes should be a lighter gray with a gray border along the left side.\n> There should be no margin below this final sentence.\n\n# Header 1\n\nThis is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n\n## Header 2\n\n> This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n### Header 3\n\n#### Header 4\n\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n\n##### Header 5\n\n1. This is an ordered list following a header.\n2. This is an ordered list following a header.\n3. This is an ordered list following a header.\n\n###### Header 6\n\n| What | Follows |\n|------------|------------|\n| A table | A header |\n| A table | A header |\n| A table | A header |\n\n---\n\nThere's a horizontal rule above and below this.\n\n---\n\nHere is an unordered list:\n\n- Apples\n- Bananas\n- Carrots\n\nAnd an ordered list:\n\n1. First item\n2. Second item\n3. Third item\n\nAnd an unordered task list:\n\n- [x] Create a sample markdown document\n- [ ] Add task lists to it\n- [ ] Take a vacation\n\nAnd a \"mixed\" task list:\n\n- [x] Steal underpants\n- [ ]\n- [x] Profit!\n\nAnd a nested list:\n\n- Fruits\n - Apple\n - Banana\n - Cherry\n - Grape\n - Orange\n- Tools\n - Hammer\n - Screwdriver\n - Wrench\n - Pliers\n\n\nDefinition lists can be used with HTML syntax. Definition terms are **bold and italic**.\n\nName\n: Godzilla\n\nBorn\n: 1952\n\nBirthplace\n: Japan\n\nColor\n: Green\n\n---\n\nTables should have bold headings and alternating shaded rows.\n\n| Artist | Album | Year |\n|---------------|----------------------|------|\n| David Bowie | Scary Monsters | 1980 |\n| Prince | Purple Rain | 1982 |\n| Beastie Boys | License to Ill | 1986 |\n| Janet Jackson | Rhythm Nation 1814 | 1989 |\n\nIf a table is too wide, it should condense down and/or scroll horizontally.\n\n| Item | Description | Color | Size | Material | Weight | Price | Rating | Stock | Notes |\n|--------------|------------------|-----------|---------|-----------|--------|--------|--------|-------|-------------------------------|\n| Chair | Office chair | Black | Medium | Wood | 12kg | $120 | 4.5 | Yes | Adjustable height |\n| Table | Dining table | Brown | Large | Wood | 30kg | $450 | 4.7 | Yes | Seats six |\n| Lamp | Desk lamp | White | Small | Metal | 2kg | $35 | 4.2 | No | LED light included |\n| Sofa | Living room sofa | Gray | Large | Fabric | 45kg | $780 | 4.8 | Yes | Three seats |\n| Shelf | Wall shelf | Oak | Medium | Wood | 8kg | $60 | 4.6 | Yes | Easy to install |\n| Bed | Queen bed frame | Black | Large | Metal | 40kg | $550 | 4.9 | Yes | Mattress not included |\n| Mirror | Wall mirror | Silver | Medium | Glass | 5kg | $90 | 4.3 | Yes | Comes with mounting kit |\n| Rug | Area rug | Beige | Large | Wool | 10kg | $300 | 4.4 | No | Hand-woven |\n| Cabinet | Storage cabinet | White | Medium | Wood | 20kg | $250 | 4.7 | Yes | Multiple compartments |\n| Fan | Standing fan | Gray | Medium | Plastic | 4kg | $80 | 4.1 | Yes | Adjustable speed settings |\n\n\n---\n\nCode snippets like `var foo = \"bar\";` can be shown inline.\n\nAlso, `this should vertically align` <code>with this</code> <code>and this</code>.\n\nCode can also be shown in a block element.\n\n\n$ a \\* b = c ^ b $\n\n$ 2^{\\frac{n-1}{3}} $\n\n$ \\int_a^b f(x)\\,dx. $\n\n```cpp\n#include <iostream>\nusing namespace std;\n\nint main() {\n cout << \"Hello World!\";\n return 0;\n}\n// prints 'Hi, Tom' to STDOUT.\n```\n\n```python\nclass Person:\n def __init__(self, name, age):\n self.name = name\n self.age = age\n\np1 = Person(\"John\", 36)\n\nprint(p1.name)\nprint(p1.age)\n```\n\nInline code inside table cells should still be distinguishable.\n\n| Language | Code |\n|-------------|-------------------|\n| JavasScript | `var foo = \"bar\";`|\n| Ruby | `foo = \"bar\"` |\n\n---\n\nThe `<samp>` HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: `File not found`.\n\n---\n\nSmall images should be shown at their actual size.\n\n\n\nLarge images should always scale down and fit in the content container.\n\n\n\nHere's a simple footnote,[^1] and here's a longer one.[^2]\n\n[^1]: This is the first footnote.\n\n[^2]: Here's one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n `my code`\n Add as many paragraphs as you like.\n\n`This is the final element on the page, and there should be no margin below this.`\n",
"",
"",
"Text can be **bold**, *italic*, or ~~strikethrough~~. [Links](https://github.com) should be blue with no underlines (unless hovered over).\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\nThere should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.\n\n> There should be no margin above this first sentence.\n> Blockquotes should be a lighter gray with a gray border along the left side.\n> There should be no margin below this final sentence.\n\n# Header 1\n\nThis is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n\n## Header 2\n\n> This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.\n\n### Header 3\n\n#### Header 4\n\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n- This is an unordered list following a header.\n\n##### Header 5\n\n1. This is an ordered list following a header.\n2. This is an ordered list following a header.\n3. This is an ordered list following a header.\n\n###### Header 6\n\n| What | Follows |\n|------------|------------|\n| A table | A header |\n| A table | A header |\n| A table | A header |\n\n---\n\nThere's a horizontal rule above and below this.\n\n---\n\nHere is an unordered list:\n\n- Apples\n- Bananas\n- Carrots\n\nAnd an ordered list:\n\n1. First item\n2. Second item\n3. Third item\n\nAnd an unordered task list:\n\n- [x] Create a sample markdown document\n- [ ] Add task lists to it\n- [ ] Take a vacation\n\nAnd a \"mixed\" task list:\n\n- [x] Steal underpants\n- [ ]\n- [x] Profit!\n\nAnd a nested list:\n\n- Fruits\n - Apple\n - Banana\n - Cherry\n - Grape\n - Orange\n- Tools\n - Hammer\n - Screwdriver\n - Wrench\n - Pliers\n\n\nDefinition lists can be used with HTML syntax. Definition terms are **bold and italic**.\n\nName\n: Godzilla\n\nBorn\n: 1952\n\nBirthplace\n: Japan\n\nColor\n: Green\n\n---\n\nTables should have bold headings and alternating shaded rows.\n\n| Artist | Album | Year |\n|---------------|----------------------|------|\n| David Bowie | Scary Monsters | 1980 |\n| Prince | Purple Rain | 1982 |\n| Beastie Boys | License to Ill | 1986 |\n| Janet Jackson | Rhythm Nation 1814 | 1989 |\n\nIf a table is too wide, it should condense down and/or scroll horizontally.\n\n| Item | Description | Color | Size | Material | Weight | Price | Rating | Stock | Notes |\n|--------------|------------------|-----------|---------|-----------|--------|--------|--------|-------|-------------------------------|\n| Chair | Office chair | Black | Medium | Wood | 12kg | $120 | 4.5 | Yes | Adjustable height |\n| Table | Dining table | Brown | Large | Wood | 30kg | $450 | 4.7 | Yes | Seats six |\n| Lamp | Desk lamp | White | Small | Metal | 2kg | $35 | 4.2 | No | LED light included |\n| Sofa | Living room sofa | Gray | Large | Fabric | 45kg | $780 | 4.8 | Yes | Three seats |\n| Shelf | Wall shelf | Oak | Medium | Wood | 8kg | $60 | 4.6 | Yes | Easy to install |\n| Bed | Queen bed frame | Black | Large | Metal | 40kg | $550 | 4.9 | Yes | Mattress not included |\n| Mirror | Wall mirror | Silver | Medium | Glass | 5kg | $90 | 4.3 | Yes | Comes with mounting kit |\n| Rug | Area rug | Beige | Large | Wool | 10kg | $300 | 4.4 | No | Hand-woven |\n| Cabinet | Storage cabinet | White | Medium | Wood | 20kg | $250 | 4.7 | Yes | Multiple compartments |\n| Fan | Standing fan | Gray | Medium | Plastic | 4kg | $80 | 4.1 | Yes | Adjustable speed settings |\n\n\n---\n\nCode snippets like `var foo = \"bar\";` can be shown inline.\n\nAlso, `this should vertically align` <code>with this</code> <code>and this</code>.\n\nCode can also be shown in a block element.\n\n\n$ a \\* b = c ^ b $\n\n$ 2^{\\frac{n-1}{3}} $\n\n$ \\int_a^b f(x)\\,dx. $\n\n```cpp\n#include <iostream>\nusing namespace std;\n\nint main() {\n cout << \"Hello World!\";\n return 0;\n}\n// prints 'Hi, Tom' to STDOUT.\n```\n\n```python\nclass Person:\n def __init__(self, name, age):\n self.name = name\n self.age = age\n\np1 = Person(\"John\", 36)\n\nprint(p1.name)\nprint(p1.age)\n```\n\nInline code inside table cells should still be distinguishable.\n\n| Language | Code |\n|-------------|-------------------|\n| JavasScript | `var foo = \"bar\";`|\n| Ruby | `foo = \"bar\"` |\n\n---\n\nThe `<samp>` HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: `File not found`.\n\n---\n\nSmall images should be shown at their actual size.\n\n\n\nLarge images should always scale down and fit in the content container.\n\n\n\nHere's a simple footnote,[^1] and here's a longer one.[^2]\n\n[^1]: This is the first footnote.\n\n[^2]: Here's one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n `my code`\n Add as many paragraphs as you like.\n\n`This is the final element on the page, and there should be no margin below this.`\n",
"",
"",
"{% assign jekyll_version=jekyll.version | split: \".\" | first %}\n{% if jekyll_version == '3' %}\n/* Jekyll version 3 detected */\n@import 'jekyll-theme-profile-compat';\n{% else %}\n/* Jekyll version 4+ detected */\n@use 'jekyll-theme-profile';\n{% endif %}\n\n:root{\n --color-profile-text: var(--color-fg-default);\n --color-profile-accent: var(--color-accent-fg);\n --color-profile-bg: var(--color-canvas-default);\n}\n",
""
],
"posts": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with video | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with video\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-12-14T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Empty post with video\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-12-14T00:00:00+00:00\",\"datePublished\":\"2023-12-14T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with video\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with video</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Empty post with video\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Dec 14, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+video&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F;t=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F%2F&title=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <div id=\"Timeline-video-container\" class=\"image-container mb-5\">\n <iframe id=\"Timeline-video\" src=\"https://www.youtube.com/embed/E4WlUXrJgy4?si=BhUjhwehMIZME9Cf\" frameborder=\"0\" height=\"inherited\"\n width=\"inherited\"></iframe>\n </div>\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with image | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with image\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-11-21T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"twitter:title\" content=\"Empty post with image\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-11-21T00:00:00+00:00\",\"datePublished\":\"2023-11-21T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with image\",\"image\":\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with image</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" class=\"cover-image rounded-2\" alt=\"Empty post with image\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Nov 21, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+image&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F;t=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F%2F&title=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a topbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a topbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the topbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the topbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a topbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the topbar style.\",\"headline\":\"This is a topbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n<script>\n $(document).ready(function () {\n $('#expansion-btn').click(function () {\n $('.Extend').toggleClass('hide-sm');\n });\n });\n</script>\n<div class=\"Header position-sticky top-0 topbar\">\n <div class=\"flex-1\">\n <div class=\"d-flex\">\n <div class=\"Header-item\">\n <button id=\"expansion-btn\" class=\"btn-octicon mr-2 d-sm-none\"><span class=\"octicon octicon-three-bars-16\"></span></button>\n <a href=\"/github-pages-demo/\" class=\"Header-link h1 f4 d-flex flex-items-center\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </a>\n </div>\n <a href=\"/github-pages-demo/\" class=\"Header-item Header-link Header-item--full\">Jekyll Theme Profile</a>\n <div class=\"Header-item\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Header-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"Header-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"Header-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n <div class=\"d-flex\">\n <div class=\"Extend Header-item flex-column flex-sm-row flex-items-center width-full hide-sm\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a topbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the topbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a topbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+topbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F;t=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F%2F&title=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a stacked post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a stacked post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the stacked style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the stacked style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"twitter:title\" content=\"This is a stacked post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the stacked style.\",\"headline\":\"This is a stacked post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"Profile text-center mt-3\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 256px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n</div>\n<div class=\"Header d-flex z-2 position-sticky top-0 topbar\">\n <div class=\"Header-item flex-row flex-justify-center flex-1 hide-sm\">\n \n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-1 flex-sm-grow-0 flex-justify-start\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a stacked post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the stacked style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" class=\"cover-image rounded-2\" alt=\"This is a stacked post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+stacked+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F;t=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F%2F&title=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a sidebar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a sidebar post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the sidebar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the sidebar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"twitter:title\" content=\"This is a sidebar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the sidebar style.\",\"headline\":\"This is a sidebar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a sidebar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the sidebar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" class=\"cover-image rounded-2\" alt=\"This is a sidebar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+sidebar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F;t=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F%2F&title=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a appbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a appbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the appbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the appbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a appbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the appbar style.\",\"headline\":\"This is a appbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a appbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the appbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a appbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+appbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F;t=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F%2F&title=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test short post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test short post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<meta property=\"og:description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-30T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test short post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-30T00:00:00+00:00\",\"datePublished\":\"2019-01-30T00:00:00+00:00\",\"description\":\"This is a short post. It should show up on the timeline without a “continue” option.\",\"headline\":\"Test short post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test short post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test short post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 30, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+short+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F;t=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F%2F&title=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a basic post with various styles.\" />\n<meta property=\"og:description\" content=\"This is an example of a basic post with various styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"This is an example of a basic post with various styles.\",\"headline\":\"Test post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F;t=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F%2F&title=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is an example of a basic post with various styles.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>.</p>\n\n<p><a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Link to another post</a>.</p>\n\n<p>There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.</p>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header.</p>\n\n <p>When something is important enough, you do it even if the odds are not in your favor.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<div class=\"language-js highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\">// Javascript code with syntax highlighting.</span>\n<span class=\"kd\">var</span> <span class=\"nx\">fun</span> <span class=\"o\">=</span> <span class=\"kd\">function</span> <span class=\"nx\">lang</span><span class=\"p\">(</span><span class=\"nx\">l</span><span class=\"p\">)</span> <span class=\"p\">{</span>\n <span class=\"nx\">dateformat</span><span class=\"p\">.</span><span class=\"nx\">i18n</span> <span class=\"o\">=</span> <span class=\"nx\">require</span><span class=\"p\">(</span><span class=\"dl\">'</span><span class=\"s1\">./lang/</span><span class=\"dl\">'</span> <span class=\"o\">+</span> <span class=\"nx\">l</span><span class=\"p\">)</span>\n <span class=\"k\">return</span> <span class=\"kc\">true</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\"># Ruby code with syntax highlighting</span>\n<span class=\"no\">GitHubPages</span><span class=\"o\">::</span><span class=\"no\">Dependencies</span><span class=\"p\">.</span><span class=\"nf\">gems</span><span class=\"p\">.</span><span class=\"nf\">each</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"n\">version</span><span class=\"o\">|</span>\n <span class=\"n\">s</span><span class=\"p\">.</span><span class=\"nf\">add_dependency</span><span class=\"p\">(</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"s2\">\"= </span><span class=\"si\">#{</span><span class=\"n\">version</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">)</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th style=\"text-align: left\">head1</th>\n <th style=\"text-align: left\">head two</th>\n <th style=\"text-align: left\">three</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good swedish fish</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">out of stock</td>\n <td style=\"text-align: left\">good and plenty</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good cookies</td>\n <td style=\"text-align: left\">good</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good licorice</td>\n <td style=\"text-align: left\">yum</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"theres-a-horizontal-rule-below-this\">There’s a horizontal rule below this.</h3>\n\n<hr />\n\n<h3 id=\"here-is-an-unordered-list\">Here is an unordered list:</h3>\n\n<ul>\n <li>Item foo</li>\n <li>Item bar</li>\n <li>Item baz</li>\n <li>Item zip</li>\n</ul>\n\n<h3 id=\"and-an-ordered-list\">And an ordered list:</h3>\n\n<ol>\n <li>Item one</li>\n <li>Item two</li>\n <li>Item three</li>\n <li>Item four</li>\n</ol>\n\n<h3 id=\"and-a-nested-list\">And a nested list:</h3>\n\n<ul>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item\n <ul>\n <li>level 3 item</li>\n <li>level 3 item</li>\n </ul>\n </li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item</li>\n</ul>\n\n<h3 id=\"small-image\">Small image</h3>\n\n<p><img src=\"https://github.githubassets.com/images/icons/emoji/octocat.png\" alt=\"Octocat\" /></p>\n\n<h3 id=\"large-image\">Large image</h3>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Branching\" /></p>\n\n<h3 id=\"definition-lists-can-be-used-with-html-syntax\">Definition lists can be used with HTML syntax.</h3>\n\n<dl>\n<dt>Name</dt>\n<dd>Godzilla</dd>\n<dt>Born</dt>\n<dd>1952</dd>\n<dt>Birthplace</dt>\n<dd>Japan</dd>\n<dt>Color</dt>\n<dd>Green</dd>\n</dl>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.\n</code></pre></div></div>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>The final element.\n</code></pre></div></div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Syntax highlighter | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Syntax highlighter\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"Below are some languages and their representative styles.\" />\n<meta property=\"og:description\" content=\"Below are some languages and their representative styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Syntax highlighter\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"Below are some languages and their representative styles.\",\"headline\":\"Syntax highlighter\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Syntax highlighter</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Syntax highlighter\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Syntax+highlighter&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F;t=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F%2F&title=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>Below are some languages and their representative styles.</p>\n\n<h2 id=\"ruby\">Ruby</h2>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">def</span> <span class=\"nf\">show</span>\n <span class=\"nb\">puts</span> <span class=\"s2\">\"Outputting a very lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong line\"</span>\n <span class=\"vi\">@widget</span> <span class=\"o\">=</span> <span class=\"no\">Widget</span><span class=\"p\">(</span><span class=\"n\">params</span><span class=\"p\">[</span><span class=\"ss\">:id</span><span class=\"p\">])</span>\n <span class=\"n\">respond_to</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"nb\">format</span><span class=\"o\">|</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">html</span> <span class=\"c1\"># show.html.erb</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">json</span> <span class=\"p\">{</span> <span class=\"n\">render</span> <span class=\"ss\">json: </span><span class=\"vi\">@widget</span> <span class=\"p\">}</span>\n <span class=\"k\">end</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h2 id=\"php\">Php</h2>\n\n<div class=\"language-php highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\"><?php</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s2\">\"Hello </span><span class=\"si\">{</span><span class=\"nv\">$world</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">);</span>\n<span class=\"cp\">?></span>\n</code></pre></div></div>\n\n<h2 id=\"java\">Java</h2>\n\n<div class=\"language-java highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kd\">public</span> <span class=\"kd\">class</span> <span class=\"nc\">java</span> <span class=\"o\">{</span>\n <span class=\"kd\">public</span> <span class=\"kd\">static</span> <span class=\"kt\">void</span> <span class=\"nf\">main</span><span class=\"o\">(</span><span class=\"nc\">String</span><span class=\"o\">[]</span> <span class=\"n\">args</span><span class=\"o\">)</span> <span class=\"o\">{</span>\n <span class=\"nc\">System</span><span class=\"o\">.</span><span class=\"na\">out</span><span class=\"o\">.</span><span class=\"na\">println</span><span class=\"o\">(</span><span class=\"s\">\"Hello World\"</span><span class=\"o\">);</span>\n <span class=\"o\">}</span>\n<span class=\"o\">}</span>\n</code></pre></div></div>\n\n<h3 id=\"html\">HTML</h3>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><html></span>\n <span class=\"nt\"><head><title></span>Title!<span class=\"nt\"></title></head></span>\n <span class=\"nt\"><body></span>\n <span class=\"nt\"><p</span> <span class=\"na\">id=</span><span class=\"s\">\"foo\"</span><span class=\"nt\">></span>Hello, World!<span class=\"nt\"></p></span>\n <span class=\"nt\"><script </span><span class=\"na\">type=</span><span class=\"s\">\"text/javascript\"</span><span class=\"nt\">></span><span class=\"kd\">var</span> <span class=\"nx\">a</span> <span class=\"o\">=</span> <span class=\"mi\">1</span><span class=\"p\">;</span><span class=\"nt\"></script></span>\n <span class=\"nt\"><style </span><span class=\"na\">type=</span><span class=\"s\">\"text/css\"</span><span class=\"nt\">></span><span class=\"nf\">#foo</span> <span class=\"p\">{</span> <span class=\"nl\">font-weight</span><span class=\"p\">:</span> <span class=\"nb\">bold</span><span class=\"p\">;</span> <span class=\"p\">}</span><span class=\"nt\"></style></span>\n <span class=\"nt\"></body></span>\n<span class=\"nt\"></html></span>\n</code></pre></div></div>\n\n<h2 id=\"console\">Console</h2>\n\n<div class=\"language-console highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"gp\">#</span><span class=\"w\"> </span>prints <span class=\"s2\">\"hello, world\"</span> to the screen\n<span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"nb\">echo </span>Hello, World\n<span class=\"go\">Hello, World\n\n</span><span class=\"gp\">#</span><span class=\"w\"> </span>don<span class=\"s1\">'t run this\n</span><span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"s1\">rm -rf --no-preserve-root /\n</span></code></pre></div></div>\n\n<h2 id=\"css\">Css</h2>\n\n<div class=\"language-css highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\">body</span> <span class=\"p\">{</span>\n <span class=\"nl\">font-size</span><span class=\"p\">:</span> <span class=\"m\">12pt</span><span class=\"p\">;</span>\n <span class=\"nl\">background</span><span class=\"p\">:</span> <span class=\"m\">#fff</span> <span class=\"sx\">url(temp.png)</span> <span class=\"nb\">top</span> <span class=\"nb\">left</span> <span class=\"nb\">no-repeat</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"yaml\">Yaml</h2>\n\n<div class=\"language-yaml highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nn\">---</span>\n<span class=\"na\">one</span><span class=\"pi\">:</span> <span class=\"s\">Apple</span>\n<span class=\"na\">two</span><span class=\"pi\">:</span> <span class=\"s\">Banana</span>\n<span class=\"na\">three</span><span class=\"pi\">:</span> <span class=\"s\">Cherry</span>\n</code></pre></div></div>\n\n<h2 id=\"c\">C++</h2>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span>\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"c1\">// Outputs Hello World to screen.</span>\n <span class=\"n\">std</span><span class=\"o\">::</span><span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"python\">Python</h2>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kn\">import</span> <span class=\"nn\">sys</span>\n\n<span class=\"k\">def</span> <span class=\"nf\">my_function</span><span class=\"p\">():</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s\">\"Hello from a function\"</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<h2 id=\"using-liquid\">Using liquid</h2>\n\n<h3 id=\"without-line-numbers\">Without line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span></code></pre></figure>\n\n<h3 id=\"with-line-numbers\">With line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><table class=\"rouge-table\"><tbody><tr><td class=\"gutter gl\"><pre class=\"lineno\">1\n2\n</pre></td><td class=\"code\"><pre><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span>\n</pre></td></tr></tbody></table></code></pre></figure>\n\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Welcome to Jekyll! | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Welcome to Jekyll!\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<meta property=\"og:description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Welcome to Jekyll!\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\",\"headline\":\"Welcome to Jekyll!\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Welcome to Jekyll!</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Welcome to Jekyll!\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Welcome+to+Jekyll%21&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F;t=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F%2F&title=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n<p>To add new posts, simply add a file in the <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory that follows the convention <code class=\"language-plaintext highlighter-rouge\">YYYY-MM-DD-name-of-post.ext</code> and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.</p>\n\n<p>Check out the <a href=\"https://jekyllrb.com/docs/home\">Jekyll docs</a> for more info on how to get the most out of Jekyll. File all bugs/feature requests at <a href=\"https://github.com/jekyll/jekyll\">Jekyll’s GitHub repo</a>. If you have questions, you can ask them on <a href=\"https://talk.jekyllrb.com/\">Jekyll Talk</a>.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>. <a href=\"https://github.com\">Links</a> should be blue with no underlines (unless hovered over).</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<blockquote>\n <p>There should be no margin above this first sentence.\nBlockquotes should be a lighter gray with a gray border along the left side.\nThere should be no margin below this final sentence.</p>\n</blockquote>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th>What</th>\n <th>Follows</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>There’s a horizontal rule above and below this.</p>\n\n<hr />\n\n<p>Here is an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Carrots</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<p>And an unordered task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Create a sample markdown document</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Add task lists to it</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Take a vacation</li>\n</ul>\n\n<p>And a “mixed” task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Steal underpants</li>\n <li class=\"task-list-item\">[ ]</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Profit!</li>\n</ul>\n\n<p>And a nested list:</p>\n\n<ul>\n <li>Fruits\n <ul>\n <li>Apple</li>\n <li>Banana</li>\n <li>Cherry</li>\n <li>Grape</li>\n <li>Orange</li>\n </ul>\n </li>\n <li>Tools\n <ul>\n <li>Hammer</li>\n <li>Screwdriver</li>\n <li>Wrench</li>\n <li>Pliers</li>\n </ul>\n </li>\n</ul>\n\n<p>Definition lists can be used with HTML syntax. Definition terms are <strong>bold and italic</strong>.</p>\n\n<dl>\n <dt>Name</dt>\n <dd>Godzilla</dd>\n <dt>Born</dt>\n <dd>1952</dd>\n <dt>Birthplace</dt>\n <dd>Japan</dd>\n <dt>Color</dt>\n <dd>Green</dd>\n</dl>\n\n<hr />\n\n<p>Tables should have bold headings and alternating shaded rows.</p>\n\n<table>\n <thead>\n <tr>\n <th>Artist</th>\n <th>Album</th>\n <th>Year</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>David Bowie</td>\n <td>Scary Monsters</td>\n <td>1980</td>\n </tr>\n <tr>\n <td>Prince</td>\n <td>Purple Rain</td>\n <td>1982</td>\n </tr>\n <tr>\n <td>Beastie Boys</td>\n <td>License to Ill</td>\n <td>1986</td>\n </tr>\n <tr>\n <td>Janet Jackson</td>\n <td>Rhythm Nation 1814</td>\n <td>1989</td>\n </tr>\n </tbody>\n</table>\n\n<p>If a table is too wide, it should condense down and/or scroll horizontally.</p>\n\n<table>\n <thead>\n <tr>\n <th>Item</th>\n <th>Description</th>\n <th>Color</th>\n <th>Size</th>\n <th>Material</th>\n <th>Weight</th>\n <th>Price</th>\n <th>Rating</th>\n <th>Stock</th>\n <th>Notes</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>Office chair</td>\n <td>Black</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>12kg</td>\n <td>$120</td>\n <td>4.5</td>\n <td>Yes</td>\n <td>Adjustable height</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>Dining table</td>\n <td>Brown</td>\n <td>Large</td>\n <td>Wood</td>\n <td>30kg</td>\n <td>$450</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Seats six</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>Desk lamp</td>\n <td>White</td>\n <td>Small</td>\n <td>Metal</td>\n <td>2kg</td>\n <td>$35</td>\n <td>4.2</td>\n <td>No</td>\n <td>LED light included</td>\n </tr>\n <tr>\n <td>Sofa</td>\n <td>Living room sofa</td>\n <td>Gray</td>\n <td>Large</td>\n <td>Fabric</td>\n <td>45kg</td>\n <td>$780</td>\n <td>4.8</td>\n <td>Yes</td>\n <td>Three seats</td>\n </tr>\n <tr>\n <td>Shelf</td>\n <td>Wall shelf</td>\n <td>Oak</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>8kg</td>\n <td>$60</td>\n <td>4.6</td>\n <td>Yes</td>\n <td>Easy to install</td>\n </tr>\n <tr>\n <td>Bed</td>\n <td>Queen bed frame</td>\n <td>Black</td>\n <td>Large</td>\n <td>Metal</td>\n <td>40kg</td>\n <td>$550</td>\n <td>4.9</td>\n <td>Yes</td>\n <td>Mattress not included</td>\n </tr>\n <tr>\n <td>Mirror</td>\n <td>Wall mirror</td>\n <td>Silver</td>\n <td>Medium</td>\n <td>Glass</td>\n <td>5kg</td>\n <td>$90</td>\n <td>4.3</td>\n <td>Yes</td>\n <td>Comes with mounting kit</td>\n </tr>\n <tr>\n <td>Rug</td>\n <td>Area rug</td>\n <td>Beige</td>\n <td>Large</td>\n <td>Wool</td>\n <td>10kg</td>\n <td>$300</td>\n <td>4.4</td>\n <td>No</td>\n <td>Hand-woven</td>\n </tr>\n <tr>\n <td>Cabinet</td>\n <td>Storage cabinet</td>\n <td>White</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>20kg</td>\n <td>$250</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Multiple compartments</td>\n </tr>\n <tr>\n <td>Fan</td>\n <td>Standing fan</td>\n <td>Gray</td>\n <td>Medium</td>\n <td>Plastic</td>\n <td>4kg</td>\n <td>$80</td>\n <td>4.1</td>\n <td>Yes</td>\n <td>Adjustable speed settings</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>Code snippets like <code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code> can be shown inline.</p>\n\n<p>Also, <code class=\"language-plaintext highlighter-rouge\">this should vertically align</code> <code>with this</code> <code>and this</code>.</p>\n\n<p>Code can also be shown in a block element.</p>\n\n<p>$ a * b = c ^ b $</p>\n\n<p>$ 2^{\\frac{n-1}{3}} $</p>\n\n<p>$ \\int_a^b f(x)\\,dx. $</p>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span><span class=\"k\">using</span> <span class=\"k\">namespace</span> <span class=\"n\">std</span><span class=\"p\">;</span>\n\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n<span class=\"c1\">// prints 'Hi, Tom' to STDOUT.</span>\n</code></pre></div></div>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">class</span> <span class=\"nc\">Person</span><span class=\"p\">:</span>\n <span class=\"k\">def</span> <span class=\"nf\">__init__</span><span class=\"p\">(</span><span class=\"bp\">self</span><span class=\"p\">,</span> <span class=\"n\">name</span><span class=\"p\">,</span> <span class=\"n\">age</span><span class=\"p\">):</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">name</span> <span class=\"o\">=</span> <span class=\"n\">name</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">age</span> <span class=\"o\">=</span> <span class=\"n\">age</span>\n\n<span class=\"n\">p1</span> <span class=\"o\">=</span> <span class=\"n\">Person</span><span class=\"p\">(</span><span class=\"s\">\"John\"</span><span class=\"p\">,</span> <span class=\"mi\">36</span><span class=\"p\">)</span>\n\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">name</span><span class=\"p\">)</span>\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">age</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<p>Inline code inside table cells should still be distinguishable.</p>\n\n<table>\n <thead>\n <tr>\n <th>Language</th>\n <th>Code</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>JavasScript</td>\n <td><code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code></td>\n </tr>\n <tr>\n <td>Ruby</td>\n <td><code class=\"language-plaintext highlighter-rouge\">foo = \"bar\"</code></td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>The <code class=\"language-plaintext highlighter-rouge\"><samp></code> HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: <code class=\"language-plaintext highlighter-rouge\">File not found</code>.</p>\n\n<hr />\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<p><code class=\"language-plaintext highlighter-rouge\">This is the final element on the page, and there should be no margin below this.</code></p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"related_posts": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with video | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with video\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-12-14T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Empty post with video\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-12-14T00:00:00+00:00\",\"datePublished\":\"2023-12-14T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with video\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with video</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Empty post with video\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Dec 14, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+video&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F;t=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F%2F&title=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <div id=\"Timeline-video-container\" class=\"image-container mb-5\">\n <iframe id=\"Timeline-video\" src=\"https://www.youtube.com/embed/E4WlUXrJgy4?si=BhUjhwehMIZME9Cf\" frameborder=\"0\" height=\"inherited\"\n width=\"inherited\"></iframe>\n </div>\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with image | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with image\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-11-21T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"twitter:title\" content=\"Empty post with image\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-11-21T00:00:00+00:00\",\"datePublished\":\"2023-11-21T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with image\",\"image\":\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with image</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" class=\"cover-image rounded-2\" alt=\"Empty post with image\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Nov 21, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+image&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F;t=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F%2F&title=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a topbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a topbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the topbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the topbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a topbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the topbar style.\",\"headline\":\"This is a topbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n<script>\n $(document).ready(function () {\n $('#expansion-btn').click(function () {\n $('.Extend').toggleClass('hide-sm');\n });\n });\n</script>\n<div class=\"Header position-sticky top-0 topbar\">\n <div class=\"flex-1\">\n <div class=\"d-flex\">\n <div class=\"Header-item\">\n <button id=\"expansion-btn\" class=\"btn-octicon mr-2 d-sm-none\"><span class=\"octicon octicon-three-bars-16\"></span></button>\n <a href=\"/github-pages-demo/\" class=\"Header-link h1 f4 d-flex flex-items-center\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </a>\n </div>\n <a href=\"/github-pages-demo/\" class=\"Header-item Header-link Header-item--full\">Jekyll Theme Profile</a>\n <div class=\"Header-item\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Header-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"Header-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"Header-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n <div class=\"d-flex\">\n <div class=\"Extend Header-item flex-column flex-sm-row flex-items-center width-full hide-sm\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a topbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the topbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a topbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+topbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F;t=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F%2F&title=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a stacked post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a stacked post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the stacked style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the stacked style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"twitter:title\" content=\"This is a stacked post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the stacked style.\",\"headline\":\"This is a stacked post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"Profile text-center mt-3\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 256px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n</div>\n<div class=\"Header d-flex z-2 position-sticky top-0 topbar\">\n <div class=\"Header-item flex-row flex-justify-center flex-1 hide-sm\">\n \n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-1 flex-sm-grow-0 flex-justify-start\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a stacked post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the stacked style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" class=\"cover-image rounded-2\" alt=\"This is a stacked post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+stacked+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F;t=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F%2F&title=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a sidebar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a sidebar post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the sidebar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the sidebar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"twitter:title\" content=\"This is a sidebar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the sidebar style.\",\"headline\":\"This is a sidebar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a sidebar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the sidebar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" class=\"cover-image rounded-2\" alt=\"This is a sidebar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+sidebar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F;t=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F%2F&title=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a appbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a appbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the appbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the appbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a appbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the appbar style.\",\"headline\":\"This is a appbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a appbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the appbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a appbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+appbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F;t=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F%2F&title=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test short post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test short post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<meta property=\"og:description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-30T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test short post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-30T00:00:00+00:00\",\"datePublished\":\"2019-01-30T00:00:00+00:00\",\"description\":\"This is a short post. It should show up on the timeline without a “continue” option.\",\"headline\":\"Test short post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test short post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test short post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 30, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+short+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F;t=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F%2F&title=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a basic post with various styles.\" />\n<meta property=\"og:description\" content=\"This is an example of a basic post with various styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"This is an example of a basic post with various styles.\",\"headline\":\"Test post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F;t=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F%2F&title=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is an example of a basic post with various styles.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>.</p>\n\n<p><a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Link to another post</a>.</p>\n\n<p>There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.</p>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header.</p>\n\n <p>When something is important enough, you do it even if the odds are not in your favor.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<div class=\"language-js highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\">// Javascript code with syntax highlighting.</span>\n<span class=\"kd\">var</span> <span class=\"nx\">fun</span> <span class=\"o\">=</span> <span class=\"kd\">function</span> <span class=\"nx\">lang</span><span class=\"p\">(</span><span class=\"nx\">l</span><span class=\"p\">)</span> <span class=\"p\">{</span>\n <span class=\"nx\">dateformat</span><span class=\"p\">.</span><span class=\"nx\">i18n</span> <span class=\"o\">=</span> <span class=\"nx\">require</span><span class=\"p\">(</span><span class=\"dl\">'</span><span class=\"s1\">./lang/</span><span class=\"dl\">'</span> <span class=\"o\">+</span> <span class=\"nx\">l</span><span class=\"p\">)</span>\n <span class=\"k\">return</span> <span class=\"kc\">true</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\"># Ruby code with syntax highlighting</span>\n<span class=\"no\">GitHubPages</span><span class=\"o\">::</span><span class=\"no\">Dependencies</span><span class=\"p\">.</span><span class=\"nf\">gems</span><span class=\"p\">.</span><span class=\"nf\">each</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"n\">version</span><span class=\"o\">|</span>\n <span class=\"n\">s</span><span class=\"p\">.</span><span class=\"nf\">add_dependency</span><span class=\"p\">(</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"s2\">\"= </span><span class=\"si\">#{</span><span class=\"n\">version</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">)</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th style=\"text-align: left\">head1</th>\n <th style=\"text-align: left\">head two</th>\n <th style=\"text-align: left\">three</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good swedish fish</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">out of stock</td>\n <td style=\"text-align: left\">good and plenty</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good cookies</td>\n <td style=\"text-align: left\">good</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good licorice</td>\n <td style=\"text-align: left\">yum</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"theres-a-horizontal-rule-below-this\">There’s a horizontal rule below this.</h3>\n\n<hr />\n\n<h3 id=\"here-is-an-unordered-list\">Here is an unordered list:</h3>\n\n<ul>\n <li>Item foo</li>\n <li>Item bar</li>\n <li>Item baz</li>\n <li>Item zip</li>\n</ul>\n\n<h3 id=\"and-an-ordered-list\">And an ordered list:</h3>\n\n<ol>\n <li>Item one</li>\n <li>Item two</li>\n <li>Item three</li>\n <li>Item four</li>\n</ol>\n\n<h3 id=\"and-a-nested-list\">And a nested list:</h3>\n\n<ul>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item\n <ul>\n <li>level 3 item</li>\n <li>level 3 item</li>\n </ul>\n </li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item</li>\n</ul>\n\n<h3 id=\"small-image\">Small image</h3>\n\n<p><img src=\"https://github.githubassets.com/images/icons/emoji/octocat.png\" alt=\"Octocat\" /></p>\n\n<h3 id=\"large-image\">Large image</h3>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Branching\" /></p>\n\n<h3 id=\"definition-lists-can-be-used-with-html-syntax\">Definition lists can be used with HTML syntax.</h3>\n\n<dl>\n<dt>Name</dt>\n<dd>Godzilla</dd>\n<dt>Born</dt>\n<dd>1952</dd>\n<dt>Birthplace</dt>\n<dd>Japan</dd>\n<dt>Color</dt>\n<dd>Green</dd>\n</dl>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.\n</code></pre></div></div>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>The final element.\n</code></pre></div></div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Syntax highlighter | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Syntax highlighter\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"Below are some languages and their representative styles.\" />\n<meta property=\"og:description\" content=\"Below are some languages and their representative styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Syntax highlighter\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"Below are some languages and their representative styles.\",\"headline\":\"Syntax highlighter\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Syntax highlighter</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Syntax highlighter\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Syntax+highlighter&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F;t=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F%2F&title=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>Below are some languages and their representative styles.</p>\n\n<h2 id=\"ruby\">Ruby</h2>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">def</span> <span class=\"nf\">show</span>\n <span class=\"nb\">puts</span> <span class=\"s2\">\"Outputting a very lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong line\"</span>\n <span class=\"vi\">@widget</span> <span class=\"o\">=</span> <span class=\"no\">Widget</span><span class=\"p\">(</span><span class=\"n\">params</span><span class=\"p\">[</span><span class=\"ss\">:id</span><span class=\"p\">])</span>\n <span class=\"n\">respond_to</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"nb\">format</span><span class=\"o\">|</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">html</span> <span class=\"c1\"># show.html.erb</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">json</span> <span class=\"p\">{</span> <span class=\"n\">render</span> <span class=\"ss\">json: </span><span class=\"vi\">@widget</span> <span class=\"p\">}</span>\n <span class=\"k\">end</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h2 id=\"php\">Php</h2>\n\n<div class=\"language-php highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\"><?php</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s2\">\"Hello </span><span class=\"si\">{</span><span class=\"nv\">$world</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">);</span>\n<span class=\"cp\">?></span>\n</code></pre></div></div>\n\n<h2 id=\"java\">Java</h2>\n\n<div class=\"language-java highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kd\">public</span> <span class=\"kd\">class</span> <span class=\"nc\">java</span> <span class=\"o\">{</span>\n <span class=\"kd\">public</span> <span class=\"kd\">static</span> <span class=\"kt\">void</span> <span class=\"nf\">main</span><span class=\"o\">(</span><span class=\"nc\">String</span><span class=\"o\">[]</span> <span class=\"n\">args</span><span class=\"o\">)</span> <span class=\"o\">{</span>\n <span class=\"nc\">System</span><span class=\"o\">.</span><span class=\"na\">out</span><span class=\"o\">.</span><span class=\"na\">println</span><span class=\"o\">(</span><span class=\"s\">\"Hello World\"</span><span class=\"o\">);</span>\n <span class=\"o\">}</span>\n<span class=\"o\">}</span>\n</code></pre></div></div>\n\n<h3 id=\"html\">HTML</h3>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><html></span>\n <span class=\"nt\"><head><title></span>Title!<span class=\"nt\"></title></head></span>\n <span class=\"nt\"><body></span>\n <span class=\"nt\"><p</span> <span class=\"na\">id=</span><span class=\"s\">\"foo\"</span><span class=\"nt\">></span>Hello, World!<span class=\"nt\"></p></span>\n <span class=\"nt\"><script </span><span class=\"na\">type=</span><span class=\"s\">\"text/javascript\"</span><span class=\"nt\">></span><span class=\"kd\">var</span> <span class=\"nx\">a</span> <span class=\"o\">=</span> <span class=\"mi\">1</span><span class=\"p\">;</span><span class=\"nt\"></script></span>\n <span class=\"nt\"><style </span><span class=\"na\">type=</span><span class=\"s\">\"text/css\"</span><span class=\"nt\">></span><span class=\"nf\">#foo</span> <span class=\"p\">{</span> <span class=\"nl\">font-weight</span><span class=\"p\">:</span> <span class=\"nb\">bold</span><span class=\"p\">;</span> <span class=\"p\">}</span><span class=\"nt\"></style></span>\n <span class=\"nt\"></body></span>\n<span class=\"nt\"></html></span>\n</code></pre></div></div>\n\n<h2 id=\"console\">Console</h2>\n\n<div class=\"language-console highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"gp\">#</span><span class=\"w\"> </span>prints <span class=\"s2\">\"hello, world\"</span> to the screen\n<span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"nb\">echo </span>Hello, World\n<span class=\"go\">Hello, World\n\n</span><span class=\"gp\">#</span><span class=\"w\"> </span>don<span class=\"s1\">'t run this\n</span><span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"s1\">rm -rf --no-preserve-root /\n</span></code></pre></div></div>\n\n<h2 id=\"css\">Css</h2>\n\n<div class=\"language-css highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\">body</span> <span class=\"p\">{</span>\n <span class=\"nl\">font-size</span><span class=\"p\">:</span> <span class=\"m\">12pt</span><span class=\"p\">;</span>\n <span class=\"nl\">background</span><span class=\"p\">:</span> <span class=\"m\">#fff</span> <span class=\"sx\">url(temp.png)</span> <span class=\"nb\">top</span> <span class=\"nb\">left</span> <span class=\"nb\">no-repeat</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"yaml\">Yaml</h2>\n\n<div class=\"language-yaml highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nn\">---</span>\n<span class=\"na\">one</span><span class=\"pi\">:</span> <span class=\"s\">Apple</span>\n<span class=\"na\">two</span><span class=\"pi\">:</span> <span class=\"s\">Banana</span>\n<span class=\"na\">three</span><span class=\"pi\">:</span> <span class=\"s\">Cherry</span>\n</code></pre></div></div>\n\n<h2 id=\"c\">C++</h2>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span>\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"c1\">// Outputs Hello World to screen.</span>\n <span class=\"n\">std</span><span class=\"o\">::</span><span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"python\">Python</h2>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kn\">import</span> <span class=\"nn\">sys</span>\n\n<span class=\"k\">def</span> <span class=\"nf\">my_function</span><span class=\"p\">():</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s\">\"Hello from a function\"</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<h2 id=\"using-liquid\">Using liquid</h2>\n\n<h3 id=\"without-line-numbers\">Without line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span></code></pre></figure>\n\n<h3 id=\"with-line-numbers\">With line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><table class=\"rouge-table\"><tbody><tr><td class=\"gutter gl\"><pre class=\"lineno\">1\n2\n</pre></td><td class=\"code\"><pre><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span>\n</pre></td></tr></tbody></table></code></pre></figure>\n\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Welcome to Jekyll! | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Welcome to Jekyll!\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<meta property=\"og:description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Welcome to Jekyll!\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\",\"headline\":\"Welcome to Jekyll!\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Welcome to Jekyll!</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Welcome to Jekyll!\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Welcome+to+Jekyll%21&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F;t=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F%2F&title=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n<p>To add new posts, simply add a file in the <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory that follows the convention <code class=\"language-plaintext highlighter-rouge\">YYYY-MM-DD-name-of-post.ext</code> and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.</p>\n\n<p>Check out the <a href=\"https://jekyllrb.com/docs/home\">Jekyll docs</a> for more info on how to get the most out of Jekyll. File all bugs/feature requests at <a href=\"https://github.com/jekyll/jekyll\">Jekyll’s GitHub repo</a>. If you have questions, you can ask them on <a href=\"https://talk.jekyllrb.com/\">Jekyll Talk</a>.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>. <a href=\"https://github.com\">Links</a> should be blue with no underlines (unless hovered over).</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<blockquote>\n <p>There should be no margin above this first sentence.\nBlockquotes should be a lighter gray with a gray border along the left side.\nThere should be no margin below this final sentence.</p>\n</blockquote>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th>What</th>\n <th>Follows</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>There’s a horizontal rule above and below this.</p>\n\n<hr />\n\n<p>Here is an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Carrots</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<p>And an unordered task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Create a sample markdown document</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Add task lists to it</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Take a vacation</li>\n</ul>\n\n<p>And a “mixed” task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Steal underpants</li>\n <li class=\"task-list-item\">[ ]</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Profit!</li>\n</ul>\n\n<p>And a nested list:</p>\n\n<ul>\n <li>Fruits\n <ul>\n <li>Apple</li>\n <li>Banana</li>\n <li>Cherry</li>\n <li>Grape</li>\n <li>Orange</li>\n </ul>\n </li>\n <li>Tools\n <ul>\n <li>Hammer</li>\n <li>Screwdriver</li>\n <li>Wrench</li>\n <li>Pliers</li>\n </ul>\n </li>\n</ul>\n\n<p>Definition lists can be used with HTML syntax. Definition terms are <strong>bold and italic</strong>.</p>\n\n<dl>\n <dt>Name</dt>\n <dd>Godzilla</dd>\n <dt>Born</dt>\n <dd>1952</dd>\n <dt>Birthplace</dt>\n <dd>Japan</dd>\n <dt>Color</dt>\n <dd>Green</dd>\n</dl>\n\n<hr />\n\n<p>Tables should have bold headings and alternating shaded rows.</p>\n\n<table>\n <thead>\n <tr>\n <th>Artist</th>\n <th>Album</th>\n <th>Year</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>David Bowie</td>\n <td>Scary Monsters</td>\n <td>1980</td>\n </tr>\n <tr>\n <td>Prince</td>\n <td>Purple Rain</td>\n <td>1982</td>\n </tr>\n <tr>\n <td>Beastie Boys</td>\n <td>License to Ill</td>\n <td>1986</td>\n </tr>\n <tr>\n <td>Janet Jackson</td>\n <td>Rhythm Nation 1814</td>\n <td>1989</td>\n </tr>\n </tbody>\n</table>\n\n<p>If a table is too wide, it should condense down and/or scroll horizontally.</p>\n\n<table>\n <thead>\n <tr>\n <th>Item</th>\n <th>Description</th>\n <th>Color</th>\n <th>Size</th>\n <th>Material</th>\n <th>Weight</th>\n <th>Price</th>\n <th>Rating</th>\n <th>Stock</th>\n <th>Notes</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>Office chair</td>\n <td>Black</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>12kg</td>\n <td>$120</td>\n <td>4.5</td>\n <td>Yes</td>\n <td>Adjustable height</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>Dining table</td>\n <td>Brown</td>\n <td>Large</td>\n <td>Wood</td>\n <td>30kg</td>\n <td>$450</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Seats six</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>Desk lamp</td>\n <td>White</td>\n <td>Small</td>\n <td>Metal</td>\n <td>2kg</td>\n <td>$35</td>\n <td>4.2</td>\n <td>No</td>\n <td>LED light included</td>\n </tr>\n <tr>\n <td>Sofa</td>\n <td>Living room sofa</td>\n <td>Gray</td>\n <td>Large</td>\n <td>Fabric</td>\n <td>45kg</td>\n <td>$780</td>\n <td>4.8</td>\n <td>Yes</td>\n <td>Three seats</td>\n </tr>\n <tr>\n <td>Shelf</td>\n <td>Wall shelf</td>\n <td>Oak</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>8kg</td>\n <td>$60</td>\n <td>4.6</td>\n <td>Yes</td>\n <td>Easy to install</td>\n </tr>\n <tr>\n <td>Bed</td>\n <td>Queen bed frame</td>\n <td>Black</td>\n <td>Large</td>\n <td>Metal</td>\n <td>40kg</td>\n <td>$550</td>\n <td>4.9</td>\n <td>Yes</td>\n <td>Mattress not included</td>\n </tr>\n <tr>\n <td>Mirror</td>\n <td>Wall mirror</td>\n <td>Silver</td>\n <td>Medium</td>\n <td>Glass</td>\n <td>5kg</td>\n <td>$90</td>\n <td>4.3</td>\n <td>Yes</td>\n <td>Comes with mounting kit</td>\n </tr>\n <tr>\n <td>Rug</td>\n <td>Area rug</td>\n <td>Beige</td>\n <td>Large</td>\n <td>Wool</td>\n <td>10kg</td>\n <td>$300</td>\n <td>4.4</td>\n <td>No</td>\n <td>Hand-woven</td>\n </tr>\n <tr>\n <td>Cabinet</td>\n <td>Storage cabinet</td>\n <td>White</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>20kg</td>\n <td>$250</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Multiple compartments</td>\n </tr>\n <tr>\n <td>Fan</td>\n <td>Standing fan</td>\n <td>Gray</td>\n <td>Medium</td>\n <td>Plastic</td>\n <td>4kg</td>\n <td>$80</td>\n <td>4.1</td>\n <td>Yes</td>\n <td>Adjustable speed settings</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>Code snippets like <code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code> can be shown inline.</p>\n\n<p>Also, <code class=\"language-plaintext highlighter-rouge\">this should vertically align</code> <code>with this</code> <code>and this</code>.</p>\n\n<p>Code can also be shown in a block element.</p>\n\n<p>$ a * b = c ^ b $</p>\n\n<p>$ 2^{\\frac{n-1}{3}} $</p>\n\n<p>$ \\int_a^b f(x)\\,dx. $</p>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span><span class=\"k\">using</span> <span class=\"k\">namespace</span> <span class=\"n\">std</span><span class=\"p\">;</span>\n\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n<span class=\"c1\">// prints 'Hi, Tom' to STDOUT.</span>\n</code></pre></div></div>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">class</span> <span class=\"nc\">Person</span><span class=\"p\">:</span>\n <span class=\"k\">def</span> <span class=\"nf\">__init__</span><span class=\"p\">(</span><span class=\"bp\">self</span><span class=\"p\">,</span> <span class=\"n\">name</span><span class=\"p\">,</span> <span class=\"n\">age</span><span class=\"p\">):</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">name</span> <span class=\"o\">=</span> <span class=\"n\">name</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">age</span> <span class=\"o\">=</span> <span class=\"n\">age</span>\n\n<span class=\"n\">p1</span> <span class=\"o\">=</span> <span class=\"n\">Person</span><span class=\"p\">(</span><span class=\"s\">\"John\"</span><span class=\"p\">,</span> <span class=\"mi\">36</span><span class=\"p\">)</span>\n\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">name</span><span class=\"p\">)</span>\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">age</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<p>Inline code inside table cells should still be distinguishable.</p>\n\n<table>\n <thead>\n <tr>\n <th>Language</th>\n <th>Code</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>JavasScript</td>\n <td><code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code></td>\n </tr>\n <tr>\n <td>Ruby</td>\n <td><code class=\"language-plaintext highlighter-rouge\">foo = \"bar\"</code></td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>The <code class=\"language-plaintext highlighter-rouge\"><samp></code> HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: <code class=\"language-plaintext highlighter-rouge\">File not found</code>.</p>\n\n<hr />\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<p><code class=\"language-plaintext highlighter-rouge\">This is the final element on the page, and there should be no margin below this.</code></p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"time": "2025-07-20 19:22:16 +0000",
"tags": {
"how-to": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Syntax highlighter | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Syntax highlighter\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"Below are some languages and their representative styles.\" />\n<meta property=\"og:description\" content=\"Below are some languages and their representative styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Syntax highlighter\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"Below are some languages and their representative styles.\",\"headline\":\"Syntax highlighter\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Syntax highlighter</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Syntax highlighter\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Syntax+highlighter&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F;t=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F%2F&title=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>Below are some languages and their representative styles.</p>\n\n<h2 id=\"ruby\">Ruby</h2>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">def</span> <span class=\"nf\">show</span>\n <span class=\"nb\">puts</span> <span class=\"s2\">\"Outputting a very lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong line\"</span>\n <span class=\"vi\">@widget</span> <span class=\"o\">=</span> <span class=\"no\">Widget</span><span class=\"p\">(</span><span class=\"n\">params</span><span class=\"p\">[</span><span class=\"ss\">:id</span><span class=\"p\">])</span>\n <span class=\"n\">respond_to</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"nb\">format</span><span class=\"o\">|</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">html</span> <span class=\"c1\"># show.html.erb</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">json</span> <span class=\"p\">{</span> <span class=\"n\">render</span> <span class=\"ss\">json: </span><span class=\"vi\">@widget</span> <span class=\"p\">}</span>\n <span class=\"k\">end</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h2 id=\"php\">Php</h2>\n\n<div class=\"language-php highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\"><?php</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s2\">\"Hello </span><span class=\"si\">{</span><span class=\"nv\">$world</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">);</span>\n<span class=\"cp\">?></span>\n</code></pre></div></div>\n\n<h2 id=\"java\">Java</h2>\n\n<div class=\"language-java highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kd\">public</span> <span class=\"kd\">class</span> <span class=\"nc\">java</span> <span class=\"o\">{</span>\n <span class=\"kd\">public</span> <span class=\"kd\">static</span> <span class=\"kt\">void</span> <span class=\"nf\">main</span><span class=\"o\">(</span><span class=\"nc\">String</span><span class=\"o\">[]</span> <span class=\"n\">args</span><span class=\"o\">)</span> <span class=\"o\">{</span>\n <span class=\"nc\">System</span><span class=\"o\">.</span><span class=\"na\">out</span><span class=\"o\">.</span><span class=\"na\">println</span><span class=\"o\">(</span><span class=\"s\">\"Hello World\"</span><span class=\"o\">);</span>\n <span class=\"o\">}</span>\n<span class=\"o\">}</span>\n</code></pre></div></div>\n\n<h3 id=\"html\">HTML</h3>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><html></span>\n <span class=\"nt\"><head><title></span>Title!<span class=\"nt\"></title></head></span>\n <span class=\"nt\"><body></span>\n <span class=\"nt\"><p</span> <span class=\"na\">id=</span><span class=\"s\">\"foo\"</span><span class=\"nt\">></span>Hello, World!<span class=\"nt\"></p></span>\n <span class=\"nt\"><script </span><span class=\"na\">type=</span><span class=\"s\">\"text/javascript\"</span><span class=\"nt\">></span><span class=\"kd\">var</span> <span class=\"nx\">a</span> <span class=\"o\">=</span> <span class=\"mi\">1</span><span class=\"p\">;</span><span class=\"nt\"></script></span>\n <span class=\"nt\"><style </span><span class=\"na\">type=</span><span class=\"s\">\"text/css\"</span><span class=\"nt\">></span><span class=\"nf\">#foo</span> <span class=\"p\">{</span> <span class=\"nl\">font-weight</span><span class=\"p\">:</span> <span class=\"nb\">bold</span><span class=\"p\">;</span> <span class=\"p\">}</span><span class=\"nt\"></style></span>\n <span class=\"nt\"></body></span>\n<span class=\"nt\"></html></span>\n</code></pre></div></div>\n\n<h2 id=\"console\">Console</h2>\n\n<div class=\"language-console highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"gp\">#</span><span class=\"w\"> </span>prints <span class=\"s2\">\"hello, world\"</span> to the screen\n<span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"nb\">echo </span>Hello, World\n<span class=\"go\">Hello, World\n\n</span><span class=\"gp\">#</span><span class=\"w\"> </span>don<span class=\"s1\">'t run this\n</span><span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"s1\">rm -rf --no-preserve-root /\n</span></code></pre></div></div>\n\n<h2 id=\"css\">Css</h2>\n\n<div class=\"language-css highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\">body</span> <span class=\"p\">{</span>\n <span class=\"nl\">font-size</span><span class=\"p\">:</span> <span class=\"m\">12pt</span><span class=\"p\">;</span>\n <span class=\"nl\">background</span><span class=\"p\">:</span> <span class=\"m\">#fff</span> <span class=\"sx\">url(temp.png)</span> <span class=\"nb\">top</span> <span class=\"nb\">left</span> <span class=\"nb\">no-repeat</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"yaml\">Yaml</h2>\n\n<div class=\"language-yaml highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nn\">---</span>\n<span class=\"na\">one</span><span class=\"pi\">:</span> <span class=\"s\">Apple</span>\n<span class=\"na\">two</span><span class=\"pi\">:</span> <span class=\"s\">Banana</span>\n<span class=\"na\">three</span><span class=\"pi\">:</span> <span class=\"s\">Cherry</span>\n</code></pre></div></div>\n\n<h2 id=\"c\">C++</h2>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span>\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"c1\">// Outputs Hello World to screen.</span>\n <span class=\"n\">std</span><span class=\"o\">::</span><span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"python\">Python</h2>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kn\">import</span> <span class=\"nn\">sys</span>\n\n<span class=\"k\">def</span> <span class=\"nf\">my_function</span><span class=\"p\">():</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s\">\"Hello from a function\"</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<h2 id=\"using-liquid\">Using liquid</h2>\n\n<h3 id=\"without-line-numbers\">Without line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span></code></pre></figure>\n\n<h3 id=\"with-line-numbers\">With line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><table class=\"rouge-table\"><tbody><tr><td class=\"gutter gl\"><pre class=\"lineno\">1\n2\n</pre></td><td class=\"code\"><pre><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span>\n</pre></td></tr></tbody></table></code></pre></figure>\n\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Welcome to Jekyll! | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Welcome to Jekyll!\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<meta property=\"og:description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Welcome to Jekyll!\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\",\"headline\":\"Welcome to Jekyll!\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Welcome to Jekyll!</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Welcome to Jekyll!\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Welcome+to+Jekyll%21&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F;t=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F%2F&title=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n<p>To add new posts, simply add a file in the <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory that follows the convention <code class=\"language-plaintext highlighter-rouge\">YYYY-MM-DD-name-of-post.ext</code> and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.</p>\n\n<p>Check out the <a href=\"https://jekyllrb.com/docs/home\">Jekyll docs</a> for more info on how to get the most out of Jekyll. File all bugs/feature requests at <a href=\"https://github.com/jekyll/jekyll\">Jekyll’s GitHub repo</a>. If you have questions, you can ask them on <a href=\"https://talk.jekyllrb.com/\">Jekyll Talk</a>.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>. <a href=\"https://github.com\">Links</a> should be blue with no underlines (unless hovered over).</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<blockquote>\n <p>There should be no margin above this first sentence.\nBlockquotes should be a lighter gray with a gray border along the left side.\nThere should be no margin below this final sentence.</p>\n</blockquote>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th>What</th>\n <th>Follows</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>There’s a horizontal rule above and below this.</p>\n\n<hr />\n\n<p>Here is an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Carrots</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<p>And an unordered task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Create a sample markdown document</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Add task lists to it</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Take a vacation</li>\n</ul>\n\n<p>And a “mixed” task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Steal underpants</li>\n <li class=\"task-list-item\">[ ]</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Profit!</li>\n</ul>\n\n<p>And a nested list:</p>\n\n<ul>\n <li>Fruits\n <ul>\n <li>Apple</li>\n <li>Banana</li>\n <li>Cherry</li>\n <li>Grape</li>\n <li>Orange</li>\n </ul>\n </li>\n <li>Tools\n <ul>\n <li>Hammer</li>\n <li>Screwdriver</li>\n <li>Wrench</li>\n <li>Pliers</li>\n </ul>\n </li>\n</ul>\n\n<p>Definition lists can be used with HTML syntax. Definition terms are <strong>bold and italic</strong>.</p>\n\n<dl>\n <dt>Name</dt>\n <dd>Godzilla</dd>\n <dt>Born</dt>\n <dd>1952</dd>\n <dt>Birthplace</dt>\n <dd>Japan</dd>\n <dt>Color</dt>\n <dd>Green</dd>\n</dl>\n\n<hr />\n\n<p>Tables should have bold headings and alternating shaded rows.</p>\n\n<table>\n <thead>\n <tr>\n <th>Artist</th>\n <th>Album</th>\n <th>Year</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>David Bowie</td>\n <td>Scary Monsters</td>\n <td>1980</td>\n </tr>\n <tr>\n <td>Prince</td>\n <td>Purple Rain</td>\n <td>1982</td>\n </tr>\n <tr>\n <td>Beastie Boys</td>\n <td>License to Ill</td>\n <td>1986</td>\n </tr>\n <tr>\n <td>Janet Jackson</td>\n <td>Rhythm Nation 1814</td>\n <td>1989</td>\n </tr>\n </tbody>\n</table>\n\n<p>If a table is too wide, it should condense down and/or scroll horizontally.</p>\n\n<table>\n <thead>\n <tr>\n <th>Item</th>\n <th>Description</th>\n <th>Color</th>\n <th>Size</th>\n <th>Material</th>\n <th>Weight</th>\n <th>Price</th>\n <th>Rating</th>\n <th>Stock</th>\n <th>Notes</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>Office chair</td>\n <td>Black</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>12kg</td>\n <td>$120</td>\n <td>4.5</td>\n <td>Yes</td>\n <td>Adjustable height</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>Dining table</td>\n <td>Brown</td>\n <td>Large</td>\n <td>Wood</td>\n <td>30kg</td>\n <td>$450</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Seats six</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>Desk lamp</td>\n <td>White</td>\n <td>Small</td>\n <td>Metal</td>\n <td>2kg</td>\n <td>$35</td>\n <td>4.2</td>\n <td>No</td>\n <td>LED light included</td>\n </tr>\n <tr>\n <td>Sofa</td>\n <td>Living room sofa</td>\n <td>Gray</td>\n <td>Large</td>\n <td>Fabric</td>\n <td>45kg</td>\n <td>$780</td>\n <td>4.8</td>\n <td>Yes</td>\n <td>Three seats</td>\n </tr>\n <tr>\n <td>Shelf</td>\n <td>Wall shelf</td>\n <td>Oak</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>8kg</td>\n <td>$60</td>\n <td>4.6</td>\n <td>Yes</td>\n <td>Easy to install</td>\n </tr>\n <tr>\n <td>Bed</td>\n <td>Queen bed frame</td>\n <td>Black</td>\n <td>Large</td>\n <td>Metal</td>\n <td>40kg</td>\n <td>$550</td>\n <td>4.9</td>\n <td>Yes</td>\n <td>Mattress not included</td>\n </tr>\n <tr>\n <td>Mirror</td>\n <td>Wall mirror</td>\n <td>Silver</td>\n <td>Medium</td>\n <td>Glass</td>\n <td>5kg</td>\n <td>$90</td>\n <td>4.3</td>\n <td>Yes</td>\n <td>Comes with mounting kit</td>\n </tr>\n <tr>\n <td>Rug</td>\n <td>Area rug</td>\n <td>Beige</td>\n <td>Large</td>\n <td>Wool</td>\n <td>10kg</td>\n <td>$300</td>\n <td>4.4</td>\n <td>No</td>\n <td>Hand-woven</td>\n </tr>\n <tr>\n <td>Cabinet</td>\n <td>Storage cabinet</td>\n <td>White</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>20kg</td>\n <td>$250</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Multiple compartments</td>\n </tr>\n <tr>\n <td>Fan</td>\n <td>Standing fan</td>\n <td>Gray</td>\n <td>Medium</td>\n <td>Plastic</td>\n <td>4kg</td>\n <td>$80</td>\n <td>4.1</td>\n <td>Yes</td>\n <td>Adjustable speed settings</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>Code snippets like <code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code> can be shown inline.</p>\n\n<p>Also, <code class=\"language-plaintext highlighter-rouge\">this should vertically align</code> <code>with this</code> <code>and this</code>.</p>\n\n<p>Code can also be shown in a block element.</p>\n\n<p>$ a * b = c ^ b $</p>\n\n<p>$ 2^{\\frac{n-1}{3}} $</p>\n\n<p>$ \\int_a^b f(x)\\,dx. $</p>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span><span class=\"k\">using</span> <span class=\"k\">namespace</span> <span class=\"n\">std</span><span class=\"p\">;</span>\n\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n<span class=\"c1\">// prints 'Hi, Tom' to STDOUT.</span>\n</code></pre></div></div>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">class</span> <span class=\"nc\">Person</span><span class=\"p\">:</span>\n <span class=\"k\">def</span> <span class=\"nf\">__init__</span><span class=\"p\">(</span><span class=\"bp\">self</span><span class=\"p\">,</span> <span class=\"n\">name</span><span class=\"p\">,</span> <span class=\"n\">age</span><span class=\"p\">):</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">name</span> <span class=\"o\">=</span> <span class=\"n\">name</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">age</span> <span class=\"o\">=</span> <span class=\"n\">age</span>\n\n<span class=\"n\">p1</span> <span class=\"o\">=</span> <span class=\"n\">Person</span><span class=\"p\">(</span><span class=\"s\">\"John\"</span><span class=\"p\">,</span> <span class=\"mi\">36</span><span class=\"p\">)</span>\n\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">name</span><span class=\"p\">)</span>\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">age</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<p>Inline code inside table cells should still be distinguishable.</p>\n\n<table>\n <thead>\n <tr>\n <th>Language</th>\n <th>Code</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>JavasScript</td>\n <td><code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code></td>\n </tr>\n <tr>\n <td>Ruby</td>\n <td><code class=\"language-plaintext highlighter-rouge\">foo = \"bar\"</code></td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>The <code class=\"language-plaintext highlighter-rouge\"><samp></code> HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: <code class=\"language-plaintext highlighter-rouge\">File not found</code>.</p>\n\n<hr />\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<p><code class=\"language-plaintext highlighter-rouge\">This is the final element on the page, and there should be no margin below this.</code></p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"welcome": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Welcome to Jekyll! | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Welcome to Jekyll!\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<meta property=\"og:description\" content=\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Welcome to Jekyll!\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.\",\"headline\":\"Welcome to Jekyll!\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/hello-world/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Welcome to Jekyll!</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Welcome to Jekyll!\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Welcome+to+Jekyll%21&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F;t=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fhello-world%2F%2F&title=Welcome+to+Jekyll%21\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n<p>To add new posts, simply add a file in the <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory that follows the convention <code class=\"language-plaintext highlighter-rouge\">YYYY-MM-DD-name-of-post.ext</code> and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.</p>\n\n<p>Check out the <a href=\"https://jekyllrb.com/docs/home\">Jekyll docs</a> for more info on how to get the most out of Jekyll. File all bugs/feature requests at <a href=\"https://github.com/jekyll/jekyll\">Jekyll’s GitHub repo</a>. If you have questions, you can ask them on <a href=\"https://talk.jekyllrb.com/\">Jekyll Talk</a>.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>. <a href=\"https://github.com\">Links</a> should be blue with no underlines (unless hovered over).</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>\n\n<blockquote>\n <p>There should be no margin above this first sentence.\nBlockquotes should be a lighter gray with a gray border along the left side.\nThere should be no margin below this final sentence.</p>\n</blockquote>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a standard paragraph designed for testing purposes. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header. Sample text flows here to simulate real content. Widgets, gadgets, and tools align perfectly with lorem bits and placeholder pieces. Testing the rhythm of prose, we sprinkle in arbitrary nouns like keyboard, coffee mug, and paperclip. The goal is simple: evaluate formatting without getting too distracted by meaning.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th>What</th>\n <th>Follows</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n <tr>\n <td>A table</td>\n <td>A header</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>There’s a horizontal rule above and below this.</p>\n\n<hr />\n\n<p>Here is an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Carrots</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<p>And an unordered task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Create a sample markdown document</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Add task lists to it</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" />Take a vacation</li>\n</ul>\n\n<p>And a “mixed” task list:</p>\n\n<ul class=\"task-list\">\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Steal underpants</li>\n <li class=\"task-list-item\">[ ]</li>\n <li class=\"task-list-item\"><input type=\"checkbox\" class=\"task-list-item-checkbox\" disabled=\"disabled\" checked=\"checked\" />Profit!</li>\n</ul>\n\n<p>And a nested list:</p>\n\n<ul>\n <li>Fruits\n <ul>\n <li>Apple</li>\n <li>Banana</li>\n <li>Cherry</li>\n <li>Grape</li>\n <li>Orange</li>\n </ul>\n </li>\n <li>Tools\n <ul>\n <li>Hammer</li>\n <li>Screwdriver</li>\n <li>Wrench</li>\n <li>Pliers</li>\n </ul>\n </li>\n</ul>\n\n<p>Definition lists can be used with HTML syntax. Definition terms are <strong>bold and italic</strong>.</p>\n\n<dl>\n <dt>Name</dt>\n <dd>Godzilla</dd>\n <dt>Born</dt>\n <dd>1952</dd>\n <dt>Birthplace</dt>\n <dd>Japan</dd>\n <dt>Color</dt>\n <dd>Green</dd>\n</dl>\n\n<hr />\n\n<p>Tables should have bold headings and alternating shaded rows.</p>\n\n<table>\n <thead>\n <tr>\n <th>Artist</th>\n <th>Album</th>\n <th>Year</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>David Bowie</td>\n <td>Scary Monsters</td>\n <td>1980</td>\n </tr>\n <tr>\n <td>Prince</td>\n <td>Purple Rain</td>\n <td>1982</td>\n </tr>\n <tr>\n <td>Beastie Boys</td>\n <td>License to Ill</td>\n <td>1986</td>\n </tr>\n <tr>\n <td>Janet Jackson</td>\n <td>Rhythm Nation 1814</td>\n <td>1989</td>\n </tr>\n </tbody>\n</table>\n\n<p>If a table is too wide, it should condense down and/or scroll horizontally.</p>\n\n<table>\n <thead>\n <tr>\n <th>Item</th>\n <th>Description</th>\n <th>Color</th>\n <th>Size</th>\n <th>Material</th>\n <th>Weight</th>\n <th>Price</th>\n <th>Rating</th>\n <th>Stock</th>\n <th>Notes</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>Office chair</td>\n <td>Black</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>12kg</td>\n <td>$120</td>\n <td>4.5</td>\n <td>Yes</td>\n <td>Adjustable height</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>Dining table</td>\n <td>Brown</td>\n <td>Large</td>\n <td>Wood</td>\n <td>30kg</td>\n <td>$450</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Seats six</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>Desk lamp</td>\n <td>White</td>\n <td>Small</td>\n <td>Metal</td>\n <td>2kg</td>\n <td>$35</td>\n <td>4.2</td>\n <td>No</td>\n <td>LED light included</td>\n </tr>\n <tr>\n <td>Sofa</td>\n <td>Living room sofa</td>\n <td>Gray</td>\n <td>Large</td>\n <td>Fabric</td>\n <td>45kg</td>\n <td>$780</td>\n <td>4.8</td>\n <td>Yes</td>\n <td>Three seats</td>\n </tr>\n <tr>\n <td>Shelf</td>\n <td>Wall shelf</td>\n <td>Oak</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>8kg</td>\n <td>$60</td>\n <td>4.6</td>\n <td>Yes</td>\n <td>Easy to install</td>\n </tr>\n <tr>\n <td>Bed</td>\n <td>Queen bed frame</td>\n <td>Black</td>\n <td>Large</td>\n <td>Metal</td>\n <td>40kg</td>\n <td>$550</td>\n <td>4.9</td>\n <td>Yes</td>\n <td>Mattress not included</td>\n </tr>\n <tr>\n <td>Mirror</td>\n <td>Wall mirror</td>\n <td>Silver</td>\n <td>Medium</td>\n <td>Glass</td>\n <td>5kg</td>\n <td>$90</td>\n <td>4.3</td>\n <td>Yes</td>\n <td>Comes with mounting kit</td>\n </tr>\n <tr>\n <td>Rug</td>\n <td>Area rug</td>\n <td>Beige</td>\n <td>Large</td>\n <td>Wool</td>\n <td>10kg</td>\n <td>$300</td>\n <td>4.4</td>\n <td>No</td>\n <td>Hand-woven</td>\n </tr>\n <tr>\n <td>Cabinet</td>\n <td>Storage cabinet</td>\n <td>White</td>\n <td>Medium</td>\n <td>Wood</td>\n <td>20kg</td>\n <td>$250</td>\n <td>4.7</td>\n <td>Yes</td>\n <td>Multiple compartments</td>\n </tr>\n <tr>\n <td>Fan</td>\n <td>Standing fan</td>\n <td>Gray</td>\n <td>Medium</td>\n <td>Plastic</td>\n <td>4kg</td>\n <td>$80</td>\n <td>4.1</td>\n <td>Yes</td>\n <td>Adjustable speed settings</td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>Code snippets like <code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code> can be shown inline.</p>\n\n<p>Also, <code class=\"language-plaintext highlighter-rouge\">this should vertically align</code> <code>with this</code> <code>and this</code>.</p>\n\n<p>Code can also be shown in a block element.</p>\n\n<p>$ a * b = c ^ b $</p>\n\n<p>$ 2^{\\frac{n-1}{3}} $</p>\n\n<p>$ \\int_a^b f(x)\\,dx. $</p>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span><span class=\"k\">using</span> <span class=\"k\">namespace</span> <span class=\"n\">std</span><span class=\"p\">;</span>\n\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n<span class=\"c1\">// prints 'Hi, Tom' to STDOUT.</span>\n</code></pre></div></div>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">class</span> <span class=\"nc\">Person</span><span class=\"p\">:</span>\n <span class=\"k\">def</span> <span class=\"nf\">__init__</span><span class=\"p\">(</span><span class=\"bp\">self</span><span class=\"p\">,</span> <span class=\"n\">name</span><span class=\"p\">,</span> <span class=\"n\">age</span><span class=\"p\">):</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">name</span> <span class=\"o\">=</span> <span class=\"n\">name</span>\n <span class=\"bp\">self</span><span class=\"p\">.</span><span class=\"n\">age</span> <span class=\"o\">=</span> <span class=\"n\">age</span>\n\n<span class=\"n\">p1</span> <span class=\"o\">=</span> <span class=\"n\">Person</span><span class=\"p\">(</span><span class=\"s\">\"John\"</span><span class=\"p\">,</span> <span class=\"mi\">36</span><span class=\"p\">)</span>\n\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">name</span><span class=\"p\">)</span>\n<span class=\"k\">print</span><span class=\"p\">(</span><span class=\"n\">p1</span><span class=\"p\">.</span><span class=\"n\">age</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<p>Inline code inside table cells should still be distinguishable.</p>\n\n<table>\n <thead>\n <tr>\n <th>Language</th>\n <th>Code</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>JavasScript</td>\n <td><code class=\"language-plaintext highlighter-rouge\">var foo = \"bar\";</code></td>\n </tr>\n <tr>\n <td>Ruby</td>\n <td><code class=\"language-plaintext highlighter-rouge\">foo = \"bar\"</code></td>\n </tr>\n </tbody>\n</table>\n\n<hr />\n\n<p>The <code class=\"language-plaintext highlighter-rouge\"><samp></code> HTML element is used to enclose inline text that represents sample (or quoted) output from a computer program. Here an example of an error message: <code class=\"language-plaintext highlighter-rouge\">File not found</code>.</p>\n\n<hr />\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<p><code class=\"language-plaintext highlighter-rouge\">This is the final element on the page, and there should be no margin below this.</code></p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"example": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with video | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with video\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-12-14T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Empty post with video\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-12-14T00:00:00+00:00\",\"datePublished\":\"2023-12-14T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with video\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with video</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Empty post with video\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Dec 14, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+video&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F;t=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F%2F&title=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <div id=\"Timeline-video-container\" class=\"image-container mb-5\">\n <iframe id=\"Timeline-video\" src=\"https://www.youtube.com/embed/E4WlUXrJgy4?si=BhUjhwehMIZME9Cf\" frameborder=\"0\" height=\"inherited\"\n width=\"inherited\"></iframe>\n </div>\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test short post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test short post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<meta property=\"og:description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-30T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test short post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-30T00:00:00+00:00\",\"datePublished\":\"2019-01-30T00:00:00+00:00\",\"description\":\"This is a short post. It should show up on the timeline without a “continue” option.\",\"headline\":\"Test short post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test short post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test short post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 30, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+short+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F;t=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F%2F&title=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a basic post with various styles.\" />\n<meta property=\"og:description\" content=\"This is an example of a basic post with various styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"This is an example of a basic post with various styles.\",\"headline\":\"Test post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F;t=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F%2F&title=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is an example of a basic post with various styles.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>.</p>\n\n<p><a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Link to another post</a>.</p>\n\n<p>There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.</p>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header.</p>\n\n <p>When something is important enough, you do it even if the odds are not in your favor.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<div class=\"language-js highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\">// Javascript code with syntax highlighting.</span>\n<span class=\"kd\">var</span> <span class=\"nx\">fun</span> <span class=\"o\">=</span> <span class=\"kd\">function</span> <span class=\"nx\">lang</span><span class=\"p\">(</span><span class=\"nx\">l</span><span class=\"p\">)</span> <span class=\"p\">{</span>\n <span class=\"nx\">dateformat</span><span class=\"p\">.</span><span class=\"nx\">i18n</span> <span class=\"o\">=</span> <span class=\"nx\">require</span><span class=\"p\">(</span><span class=\"dl\">'</span><span class=\"s1\">./lang/</span><span class=\"dl\">'</span> <span class=\"o\">+</span> <span class=\"nx\">l</span><span class=\"p\">)</span>\n <span class=\"k\">return</span> <span class=\"kc\">true</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\"># Ruby code with syntax highlighting</span>\n<span class=\"no\">GitHubPages</span><span class=\"o\">::</span><span class=\"no\">Dependencies</span><span class=\"p\">.</span><span class=\"nf\">gems</span><span class=\"p\">.</span><span class=\"nf\">each</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"n\">version</span><span class=\"o\">|</span>\n <span class=\"n\">s</span><span class=\"p\">.</span><span class=\"nf\">add_dependency</span><span class=\"p\">(</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"s2\">\"= </span><span class=\"si\">#{</span><span class=\"n\">version</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">)</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th style=\"text-align: left\">head1</th>\n <th style=\"text-align: left\">head two</th>\n <th style=\"text-align: left\">three</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good swedish fish</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">out of stock</td>\n <td style=\"text-align: left\">good and plenty</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good cookies</td>\n <td style=\"text-align: left\">good</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good licorice</td>\n <td style=\"text-align: left\">yum</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"theres-a-horizontal-rule-below-this\">There’s a horizontal rule below this.</h3>\n\n<hr />\n\n<h3 id=\"here-is-an-unordered-list\">Here is an unordered list:</h3>\n\n<ul>\n <li>Item foo</li>\n <li>Item bar</li>\n <li>Item baz</li>\n <li>Item zip</li>\n</ul>\n\n<h3 id=\"and-an-ordered-list\">And an ordered list:</h3>\n\n<ol>\n <li>Item one</li>\n <li>Item two</li>\n <li>Item three</li>\n <li>Item four</li>\n</ol>\n\n<h3 id=\"and-a-nested-list\">And a nested list:</h3>\n\n<ul>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item\n <ul>\n <li>level 3 item</li>\n <li>level 3 item</li>\n </ul>\n </li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item</li>\n</ul>\n\n<h3 id=\"small-image\">Small image</h3>\n\n<p><img src=\"https://github.githubassets.com/images/icons/emoji/octocat.png\" alt=\"Octocat\" /></p>\n\n<h3 id=\"large-image\">Large image</h3>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Branching\" /></p>\n\n<h3 id=\"definition-lists-can-be-used-with-html-syntax\">Definition lists can be used with HTML syntax.</h3>\n\n<dl>\n<dt>Name</dt>\n<dd>Godzilla</dd>\n<dt>Born</dt>\n<dd>1952</dd>\n<dt>Birthplace</dt>\n<dd>Japan</dd>\n<dt>Color</dt>\n<dd>Green</dd>\n</dl>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.\n</code></pre></div></div>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>The final element.\n</code></pre></div></div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Syntax highlighter | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Syntax highlighter\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"Below are some languages and their representative styles.\" />\n<meta property=\"og:description\" content=\"Below are some languages and their representative styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Syntax highlighter\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"Below are some languages and their representative styles.\",\"headline\":\"Syntax highlighter\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/syntax-highlighter/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Syntax highlighter</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Syntax highlighter\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Syntax+highlighter&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F;t=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Fsyntax-highlighter%2F%2F&title=Syntax+highlighter\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>Below are some languages and their representative styles.</p>\n\n<h2 id=\"ruby\">Ruby</h2>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"k\">def</span> <span class=\"nf\">show</span>\n <span class=\"nb\">puts</span> <span class=\"s2\">\"Outputting a very lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong lo-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-ong line\"</span>\n <span class=\"vi\">@widget</span> <span class=\"o\">=</span> <span class=\"no\">Widget</span><span class=\"p\">(</span><span class=\"n\">params</span><span class=\"p\">[</span><span class=\"ss\">:id</span><span class=\"p\">])</span>\n <span class=\"n\">respond_to</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"nb\">format</span><span class=\"o\">|</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">html</span> <span class=\"c1\"># show.html.erb</span>\n <span class=\"nb\">format</span><span class=\"p\">.</span><span class=\"nf\">json</span> <span class=\"p\">{</span> <span class=\"n\">render</span> <span class=\"ss\">json: </span><span class=\"vi\">@widget</span> <span class=\"p\">}</span>\n <span class=\"k\">end</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h2 id=\"php\">Php</h2>\n\n<div class=\"language-php highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\"><?php</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s2\">\"Hello </span><span class=\"si\">{</span><span class=\"nv\">$world</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">);</span>\n<span class=\"cp\">?></span>\n</code></pre></div></div>\n\n<h2 id=\"java\">Java</h2>\n\n<div class=\"language-java highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kd\">public</span> <span class=\"kd\">class</span> <span class=\"nc\">java</span> <span class=\"o\">{</span>\n <span class=\"kd\">public</span> <span class=\"kd\">static</span> <span class=\"kt\">void</span> <span class=\"nf\">main</span><span class=\"o\">(</span><span class=\"nc\">String</span><span class=\"o\">[]</span> <span class=\"n\">args</span><span class=\"o\">)</span> <span class=\"o\">{</span>\n <span class=\"nc\">System</span><span class=\"o\">.</span><span class=\"na\">out</span><span class=\"o\">.</span><span class=\"na\">println</span><span class=\"o\">(</span><span class=\"s\">\"Hello World\"</span><span class=\"o\">);</span>\n <span class=\"o\">}</span>\n<span class=\"o\">}</span>\n</code></pre></div></div>\n\n<h3 id=\"html\">HTML</h3>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><html></span>\n <span class=\"nt\"><head><title></span>Title!<span class=\"nt\"></title></head></span>\n <span class=\"nt\"><body></span>\n <span class=\"nt\"><p</span> <span class=\"na\">id=</span><span class=\"s\">\"foo\"</span><span class=\"nt\">></span>Hello, World!<span class=\"nt\"></p></span>\n <span class=\"nt\"><script </span><span class=\"na\">type=</span><span class=\"s\">\"text/javascript\"</span><span class=\"nt\">></span><span class=\"kd\">var</span> <span class=\"nx\">a</span> <span class=\"o\">=</span> <span class=\"mi\">1</span><span class=\"p\">;</span><span class=\"nt\"></script></span>\n <span class=\"nt\"><style </span><span class=\"na\">type=</span><span class=\"s\">\"text/css\"</span><span class=\"nt\">></span><span class=\"nf\">#foo</span> <span class=\"p\">{</span> <span class=\"nl\">font-weight</span><span class=\"p\">:</span> <span class=\"nb\">bold</span><span class=\"p\">;</span> <span class=\"p\">}</span><span class=\"nt\"></style></span>\n <span class=\"nt\"></body></span>\n<span class=\"nt\"></html></span>\n</code></pre></div></div>\n\n<h2 id=\"console\">Console</h2>\n\n<div class=\"language-console highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"gp\">#</span><span class=\"w\"> </span>prints <span class=\"s2\">\"hello, world\"</span> to the screen\n<span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"nb\">echo </span>Hello, World\n<span class=\"go\">Hello, World\n\n</span><span class=\"gp\">#</span><span class=\"w\"> </span>don<span class=\"s1\">'t run this\n</span><span class=\"gp\">~#</span><span class=\"w\"> </span><span class=\"s1\">rm -rf --no-preserve-root /\n</span></code></pre></div></div>\n\n<h2 id=\"css\">Css</h2>\n\n<div class=\"language-css highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\">body</span> <span class=\"p\">{</span>\n <span class=\"nl\">font-size</span><span class=\"p\">:</span> <span class=\"m\">12pt</span><span class=\"p\">;</span>\n <span class=\"nl\">background</span><span class=\"p\">:</span> <span class=\"m\">#fff</span> <span class=\"sx\">url(temp.png)</span> <span class=\"nb\">top</span> <span class=\"nb\">left</span> <span class=\"nb\">no-repeat</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"yaml\">Yaml</h2>\n\n<div class=\"language-yaml highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nn\">---</span>\n<span class=\"na\">one</span><span class=\"pi\">:</span> <span class=\"s\">Apple</span>\n<span class=\"na\">two</span><span class=\"pi\">:</span> <span class=\"s\">Banana</span>\n<span class=\"na\">three</span><span class=\"pi\">:</span> <span class=\"s\">Cherry</span>\n</code></pre></div></div>\n\n<h2 id=\"c\">C++</h2>\n\n<div class=\"language-cpp highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"cp\">#include</span> <span class=\"cpf\"><iostream></span><span class=\"cp\">\n</span>\n<span class=\"kt\">int</span> <span class=\"nf\">main</span><span class=\"p\">()</span> <span class=\"p\">{</span>\n <span class=\"c1\">// Outputs Hello World to screen.</span>\n <span class=\"n\">std</span><span class=\"o\">::</span><span class=\"n\">cout</span> <span class=\"o\"><<</span> <span class=\"s\">\"Hello World!\"</span><span class=\"p\">;</span>\n <span class=\"k\">return</span> <span class=\"mi\">0</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<h2 id=\"python\">Python</h2>\n\n<div class=\"language-python highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"kn\">import</span> <span class=\"nn\">sys</span>\n\n<span class=\"k\">def</span> <span class=\"nf\">my_function</span><span class=\"p\">():</span>\n <span class=\"k\">print</span><span class=\"p\">(</span><span class=\"s\">\"Hello from a function\"</span><span class=\"p\">)</span>\n</code></pre></div></div>\n\n<h2 id=\"using-liquid\">Using liquid</h2>\n\n<h3 id=\"without-line-numbers\">Without line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span></code></pre></figure>\n\n<h3 id=\"with-line-numbers\">With line numbers</h3>\n\n<figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><table class=\"rouge-table\"><tbody><tr><td class=\"gutter gl\"><pre class=\"lineno\">1\n2\n</pre></td><td class=\"code\"><pre><span class=\"kd\">function</span> <span class=\"nx\">some</span><span class=\"p\">(</span><span class=\"nx\">code</span><span class=\"p\">)</span> <span class=\"p\">{</span> <span class=\"cm\">/*goes here*/</span> <span class=\"p\">}</span>\n<span class=\"kd\">let</span> <span class=\"nx\">x</span> <span class=\"o\">=</span> <span class=\"mi\">21</span><span class=\"p\">;</span>\n</pre></td></tr></tbody></table></code></pre></figure>\n\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"test": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with video | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with video\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-12-14T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Empty post with video\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-12-14T00:00:00+00:00\",\"datePublished\":\"2023-12-14T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with video\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with video</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Empty post with video\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Dec 14, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+video&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F;t=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F%2F&title=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <div id=\"Timeline-video-container\" class=\"image-container mb-5\">\n <iframe id=\"Timeline-video\" src=\"https://www.youtube.com/embed/E4WlUXrJgy4?si=BhUjhwehMIZME9Cf\" frameborder=\"0\" height=\"inherited\"\n width=\"inherited\"></iframe>\n </div>\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test short post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test short post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<meta property=\"og:description\" content=\"This is a short post. It should show up on the timeline without a “continue” option.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-30T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test short post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-30T00:00:00+00:00\",\"datePublished\":\"2019-01-30T00:00:00+00:00\",\"description\":\"This is a short post. It should show up on the timeline without a “continue” option.\",\"headline\":\"Test short post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/30/short-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test short post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test short post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 30, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+short+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F;t=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F30%2Fshort-post%2F%2F&title=Test+short+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/12/14/video/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Empty post with video\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/12/14/video/\">Empty post with video</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Dec 14, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Test post | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Test post\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a basic post with various styles.\" />\n<meta property=\"og:description\" content=\"This is an example of a basic post with various styles.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2019-01-29T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Test post\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2019-01-29T00:00:00+00:00\",\"datePublished\":\"2019-01-29T00:00:00+00:00\",\"description\":\"This is an example of a basic post with various styles.\",\"headline\":\"Test post\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2019/01/29/test-post/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Test post</div>\n <p class=\"f4-mktg color-header-default\"></p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Test post\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jan 29, 2019\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Test+post&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F;t=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2019%2F01%2F29%2Ftest-post%2F%2F&title=Test+post\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <p>This is an example of a basic post with various styles.</p>\n\n<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>.</p>\n\n<p><a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Link to another post</a>.</p>\n\n<p>There should be whitespace between paragraphs.</p>\n\n<p>There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.</p>\n\n<h1 id=\"header-1\">Header 1</h1>\n\n<p>This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.</p>\n\n<h2 id=\"header-2\">Header 2</h2>\n\n<blockquote>\n <p>This is a blockquote following a header.</p>\n\n <p>When something is important enough, you do it even if the odds are not in your favor.</p>\n</blockquote>\n\n<h3 id=\"header-3\">Header 3</h3>\n\n<div class=\"language-js highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\">// Javascript code with syntax highlighting.</span>\n<span class=\"kd\">var</span> <span class=\"nx\">fun</span> <span class=\"o\">=</span> <span class=\"kd\">function</span> <span class=\"nx\">lang</span><span class=\"p\">(</span><span class=\"nx\">l</span><span class=\"p\">)</span> <span class=\"p\">{</span>\n <span class=\"nx\">dateformat</span><span class=\"p\">.</span><span class=\"nx\">i18n</span> <span class=\"o\">=</span> <span class=\"nx\">require</span><span class=\"p\">(</span><span class=\"dl\">'</span><span class=\"s1\">./lang/</span><span class=\"dl\">'</span> <span class=\"o\">+</span> <span class=\"nx\">l</span><span class=\"p\">)</span>\n <span class=\"k\">return</span> <span class=\"kc\">true</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</code></pre></div></div>\n\n<div class=\"language-ruby highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"c1\"># Ruby code with syntax highlighting</span>\n<span class=\"no\">GitHubPages</span><span class=\"o\">::</span><span class=\"no\">Dependencies</span><span class=\"p\">.</span><span class=\"nf\">gems</span><span class=\"p\">.</span><span class=\"nf\">each</span> <span class=\"k\">do</span> <span class=\"o\">|</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"n\">version</span><span class=\"o\">|</span>\n <span class=\"n\">s</span><span class=\"p\">.</span><span class=\"nf\">add_dependency</span><span class=\"p\">(</span><span class=\"n\">gem</span><span class=\"p\">,</span> <span class=\"s2\">\"= </span><span class=\"si\">#{</span><span class=\"n\">version</span><span class=\"si\">}</span><span class=\"s2\">\"</span><span class=\"p\">)</span>\n<span class=\"k\">end</span>\n</code></pre></div></div>\n\n<h4 id=\"header-4\">Header 4</h4>\n\n<ul>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n <li>This is an unordered list following a header.</li>\n</ul>\n\n<h5 id=\"header-5\">Header 5</h5>\n\n<ol>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n <li>This is an ordered list following a header.</li>\n</ol>\n\n<h6 id=\"header-6\">Header 6</h6>\n\n<table>\n <thead>\n <tr>\n <th style=\"text-align: left\">head1</th>\n <th style=\"text-align: left\">head two</th>\n <th style=\"text-align: left\">three</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good swedish fish</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">out of stock</td>\n <td style=\"text-align: left\">good and plenty</td>\n <td style=\"text-align: left\">nice</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good cookies</td>\n <td style=\"text-align: left\">good</td>\n </tr>\n <tr>\n <td style=\"text-align: left\">ok</td>\n <td style=\"text-align: left\">good licorice</td>\n <td style=\"text-align: left\">yum</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"theres-a-horizontal-rule-below-this\">There’s a horizontal rule below this.</h3>\n\n<hr />\n\n<h3 id=\"here-is-an-unordered-list\">Here is an unordered list:</h3>\n\n<ul>\n <li>Item foo</li>\n <li>Item bar</li>\n <li>Item baz</li>\n <li>Item zip</li>\n</ul>\n\n<h3 id=\"and-an-ordered-list\">And an ordered list:</h3>\n\n<ol>\n <li>Item one</li>\n <li>Item two</li>\n <li>Item three</li>\n <li>Item four</li>\n</ol>\n\n<h3 id=\"and-a-nested-list\">And a nested list:</h3>\n\n<ul>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item\n <ul>\n <li>level 3 item</li>\n <li>level 3 item</li>\n </ul>\n </li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item\n <ul>\n <li>level 2 item</li>\n <li>level 2 item</li>\n </ul>\n </li>\n <li>level 1 item</li>\n</ul>\n\n<h3 id=\"small-image\">Small image</h3>\n\n<p><img src=\"https://github.githubassets.com/images/icons/emoji/octocat.png\" alt=\"Octocat\" /></p>\n\n<h3 id=\"large-image\">Large image</h3>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Branching\" /></p>\n\n<h3 id=\"definition-lists-can-be-used-with-html-syntax\">Definition lists can be used with HTML syntax.</h3>\n\n<dl>\n<dt>Name</dt>\n<dd>Godzilla</dd>\n<dt>Born</dt>\n<dd>1952</dd>\n<dt>Birthplace</dt>\n<dd>Japan</dd>\n<dt>Color</dt>\n<dd>Green</dd>\n</dl>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.\n</code></pre></div></div>\n\n<div class=\"language-plaintext highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code>The final element.\n</code></pre></div></div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"style": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a topbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a topbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the topbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the topbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a topbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the topbar style.\",\"headline\":\"This is a topbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n<script>\n $(document).ready(function () {\n $('#expansion-btn').click(function () {\n $('.Extend').toggleClass('hide-sm');\n });\n });\n</script>\n<div class=\"Header position-sticky top-0 topbar\">\n <div class=\"flex-1\">\n <div class=\"d-flex\">\n <div class=\"Header-item\">\n <button id=\"expansion-btn\" class=\"btn-octicon mr-2 d-sm-none\"><span class=\"octicon octicon-three-bars-16\"></span></button>\n <a href=\"/github-pages-demo/\" class=\"Header-link h1 f4 d-flex flex-items-center\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </a>\n </div>\n <a href=\"/github-pages-demo/\" class=\"Header-item Header-link Header-item--full\">Jekyll Theme Profile</a>\n <div class=\"Header-item\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Header-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"Header-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"Header-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n <div class=\"d-flex\">\n <div class=\"Extend Header-item flex-column flex-sm-row flex-items-center width-full hide-sm\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a topbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the topbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a topbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+topbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F;t=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F%2F&title=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a stacked post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a stacked post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the stacked style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the stacked style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"twitter:title\" content=\"This is a stacked post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the stacked style.\",\"headline\":\"This is a stacked post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"Profile text-center mt-3\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 256px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n</div>\n<div class=\"Header d-flex z-2 position-sticky top-0 topbar\">\n <div class=\"Header-item flex-row flex-justify-center flex-1 hide-sm\">\n \n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-1 flex-sm-grow-0 flex-justify-start\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a stacked post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the stacked style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" class=\"cover-image rounded-2\" alt=\"This is a stacked post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+stacked+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F;t=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F%2F&title=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a sidebar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a sidebar post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the sidebar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the sidebar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"twitter:title\" content=\"This is a sidebar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the sidebar style.\",\"headline\":\"This is a sidebar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a sidebar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the sidebar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" class=\"cover-image rounded-2\" alt=\"This is a sidebar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+sidebar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F;t=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F%2F&title=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a appbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a appbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the appbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the appbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a appbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the appbar style.\",\"headline\":\"This is a appbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a appbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the appbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a appbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+appbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F;t=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F%2F&title=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"appbar": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a appbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a appbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the appbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the appbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a appbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the appbar style.\",\"headline\":\"This is a appbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-appbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a appbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the appbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a appbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+appbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F;t=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-appbar%2F%2F&title=This+is+a+appbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"sidebar": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with image | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with image\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-11-21T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" />\n<meta property=\"twitter:title\" content=\"Empty post with image\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-11-21T00:00:00+00:00\",\"datePublished\":\"2023-11-21T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with image\",\"image\":\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/11/21/empty/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with image</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" class=\"cover-image rounded-2\" alt=\"Empty post with image\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Nov 21, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+image&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F;t=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F11%2F21%2Fempty%2F%2F&title=Empty+post+with+image\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Welcome to Jekyll!\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/hello-world/\">Welcome to Jekyll!</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>You’ll find this post in your <code class=\"language-plaintext highlighter-rouge\">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class=\"language-plaintext highlighter-rouge\">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n",
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a sidebar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a sidebar post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the sidebar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the sidebar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" />\n<meta property=\"twitter:title\" content=\"This is a sidebar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the sidebar style.\",\"headline\":\"This is a sidebar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-sidebar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"d-lg-flex flex-1\">\n <script>\n $(document).ready(function () {\n $('#toolbar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n })\n $('#sidebar-btn').click(function () {\n $('.Sidebar').toggleClass('d-lg-block');\n $('.Toolbar-expand').toggleClass('d-lg-block');\n $('.Toolbar-collapse').toggleClass('d-lg-block');\n $('.Toolbar').toggleClass('flex-lg-column');\n\n })\n });\n</script>\n<div class=\"Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0\">\n <div class=\"flex-column flex-1 position-sticky top-0\">\n <div class=\"Toolbar topbar d-flex flex-row p-3 flex-lg-justify-end flex-justify-start\">\n <div class=\"Toolbar-expand d-flex flex-justify-center d-none\">\n <button id=\"sidebar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-right-16\"></span></button>\n </div>\n <div class=\"d-flex flex-justify-center d-lg-none\">\n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex flex-justify-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Toolbar-collapse d-flex flex-justify-center d-none d-lg-block\">\n <button id=\"toolbar-btn\" class=\"btn-octicon mr-2\"><span class=\"octicon octicon-chevron-left-16\"></span></button>\n </div>\n </div>\n <div class=\"Sidebar d-none d-lg-block Layout Layout-sidebar Layout--sidebar-wide\">\n <div class=\"text-center\">\n <div class=\"px-5 py-2\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 128px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n </div>\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-column\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n\n \n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a sidebar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the sidebar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" class=\"cover-image rounded-2\" alt=\"This is a sidebar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+sidebar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F;t=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-sidebar%2F%2F&title=This+is+a+sidebar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2023/11/21/empty/\">\n <img class=\"rounded-2\" src=\"https://www.allisonthackston.com/assets/img/cover-1920.jpg\" width=\"377\" height=\"200\" alt=\"Empty post with image\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2023/11/21/empty/\">Empty post with image</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Nov 21, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"stacked": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a stacked post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a stacked post style\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the stacked style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the stacked style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" />\n<meta property=\"twitter:title\" content=\"This is a stacked post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the stacked style.\",\"headline\":\"This is a stacked post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-stacked/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n <div class=\"Profile text-center mt-3\">\n\n<div class=\"Masthead\">\n <div class=\"CircleBadge\" style=\"width: 256px;\" >\n <a href=\"/github-pages-demo/\">\n <img src=\"https://avatars.githubusercontent.com/u/211580654?v=4\" alt=\"Jekyll Theme Profile\" >\n </a>\n </div>\n\n <h1 class=\"text-center my-3 lh-condensed overflow-wrap-word\">Jekyll Theme Profile</h1>\n \n<div class=\"f4 d-flex flex-items-center flex-justify-center \">\n \n <div class=\"mb-3 d-inline-flex flex-items-baseline\">\n <div class=\"h2 mr-2 v-align-middle\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </div>\n <a href=\"https://github.com/PrimerPages\">\n @PrimerPages\n </a>\n </div>\n</div>\n\n</div>\n\n <div class=\"py-2\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n</div>\n<div class=\"Header d-flex z-2 position-sticky top-0 topbar\">\n <div class=\"Header-item flex-row flex-justify-center flex-1 hide-sm\">\n \n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n <div class=\"d-flex flex-1 flex-sm-grow-0 flex-justify-start\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div class=\"d-flex\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a stacked post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the stacked style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" class=\"cover-image rounded-2\" alt=\"This is a stacked post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+stacked+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F;t=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-stacked%2F%2F&title=This+is+a+stacked+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a topbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-topbar/\">This is a topbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the topbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"topbar": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>This is a topbar post style | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"This is a topbar post style\" />\n<meta name=\"author\" content=\"George P. Burdell\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an example of a post with the topbar style.\" />\n<meta property=\"og:description\" content=\"This is an example of a post with the topbar style.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-07-16T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" />\n<meta property=\"twitter:title\" content=\"This is a topbar post style\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"author\":{\"@type\":\"Person\",\"name\":\"George P. Burdell\"},\"dateModified\":\"2023-07-16T00:00:00+00:00\",\"datePublished\":\"2023-07-16T00:00:00+00:00\",\"description\":\"This is an example of a post with the topbar style.\",\"headline\":\"This is a topbar post style\",\"image\":\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/style/2023/07/16/post-topbar/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\">\n \n<script>\n $(document).ready(function () {\n $('#expansion-btn').click(function () {\n $('.Extend').toggleClass('hide-sm');\n });\n });\n</script>\n<div class=\"Header position-sticky top-0 topbar\">\n <div class=\"flex-1\">\n <div class=\"d-flex\">\n <div class=\"Header-item\">\n <button id=\"expansion-btn\" class=\"btn-octicon mr-2 d-sm-none\"><span class=\"octicon octicon-three-bars-16\"></span></button>\n <a href=\"/github-pages-demo/\" class=\"Header-link h1 f4 d-flex flex-items-center\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n </a>\n </div>\n <a href=\"/github-pages-demo/\" class=\"Header-item Header-link Header-item--full\">Jekyll Theme Profile</a>\n <div class=\"Header-item\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n </div>\n <div class=\"Header-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"Header-link tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n <div class=\"Header-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"Header-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n <div class=\"d-flex\">\n <div class=\"Extend Header-item flex-column flex-sm-row flex-items-center width-full hide-sm\">\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/appbar\" class=\"Header-link\" >\n Appbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/sidebar\" class=\"Header-link\" >\n Sidebar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/stacked\" class=\"Header-link\" >\n Stacked\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/topbar\" class=\"Header-link\" >\n Topbar\n </a>\n</div>\n<div class=\"Header-item flex-justify-center f4 p-2\">\n <a href=\"/github-pages-demo/docs\" class=\"Header-link\" >\n Documentation\n </a>\n</div>\n\n </div>\n </div>\n </div>\n</div>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">This is a topbar post style</div>\n <p class=\"f4-mktg color-header-default\">This is an example of a post with the topbar style.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" class=\"cover-image rounded-2\" alt=\"This is a topbar post style\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">George P. Burdell</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Jul 16, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=This+is+a+topbar+post+style&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F;t=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fstyle%2F2023%2F07%2F16%2Fpost-topbar%2F%2F&title=This+is+a+topbar+post+style\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <h1 id=\"welcome-to-the-test-post\">Welcome to the Test Post</h1>\n\n<p>This is a sample post intended to test various styles provided by the theme. It includes headings, paragraphs, lists, code snippets, and more. Everything here is meant to look ordinary while helping you ensure your styles are working as expected.</p>\n\n<h2 id=\"subheading-example\">Subheading Example</h2>\n\n<p>This is a paragraph with <strong>bold text</strong>, <em>italic text</em>, and a <a href=\"https://jekyllrb.com/\">link to jekyll</a>. Text should wrap correctly, and spacing should be consistent.</p>\n\n<h3 id=\"another-subheading\">Another Subheading</h3>\n\n<p>Lists are a key part of content. Here’s an unordered list:</p>\n\n<ul>\n <li>Apples</li>\n <li>Bananas</li>\n <li>Grapes</li>\n</ul>\n\n<p>And an ordered list:</p>\n\n<ol>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ol>\n\n<h4 id=\"inline-elements\">Inline Elements</h4>\n\n<p>Some <code class=\"language-plaintext highlighter-rouge\">inline code</code> for testing, along with <code class=\"language-plaintext highlighter-rouge\">anotherSnippet</code> right here.</p>\n\n<h5 id=\"code-block\">Code Block</h5>\n\n<div class=\"language-html highlighter-rouge\"><div class=\"highlight\"><pre class=\"highlight\"><code><span class=\"nt\"><div</span> <span class=\"na\">class=</span><span class=\"s\">\"example\"</span><span class=\"nt\">></span>\n <span class=\"nt\"><p></span>Hello, world!<span class=\"nt\"></p></span>\n<span class=\"nt\"></div></span>\n</code></pre></div></div>\n\n<h6 id=\"blockquote\">Blockquote</h6>\n\n<blockquote>\n <p>This is a blockquote. It should stand out from the rest of the content.</p>\n</blockquote>\n\n<h2 id=\"tables\">Tables</h2>\n\n<p>Tables should be styled appropriately and should scroll if they are too wide.</p>\n\n<table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Stock</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Chair</td>\n <td>$50</td>\n <td>In stock</td>\n </tr>\n <tr>\n <td>Table</td>\n <td>$150</td>\n <td>Low stock</td>\n </tr>\n <tr>\n <td>Lamp</td>\n <td>$30</td>\n <td>Out of stock</td>\n </tr>\n </tbody>\n</table>\n\n<h3 id=\"images\">Images</h3>\n\n<p>Small images should be shown at their actual size.</p>\n\n<p><img src=\"https://placebear.com/g/300/200\" alt=\"Small Image\" /></p>\n\n<p>Large images should always scale down and fit in the content container.</p>\n\n<p><img src=\"https://placebear.com/g/1200/800\" alt=\"Large Image\" /></p>\n\n<h3 id=\"footnotes\">Footnotes</h3>\n<p>Here’s a simple footnote,<sup id=\"fnref:1\" role=\"doc-noteref\"><a href=\"#fn:1\" class=\"footnote\" rel=\"footnote\">1</a></sup> and here’s a longer one.<sup id=\"fnref:2\" role=\"doc-noteref\"><a href=\"#fn:2\" class=\"footnote\" rel=\"footnote\">2</a></sup></p>\n\n<h2 id=\"final-thoughts\">Final Thoughts</h2>\n\n<p>This post covers common content types.</p>\n<div class=\"footnotes\" role=\"doc-endnotes\">\n <ol>\n <li id=\"fn:1\" role=\"doc-endnote\">\n <p>This is the first footnote. <a href=\"#fnref:1\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n <li id=\"fn:2\" role=\"doc-endnote\">\n <p>Here’s one with multiple paragraphs and code.\n Indent paragraphs to include them in the footnote.\n <code class=\"language-plaintext highlighter-rouge\">my code</code>\n Add as many paragraphs as you like. <a href=\"#fnref:2\" class=\"reversefootnote\" role=\"doc-backlink\">↩</a></p>\n </li>\n </ol>\n</div>\n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/08/1200x630-AI-Unfurl-DARK-Inverto.png\" width=\"377\" height=\"200\" alt=\"This is a sidebar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-sidebar/\">This is a sidebar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the sidebar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/05/1200.630-Community-wLogo-e1698634509856.png\" width=\"377\" height=\"200\" alt=\"This is a stacked post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-stacked/\">This is a stacked post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the stacked style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">\n <img class=\"rounded-2\" src=\"https://github.blog/wp-content/uploads/2023/10/hero-light.jpg\" width=\"377\" height=\"200\" alt=\"This is a appbar post style\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/style/2023/07/16/post-appbar/\">This is a appbar post style</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\">This is an example of a post with the appbar style.</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"mr-3 mr-12px mt-1 f5-mktg text-bold\">George P. Burdell</span>\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jul 16, 2023</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
],
"video": [
"\n<!doctype html>\n<html lang=\"en\" data-color-mode=\"auto\" data-light-theme=\"light\" data-dark-theme=\"dark\">\n<head>\n <meta charset=\"utf-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <!-- HTML Meta Tags -->\n <!-- Begin Jekyll SEO tag v2.8.0 -->\n<title>Empty post with video | Jekyll Theme Profile</title>\n<meta name=\"generator\" content=\"Jekyll v3.10.0\" />\n<meta property=\"og:title\" content=\"Empty post with video\" />\n<meta property=\"og:locale\" content=\"en_US\" />\n<meta name=\"description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<meta property=\"og:description\" content=\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\" />\n<link rel=\"canonical\" href=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:url\" content=\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\" />\n<meta property=\"og:site_name\" content=\"Jekyll Theme Profile\" />\n<meta property=\"og:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"og:type\" content=\"article\" />\n<meta property=\"article:published_time\" content=\"2023-12-14T00:00:00+00:00\" />\n<meta name=\"twitter:card\" content=\"summary_large_image\" />\n<meta property=\"twitter:image\" content=\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\" />\n<meta property=\"twitter:title\" content=\"Empty post with video\" />\n<script type=\"application/ld+json\">\n{\"@context\":\"https://schema.org\",\"@type\":\"BlogPosting\",\"dateModified\":\"2023-12-14T00:00:00+00:00\",\"datePublished\":\"2023-12-14T00:00:00+00:00\",\"description\":\"This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.\",\"headline\":\"Empty post with video\",\"image\":\"https://primerpages.github.io/github-pages-demo/assets/img/default.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"},\"url\":\"https://primerpages.github.io/github-pages-demo/examples/2023/12/14/video/\"}</script>\n<!-- End Jekyll SEO tag -->\n\n\n <link href=\"/github-pages-demo/assets/css/theme.css\" rel=\"stylesheet\" type=\"text/css\">\n <link href=\"/github-pages-demo/assets/css/style.css\" rel=\"stylesheet\" type=\"text/css\">\n \n <link rel=\"icon\" type=\"image/x-icon\" href=\"/github-pages-demo/assets/img/favicon.ico\">\n\n <script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n <script src=\"/github-pages-demo/assets/js/theme-toggle.js\"></script>\n <script src=\"/github-pages-demo/assets/js/anchor-links.js\"></script>\n <script src=\"/github-pages-demo/assets/js/topbar.js\"></script>\n<style>\n</style>\n\n</head>\n\n\n<body class=\"min-height-full d-flex flex-column\"> \n \n\n<header class=\"AppHeader position-sticky top-0 z-2 border-bottom topbar\">\n <div class=\"AppHeader-item d-flex flex-justify-between p-2 flex-items-center\">\n <div class=\"d-flex d-sm-none\">\n \n<script>\n $(document).ready(function () {\n const $menu = $(\"#nav-menu\");\n const $closeButton = $(\".close-menu\");\n\n if ($menu.length && $closeButton.length) {\n $closeButton.click(() => $menu.removeAttr(\"open\")); // Properly closes the dropdown\n }\n });\n</script>\n<details class=\"details-reset details-overlay\" id=\"nav-menu\">\n <summary class=\"AppHeader-button btn btn-invisible\" aria-haspopup=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 6H20M4 12H20M4 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </summary>\n <details-menu class=\"SelectMenu\" role=\"menu\">\n <div class=\"SelectMenu-modal\">\n <div class=\"SelectMenu-header\">\n <div tabindex=\"-1\" class=\"SelectMenu-title\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"d-flex flex-justify-end\">\n <button class=\"SelectMenu-closeButton close-menu\" type=\"button\">\n <span class=\"octicon octicon-x-16\"></span>\n </button>\n </div>\n </div>\n\n <div class=\"SelectMenu-list\">\n <a href=\"/github-pages-demo/appbar\" class=\"SelectMenu-item\" role=\"menuitem\">Appbar</a>\n <a href=\"/github-pages-demo/sidebar\" class=\"SelectMenu-item\" role=\"menuitem\">Sidebar</a>\n <a href=\"/github-pages-demo/stacked\" class=\"SelectMenu-item\" role=\"menuitem\">Stacked</a>\n <a href=\"/github-pages-demo/topbar\" class=\"SelectMenu-item\" role=\"menuitem\">Topbar</a>\n <a href=\"/github-pages-demo/docs\" class=\"SelectMenu-item\" role=\"menuitem\">Documentation</a>\n </div>\n <div class=\"SelectMenu-footer\">\n <div class=\"ActionList-sectionDivider mt-0 mb-1\"></div>\n </div>\n </div>\n </details-menu>\n</details>\n\n </div>\n <div tabindex=\"-1\" class=\"d-flex flex-1 ml-3\" id=\"github-logo\">\n <a href=\"/github-pages-demo/\" class=\"AppHeader-link d-flex flex-items-center no-underline mr-3 h1\">\n <span class=\"octicon octicon-mark-github-24\"></span>\n <span class=\"h4 text-semibold mx-3\">Jekyll Theme Profile</span>\n </a>\n </div>\n <div class=\"AppHeader-item d-flex flex-items-center\">\n <div class=\"Toggle d-flex flex-items-center\">\n <button id=\"theme-toggle\" class=\"btn-octicon mr-2 tooltipped tooltipped-sw\" aria-label=\"Color mode\" type=\"button\"><span id=\"theme-icon\"\n class=\"octicon octicon-moon-24\"></span></button>\n</div>\n\n <div class=\"AppHeader-item hide-sm\">\n \n<div class=\"Repo-info\">\n <a href=\"https://github.com/PrimerPages/github-pages-demo\" class=\"AppHeader-link no-underline tooltipped tooltipped-s\" aria-label=\"Go to repository\">\n <div class=\"d-flex flex-row flex-justify-center Header-item\">\n\n <div class=\"mr-2 h2\"><span class=\"octicon octicon-git-branch-24\"></span></div>\n <div>\n <div>\n PrimerPages/github-pages-demo\n </div>\n <div class=\"d-flex flex-row\">\n \n <div class=\"mr-3\"><span><span class=\"octicon octicon-star-16\"></span> 0</div>\n <div class=\"mr-0\"><span><span class=\"octicon octicon-repo-forked-16\"></span> 0</span></div>\n \n </div>\n </div>\n\n </div>\n </a>\n</div>\n\n </div>\n \n <div class=\"AppHeader-item mr-0\">\n <a href=\"https://github.com/PrimerPages\" class=\"AppHeader-link d-flex flex-items-center\">\n <img class=\"avatar img-cover circle\" height=\"32\" width=\"32\" alt=\"Jekyll Theme Profile\"\n src=\"https://avatars.githubusercontent.com/u/211580654?v=4\">\n </a>\n </div>\n </div>\n </div>\n <div class=\"d-flex flex-items-center mt-2\">\n <div class=\"AppHeader-item width-full hide-sm\"><nav class=\"UnderlineNav\">\n <ul class=\"UnderlineNav-body flex-row list-style-none\">\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/appbar\" class=\"UnderlineNav-item m-2\" >\n Appbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/sidebar\" class=\"UnderlineNav-item m-2\" >\n Sidebar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/stacked\" class=\"UnderlineNav-item m-2\" >\n Stacked\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/topbar\" class=\"UnderlineNav-item m-2\" >\n Topbar\n </a>\n </li>\n <li class=\"d-inline-flex\">\n <a href=\"/github-pages-demo/docs\" class=\"UnderlineNav-item m-2\" >\n Documentation\n </a>\n </li>\n </ul>\n</nav>\n\n </div>\n </div>\n</header>\n\n <div class=\"d-flex flex-1 flex-column\">\n \n<div class=\"Blog flex-column flex-1 min-width-0\">\n <div class=\"BlogHeader position-relative border-top\">\n <div class=\"container-xl p-responsive\">\n <div class=\"col-12 offset-lg-1 col-lg-10 col-xl-7 mt-5 mt-lg-10 mb-6 mb-lg-8\">\n <div class=\"h3-mktg lh-condensed mb-3 color-header-default\">Empty post with video</div>\n <p class=\"f4-mktg color-header-default\">This is an empty post. It should show up in the timeline, but not encourage click-through or expansions.</p>\n </div>\n <div class=\"offset-lg-1 col-lg-10\">\n <div class=\"position-relative z-1\">\n <div class=\"image-container\">\n <img src=\"/github-pages-demo/assets/img/default.png\" class=\"cover-image rounded-2\" alt=\"Empty post with video\" />\n </div>\n </div>\n </div>\n </div>\n <div class=\"Blog position-absolute bottom-0 width-full border-top\" style=\"height:88px\">\n </div>\n </div>\n <div class=\"pb-5\">\n <div class=\"container-xl mx-auto p-responsive\">\n <!-- Post metadata -->\n <div class=\"pt-5\">\n <div class=\"col-12 offset-lg-1 col-lg-10\">\n <div class=\"text-mono f5-mktg color-fg-muted mb-12px\">Author</div>\n <div class=\"d-flex flex-nowrap pb-1 flex-items-start\">\n <div class=\"d-flex flex-wrap\">PrimerPages</div>\n <div\n class=\"d-block border-left flex-shrink-0 text-mono f5-mktg color-fg-muted mb-3 ml-auto pl-5\">\n Dec 14, 2023\n </div>\n </div>\n <div class=\"color-border-accent-emphasis border-bottom\"></div>\n </div>\n </div>\n <div class=\"mx-auto p-responsive pt-4 pt-md-7 pb-7 pb-md-9\">\n <div class=\"d-flex flex-wrap\">\n <div class=\"col-12 offset-lg-1 col-lg-1\">\n <ul class=\"list-style-none d-flex flex-lg-column position-sticky top-12\">\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://x.com/share?text=Empty+post+with+video&url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 1200 1227\" fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z\" />\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F;t=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.3 15.4\" height=\"18\">\n <path\n d=\"M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n <li class=\"mr-4 mr-lg-0 mb-4\">\n <a href=\"https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fprimerpages.github.io%2Fgithub-pages-demo%2Fexamples%2F2023%2F12%2F14%2Fvideo%2F%2F&title=Empty+post+with+video\"\n target=\"_blank\"\n class=\"d-flex flex-justify-center flex-items-center border circle social-aside\"\n data-proofer-ignore>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 19 18\" height=\"18\">\n <path\n d=\"M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z\"\n fill=\"currentColor\"></path>\n </svg>\n </a>\n </li>\n </ul>\n </div>\n <div class=\"col-12 col-lg-7 col-md-8 markdown-body\">\n \n <div id=\"Timeline-video-container\" class=\"image-container mb-5\">\n <iframe id=\"Timeline-video\" src=\"https://www.youtube.com/embed/E4WlUXrJgy4?si=BhUjhwehMIZME9Cf\" frameborder=\"0\" height=\"inherited\"\n width=\"inherited\"></iframe>\n </div>\n \n \n\n </div>\n <div class=\"col-12 col-md-4 col-lg-3 markdown-body\">\n <div class=\"d-none d-md-block position-sticky top-12 ml-5\">\n \n \n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"Related container-xl mx-auto p-responsive\">\n \n\n\n\n\n\n\n\n\n\n\n\n \n\n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n \n\n \n \n\n \n \n\n \n \n\n \n\n\n\n<h2 class=\"h5-mktg pb-3 mb-lg-3\">Related posts</h2>\n<div class=\"d-flex flex-wrap gutter\">\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/30/short-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test short post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/30/short-post/\">Test short post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is a short post. It should show up on the timeline without a “continue” option.</p>\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 30, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Syntax highlighter\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/syntax-highlighter/\">Syntax highlighter</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>Below are some languages and their representative styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n \n\n \n<!--Post card-->\n<div class=\"col-sm-6 col-lg-4 \">\n <div class=\"py-4 d-flex flex-column \">\n <div class=\"image-container\">\n <a href=\"/github-pages-demo/examples/2019/01/29/test-post/\">\n <img class=\"rounded-2\" src=\"/github-pages-demo/assets/img/default.png\" width=\"377\" height=\"200\" alt=\"Test post\">\n </a>\n </div>\n <h3 class=\"h6-mktg mb-12px\">\n <a class=\"Link--primary\" href=\"/github-pages-demo/examples/2019/01/29/test-post/\">Test post</a>\n </h3>\n <div class=\"f4-mktg color-fg-muted mb-0\"><p>This is an example of a basic post with various styles.</p>\n\n</div>\n <div class=\"mt-14px\">\n <div class=\"d-flex flex-items-center\">\n <div class=\"d-flex flex-items-end flex-wrap\">\n <span class=\"d-inline-block f5-mktg text-mono color-fg-muted mt-1\">Jan 29, 2019</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n</div>\n\n </div>\n </div>\n</div>\n\n </div><footer>\n <div class=\"footer py-3 color-bg-subtle border-top\">\n <div class=\"container-xl p-responsive-blog f6 py-4 d-sm-flex flex-justify-between flex-row-reverse flex-items-center\">\n <div class=\"flex-1\"></div>\n <div class=\"flex-0 mx-auto px-4\">\n <div>Made with <a href=\"https://www.althack.dev/jekyll-theme-profile/\">jekyll theme profile</a></div>\n </div>\n </div>\n </div>\n</footer>\n\n</body>\n\n</html>\n"
]
},
"static_files": [
{
"name": "README.md",
"collection": null,
"path": "/README.md",
"basename": "README",
"extname": ".md",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "appbar-icon.png",
"collection": null,
"path": "/assets/img/appbar-icon.png",
"basename": "appbar-icon",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "icon-bg.png",
"collection": null,
"path": "/assets/img/icon-bg.png",
"basename": "icon-bg",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "icon-sidebar.png",
"collection": null,
"path": "/assets/img/icon-sidebar.png",
"basename": "icon-sidebar",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "icon-stacked.png",
"collection": null,
"path": "/assets/img/icon-stacked.png",
"basename": "icon-stacked",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "icon-topbar.png",
"collection": null,
"path": "/assets/img/icon-topbar.png",
"basename": "icon-topbar",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "links.png",
"collection": null,
"path": "/assets/img/links.png",
"basename": "links",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "repositories.png",
"collection": null,
"path": "/assets/img/repositories.png",
"basename": "repositories",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "sidebar-icon.png",
"collection": null,
"path": "/assets/img/sidebar-icon.png",
"basename": "sidebar-icon",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "stacked-icon.png",
"collection": null,
"path": "/assets/img/stacked-icon.png",
"basename": "stacked-icon",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "topbar-icon.png",
"collection": null,
"path": "/assets/img/topbar-icon.png",
"basename": "topbar-icon",
"extname": ".png",
"modified_time": "2025-07-20 19:22:14 +0000"
},
{
"name": "default.png",
"collection": null,
"path": "/assets/img/default.png",
"basename": "default",
"extname": ".png",
"modified_time": "2025-07-20 19:22:17 +0000"
},
{
"name": "favicon.ico",
"collection": null,
"path": "/assets/img/favicon.ico",
"basename": "favicon",
"extname": ".ico",
"modified_time": "2025-07-20 19:22:17 +0000"
},
{
"name": "social-preview.png",
"collection": null,
"path": "/assets/img/social-preview.png",
"basename": "social-preview",
"extname": ".png",
"modified_time": "2025-07-20 19:22:17 +0000"
},
{
"name": "user-image.jpg",
"collection": null,
"path": "/assets/img/user-image.jpg",
"basename": "user-image",
"extname": ".jpg",
"modified_time": "2025-07-20 19:22:17 +0000"
},
{
"name": "anchor-links.js",
"collection": null,
"path": "/assets/js/anchor-links.js",
"basename": "anchor-links",
"extname": ".js",
"modified_time": "2025-07-20 19:22:17 +0000"
},
{
"name": "theme-toggle.js",
"collection": null,
"path": "/assets/js/theme-toggle.js",
"basename": "theme-toggle",
"extname": ".js",
"modified_time": "2025-07-20 19:22:17 +0000"
},
{
"name": "topbar.js",
"collection": null,
"path": "/assets/js/topbar.js",
"basename": "topbar",
"extname": ".js",
"modified_time": "2025-07-20 19:22:17 +0000"
}
],
"source": "/github/workspace/.",
"destination": "/github/workspace/./_site",
"collections_dir": "",
"plugins_dir": "9338f966e6a79d7c36b6031c75fdac03",
"layouts_dir": "_layouts",
"data_dir": "_data",
"includes_dir": "_includes",
"safe": true,
"include": [
".htaccess"
],
"exclude": [
"Gemfile",
"Gemfile.lock",
"node_modules",
"vendor/bundle/",
"vendor/cache/",
"vendor/gems/",
"vendor/ruby/",
"CNAME"
],
"keep_files": [
".git",
".svn"
],
"encoding": "utf-8",
"markdown_ext": "markdown,mkdown,mkdn,mkd,md",
"strict_front_matter": false,
"show_drafts": null,
"limit_posts": 0,
"future": false,
"unpublished": false,
"whitelist": [
"jekyll-coffeescript",
"jekyll-commonmark-ghpages",
"jekyll-feed",
"jekyll-gist",
"jekyll-github-metadata",
"jekyll-paginate",
"jekyll-redirect-from",
"jekyll-seo-tag",
"jekyll-sitemap",
"jekyll-avatar",
"jemoji",
"jekyll-mentions",
"jekyll-relative-links",
"jekyll-optional-front-matter",
"jekyll-readme-index",
"jekyll-default-layout",
"jekyll-titles-from-headings",
"jekyll-include-cache",
"jekyll-octicons",
"jekyll-remote-theme"
],
"plugins": [
"jekyll-coffeescript",
"jekyll-commonmark-ghpages",
"jekyll-gist",
"jekyll-github-metadata",
"jekyll-paginate",
"jekyll-relative-links",
"jekyll-optional-front-matter",
"jekyll-readme-index",
"jekyll-default-layout",
"jekyll-titles-from-headings",
"jekyll-remote-theme"
],
"markdown": "kramdown",
"highlighter": "rouge",
"lsi": false,
"excerpt_separator": "\n\n",
"incremental": false,
"detach": false,
"port": "4000",
"host": "127.0.0.1",
"baseurl": "/github-pages-demo",
"show_dir_listing": false,
"permalink": "pretty",
"paginate_path": "/blog/page:num",
"timezone": null,
"quiet": false,
"verbose": true,
"defaults": [
{
"scope": {
"path": "",
"type": "posts"
},
"values": {
"layout": "post",
"image": "/assets/img/default.png",
"toc": true
}
},
{
"scope": {
"path": "",
"type": "docs"
},
"values": {
"layout": "docs",
"index": "/docs/index.html",
"permalink": "/docs/:path:output_ext",
"toc": true
}
}
],
"liquid": {
"error_mode": "warn",
"strict_filters": false,
"strict_variables": false
},
"rdiscount": {
"extensions": [
]
},
"redcarpet": {
"extensions": [
]
},
"kramdown": {
"auto_ids": true,
"toc_levels": "1..6",
"entity_output": "as_char",
"smart_quotes": "lsquo,rsquo,ldquo,rdquo",
"input": "GFM",
"hard_wrap": false,
"guess_lang": true,
"footnote_nr": 1,
"show_warnings": false,
"gfm_quirks": "paragraph_end",
"syntax_highlighter_opts": {
"default_lang": "plaintext",
"guess_lang": true
},
"template": "",
"math_engine": "mathjax",
"syntax_highlighter": "rouge",
"coderay": {
},
"auto_ids": true,
"toc_levels": "1..6",
"entity_output": "as_char",
"smart_quotes": "lsquo,rsquo,ldquo,rdquo",
"input": "GFM",
"hard_wrap": false,
"guess_lang": true,
"footnote_nr": 1,
"show_warnings": false,
"gfm_quirks": "paragraph_end",
"syntax_highlighter_opts": {
"default_lang": "plaintext",
"guess_lang": true
},
"template": "",
"math_engine": "mathjax",
"syntax_highlighter": "rouge",
"coderay": {
}
},
"jailed": false,
"theme": "jekyll-theme-profile",
"sass": {
"style": "compressed"
},
"remote_theme": "PrimerPages/jekyll-theme-profile",
"title": "Jekyll Theme Profile",
"description": "Theme built with jekyll-theme-profile",
"image": "/assets/img/social-preview.png",
"repository": "PrimerPages/github-pages-demo",
"repo_info": true,
"user_metadata": true,
"profile_link": true,
"nav": [
{
"name": "Appbar",
"url": "/appbar"
},
{
"name": "Sidebar",
"url": "/sidebar"
},
{
"name": "Stacked",
"url": "/stacked"
},
{
"name": "Topbar",
"url": "/topbar"
},
{
"name": "Documentation",
"url": "/docs"
}
],
"links": [
{
"name": "Example Linktree page",
"url": "/linktree",
"octicon": "link"
},
{
"name": "Example Profile page",
"url": "/profile",
"octicon": "person"
},
{
"name": "Example Repositories page",
"url": "/repositories",
"octicon": "repo"
},
{
"name": "Example landing page",
"url": "/landing",
"octicon": "rocket"
},
{
"name": "Example blog index",
"url": "/blog",
"octicon": "comment"
},
{
"name": "Example category index",
"url": "/category",
"octicon": "stack"
},
{
"name": "Example tag index",
"url": "/tags",
"octicon": "tag"
},
{
"name": "Custom background",
"url": "/custom-background",
"octicon": "device-desktop"
},
{
"name": "Custom header",
"url": "/custom-header",
"octicon": "browser"
}
],
"repositories": {
"sort_by": "stars",
"limit": 24,
"exclude": {
"archived": true,
"forks": true,
"repositories": null
}
},
"related_by": "tags or categories",
"paginate": 7,
"relative_links": {
"enabled": true,
"collections": true
},
"gist": {
"noscript": false
},
"url": "https://primerpages.github.io",
"github": {
"api_url": "https://api.github.com",
"archived": false,
"baseurl": "/github-pages-demo",
"build_revision": "983ed9a73823472420724066d213c78304c74f8e",
"clone_url": "https://github.com/PrimerPages/github-pages-demo.git",
"contributors": [
{
"login": "athackst",
"id": 6098197,
"node_id": "MDQ6VXNlcjYwOTgxOTc=",
"avatar_url": "https://avatars.githubusercontent.com/u/6098197?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/athackst",
"html_url": "https://github.com/athackst",
"followers_url": "https://api.github.com/users/athackst/followers",
"following_url": "https://api.github.com/users/athackst/following{/other_user}",
"gists_url": "https://api.github.com/users/athackst/gists{/gist_id}",
"starred_url": "https://api.github.com/users/athackst/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/athackst/subscriptions",
"organizations_url": "https://api.github.com/users/athackst/orgs",
"repos_url": "https://api.github.com/users/athackst/repos",
"events_url": "https://api.github.com/users/athackst/events{/privacy}",
"received_events_url": "https://api.github.com/users/athackst/received_events",
"type": "User",
"user_view_type": "public",
"site_admin": false,
"contributions": 18
}
],
"disabled": false,
"environment": "production",
"help_url": "https://docs.github.com",
"hostname": "github.com",
"is_project_page": true,
"is_user_page": false,
"issues_url": "https://github.com/PrimerPages/github-pages-demo/issues",
"language": "HTML",
"latest_release": false,
"license": null,
"organization_members": [
],
"owner": {
"avatar_url": "https://avatars.githubusercontent.com/u/211580654?v=4",
"bio": null,
"blog": null,
"collaborators": null,
"company": null,
"created_at": "2025-05-13 21:18:32 UTC",
"description": "",
"email": null,
"followers": 0,
"following": 0,
"has_organization_projects": true,
"has_repository_projects": true,
"hireable": null,
"html_url": "https://github.com/PrimerPages",
"id": 211580654,
"is_verified": false,
"location": null,
"login": "PrimerPages",
"name": "PrimerPages",
"node_id": "O_kgDODJx27g",
"public_gists": 0,
"public_repos": 4,
"type": "Organization",
"updated_at": "2025-05-18 16:38:41 UTC"
},
"owner_display_name": "PrimerPages",
"owner_gravatar_url": "https://github.com/PrimerPages.png",
"owner_name": "PrimerPages",
"owner_url": "https://github.com/PrimerPages",
"pages_env": "production",
"pages_hostname": "github.io",
"private": false,
"project_tagline": null,
"project_title": "github-pages-demo",
"public_repositories": [
{
"id": 985944233,
"node_id": "R_kgDOOsRQqQ",
"name": "github-pages-demo",
"full_name": "PrimerPages/github-pages-demo",
"private": false,
"owner": {
"login": "PrimerPages",
"id": 211580654,
"node_id": "O_kgDODJx27g",
"avatar_url": "https://avatars.githubusercontent.com/u/211580654?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/PrimerPages",
"html_url": "https://github.com/PrimerPages",
"followers_url": "https://api.github.com/users/PrimerPages/followers",
"following_url": "https://api.github.com/users/PrimerPages/following{/other_user}",
"gists_url": "https://api.github.com/users/PrimerPages/gists{/gist_id}",
"starred_url": "https://api.github.com/users/PrimerPages/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/PrimerPages/subscriptions",
"organizations_url": "https://api.github.com/users/PrimerPages/orgs",
"repos_url": "https://api.github.com/users/PrimerPages/repos",
"events_url": "https://api.github.com/users/PrimerPages/events{/privacy}",
"received_events_url": "https://api.github.com/users/PrimerPages/received_events",
"type": "Organization",
"user_view_type": "public",
"site_admin": false
},
"html_url": "https://github.com/PrimerPages/github-pages-demo",
"description": null,
"fork": false,
"url": "https://api.github.com/repos/PrimerPages/github-pages-demo",
"forks_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/forks",
"keys_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/keys{/key_id}",
"collaborators_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/collaborators{/collaborator}",
"teams_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/teams",
"hooks_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/hooks",
"issue_events_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/issues/events{/number}",
"events_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/events",
"assignees_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/assignees{/user}",
"branches_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/branches{/branch}",
"tags_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/tags",
"blobs_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/git/blobs{/sha}",
"git_tags_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/git/tags{/sha}",
"git_refs_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/git/refs{/sha}",
"trees_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/git/trees{/sha}",
"statuses_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/statuses/{sha}",
"languages_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/languages",
"stargazers_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/stargazers",
"contributors_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/contributors",
"subscribers_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/subscribers",
"subscription_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/subscription",
"commits_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/commits{/sha}",
"git_commits_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/git/commits{/sha}",
"comments_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/comments{/number}",
"issue_comment_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/issues/comments{/number}",
"contents_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/contents/{+path}",
"compare_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/compare/{base}...{head}",
"merges_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/merges",
"archive_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/{archive_format}{/ref}",
"downloads_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/downloads",
"issues_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/issues{/number}",
"pulls_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/pulls{/number}",
"milestones_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/milestones{/number}",
"notifications_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/notifications{?since,all,participating}",
"labels_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/labels{/name}",
"releases_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/releases{/id}",
"deployments_url": "https://api.github.com/repos/PrimerPages/github-pages-demo/deployments",
"created_at": "2025-05-18 20:57:27 UTC",
"updated_at": "2025-07-20 19:21:57 UTC",
"pushed_at": "2025-07-20 19:21:53 UTC",
"git_url": "git://github.com/PrimerPages/github-pages-demo.git",
"ssh_url": "git@github.com:PrimerPages/github-pages-demo.git",
"clone_url": "https://github.com/PrimerPages/github-pages-demo.git",
"svn_url": "https://github.com/PrimerPages/github-pages-demo",
"homepage": "https://primerpages.github.io/github-pages-demo/",
"size": 13520,
"stargazers_count": 0,
"watchers_count": 0,
"language": "HTML",
"has_issues": true,
"has_projects": true,
"has_downloads": true,
"has_wiki": true,
"has_pages": true,
"has_discussions": false,
"forks_count": 0,
"mirror_url": null,
"archived": false,
"disabled": false,
"open_issues_count": 0,
"license": null,
"allow_forking": true,
"is_template": false,
"web_commit_signoff_required": false,
"topics": [
],
"visibility": "public",
"forks": 0,
"open_issues": 0,
"watchers": 0,
"default_branch": "main",
"permissions": {
"admin": false,
"maintain": false,
"push": false,
"triage": false,
"pull": false
},
"releases": [
],
"contributors": [
{
"login": "athackst",
"id": 6098197,
"node_id": "MDQ6VXNlcjYwOTgxOTc=",
"avatar_url": "https://avatars.githubusercontent.com/u/6098197?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/athackst",
"html_url": "https://github.com/athackst",
"followers_url": "https://api.github.com/users/athackst/followers",
"following_url": "https://api.github.com/users/athackst/following{/other_user}",
"gists_url": "https://api.github.com/users/athackst/gists{/gist_id}",
"starred_url": "https://api.github.com/users/athackst/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/athackst/subscriptions",
"organizations_url": "https://api.github.com/users/athackst/orgs",
"repos_url": "https://api.github.com/users/athackst/repos",
"events_url": "https://api.github.com/users/athackst/events{/privacy}",
"received_events_url": "https://api.github.com/users/athackst/received_events",
"type": "User",
"user_view_type": "public",
"site_admin": false,
"contributions": 18
}
]
},
{
"id": 985486864,
"node_id": "R_kgDOOr1WEA",
"name": "jekyll-github-template",
"full_name": "PrimerPages/jekyll-github-template",
"private": false,
"owner": {
"login": "PrimerPages",
"id": 211580654,
"node_id": "O_kgDODJx27g",
"avatar_url": "https://avatars.githubusercontent.com/u/211580654?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/PrimerPages",
"html_url": "https://github.com/PrimerPages",
"followers_url": "https://api.github.com/users/PrimerPages/followers",
"following_url": "https://api.github.com/users/PrimerPages/following{/other_user}",
"gists_url": "https://api.github.com/users/PrimerPages/gists{/gist_id}",
"starred_url": "https://api.github.com/users/PrimerPages/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/PrimerPages/subscriptions",
"organizations_url": "https://api.github.com/users/PrimerPages/orgs",
"repos_url": "https://api.github.com/users/PrimerPages/repos",
"events_url": "https://api.github.com/users/PrimerPages/events{/privacy}",
"received_events_url": "https://api.github.com/users/PrimerPages/received_events",
"type": "Organization",
"user_view_type": "public",
"site_admin": false
},
"html_url": "https://github.com/PrimerPages/jekyll-github-template",
"description": null,
"fork": false,
"url": "https://api.github.com/repos/PrimerPages/jekyll-github-template",
"forks_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/forks",
"keys_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/keys{/key_id}",
"collaborators_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/collaborators{/collaborator}",
"teams_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/teams",
"hooks_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/hooks",
"issue_events_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/issues/events{/number}",
"events_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/events",
"assignees_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/assignees{/user}",
"branches_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/branches{/branch}",
"tags_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/tags",
"blobs_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/git/blobs{/sha}",
"git_tags_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/git/tags{/sha}",
"git_refs_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/git/refs{/sha}",
"trees_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/git/trees{/sha}",
"statuses_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/statuses/{sha}",
"languages_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/languages",
"stargazers_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/stargazers",
"contributors_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/contributors",
"subscribers_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/subscribers",
"subscription_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/subscription",
"commits_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/commits{/sha}",
"git_commits_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/git/commits{/sha}",
"comments_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/comments{/number}",
"issue_comment_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/issues/comments{/number}",
"contents_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/contents/{+path}",
"compare_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/compare/{base}...{head}",
"merges_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/merges",
"archive_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/{archive_format}{/ref}",
"downloads_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/downloads",
"issues_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/issues{/number}",
"pulls_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/pulls{/number}",
"milestones_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/milestones{/number}",
"notifications_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/notifications{?since,all,participating}",
"labels_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/labels{/name}",
"releases_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/releases{/id}",
"deployments_url": "https://api.github.com/repos/PrimerPages/jekyll-github-template/deployments",
"created_at": "2025-05-17 21:37:57 UTC",
"updated_at": "2025-07-14 18:26:02 UTC",
"pushed_at": "2025-07-14 18:25:57 UTC",
"git_url": "git://github.com/PrimerPages/jekyll-github-template.git",
"ssh_url": "git@github.com:PrimerPages/jekyll-github-template.git",
"clone_url": "https://github.com/PrimerPages/jekyll-github-template.git",
"svn_url": "https://github.com/PrimerPages/jekyll-github-template",
"homepage": null,
"size": 50,
"stargazers_count": 0,
"watchers_count": 0,
"language": "Ruby",
"has_issues": true,
"has_projects": true,
"has_downloads": true,
"has_wiki": false,
"has_pages": true,
"has_discussions": false,
"forks_count": 0,
"mirror_url": null,
"archived": false,
"disabled": false,
"open_issues_count": 0,
"license": {
"key": "mit",
"name": "MIT License",
"spdx_id": "MIT",
"url": "https://api.github.com/licenses/mit",
"node_id": "MDc6TGljZW5zZTEz"
},
"allow_forking": true,
"is_template": true,
"web_commit_signoff_required": false,
"topics": [
],
"visibility": "public",
"forks": 0,
"open_issues": 0,
"watchers": 0,
"default_branch": "main",
"permissions": {
"admin": false,
"maintain": false,
"push": false,
"triage": false,
"pull": false
},
"releases": [
],
"contributors": [
{
"login": "athackst",
"id": 6098197,
"node_id": "MDQ6VXNlcjYwOTgxOTc=",
"avatar_url": "https://avatars.githubusercontent.com/u/6098197?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/athackst",
"html_url": "https://github.com/athackst",
"followers_url": "https://api.github.com/users/athackst/followers",
"following_url": "https://api.github.com/users/athackst/following{/other_user}",
"gists_url": "https://api.github.com/users/athackst/gists{/gist_id}",
"starred_url": "https://api.github.com/users/athackst/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/athackst/subscriptions",
"organizations_url": "https://api.github.com/users/athackst/orgs",
"repos_url": "https://api.github.com/users/athackst/repos",
"events_url": "https://api.github.com/users/athackst/events{/privacy}",
"received_events_url": "https://api.github.com/users/athackst/received_events",
"type": "User",
"user_view_type": "public",
"site_admin": false,
"contributions": 8
},
{
"login": "dependabot[bot]",
"id": 49699333,
"node_id": "MDM6Qm90NDk2OTkzMzM=",
"avatar_url": "https://avatars.githubusercontent.com/in/29110?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/dependabot%5Bbot%5D",
"html_url": "https://github.com/apps/dependabot",
"followers_url": "https://api.github.com/users/dependabot%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/dependabot%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/dependabot%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/dependabot%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/dependabot%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/dependabot%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/dependabot%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/dependabot%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/dependabot%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false,
"contributions": 7
}
]
},
{
"id": 985493342,
"node_id": "R_kgDOOr1vXg",
"name": "jekyll-meta-plugin",
"full_name": "PrimerPages/jekyll-meta-plugin",
"private": false,
"owner": {
"login": "PrimerPages",
"id": 211580654,
"node_id": "O_kgDODJx27g",
"avatar_url": "https://avatars.githubusercontent.com/u/211580654?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/PrimerPages",
"html_url": "https://github.com/PrimerPages",
"followers_url": "https://api.github.com/users/PrimerPages/followers",
"following_url": "https://api.github.com/users/PrimerPages/following{/other_user}",
"gists_url": "https://api.github.com/users/PrimerPages/gists{/gist_id}",
"starred_url": "https://api.github.com/users/PrimerPages/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/PrimerPages/subscriptions",
"organizations_url": "https://api.github.com/users/PrimerPages/orgs",
"repos_url": "https://api.github.com/users/PrimerPages/repos",
"events_url": "https://api.github.com/users/PrimerPages/events{/privacy}",
"received_events_url": "https://api.github.com/users/PrimerPages/received_events",
"type": "Organization",
"user_view_type": "public",
"site_admin": false
},
"html_url": "https://github.com/PrimerPages/jekyll-meta-plugin",
"description": "A lightweight Jekyll plugin that injects useful build-time metadata (Jekyll version, environment, Ruby version, etc.) into Liquid templates.",
"fork": false,
"url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin",
"forks_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/forks",
"keys_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/keys{/key_id}",
"collaborators_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/collaborators{/collaborator}",
"teams_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/teams",
"hooks_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/hooks",
"issue_events_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/issues/events{/number}",
"events_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/events",
"assignees_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/assignees{/user}",
"branches_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/branches{/branch}",
"tags_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/tags",
"blobs_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/git/blobs{/sha}",
"git_tags_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/git/tags{/sha}",
"git_refs_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/git/refs{/sha}",
"trees_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/git/trees{/sha}",
"statuses_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/statuses/{sha}",
"languages_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/languages",
"stargazers_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/stargazers",
"contributors_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/contributors",
"subscribers_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/subscribers",
"subscription_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/subscription",
"commits_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/commits{/sha}",
"git_commits_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/git/commits{/sha}",
"comments_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/comments{/number}",
"issue_comment_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/issues/comments{/number}",
"contents_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/contents/{+path}",
"compare_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/compare/{base}...{head}",
"merges_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/merges",
"archive_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/{archive_format}{/ref}",
"downloads_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/downloads",
"issues_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/issues{/number}",
"pulls_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/pulls{/number}",
"milestones_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/milestones{/number}",
"notifications_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/notifications{?since,all,participating}",
"labels_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/labels{/name}",
"releases_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/releases{/id}",
"deployments_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/deployments",
"created_at": "2025-05-17 22:02:59 UTC",
"updated_at": "2025-05-24 06:29:16 UTC",
"pushed_at": "2025-05-24 06:30:51 UTC",
"git_url": "git://github.com/PrimerPages/jekyll-meta-plugin.git",
"ssh_url": "git@github.com:PrimerPages/jekyll-meta-plugin.git",
"clone_url": "https://github.com/PrimerPages/jekyll-meta-plugin.git",
"svn_url": "https://github.com/PrimerPages/jekyll-meta-plugin",
"homepage": "https://primerpages.github.io/jekyll-meta-plugin/",
"size": 34,
"stargazers_count": 0,
"watchers_count": 0,
"language": "Ruby",
"has_issues": true,
"has_projects": true,
"has_downloads": true,
"has_wiki": true,
"has_pages": true,
"has_discussions": false,
"forks_count": 0,
"mirror_url": null,
"archived": false,
"disabled": false,
"open_issues_count": 0,
"license": {
"key": "mit",
"name": "MIT License",
"spdx_id": "MIT",
"url": "https://api.github.com/licenses/mit",
"node_id": "MDc6TGljZW5zZTEz"
},
"allow_forking": true,
"is_template": false,
"web_commit_signoff_required": false,
"topics": [
],
"visibility": "public",
"forks": 0,
"open_issues": 0,
"watchers": 0,
"default_branch": "main",
"permissions": {
"admin": false,
"maintain": false,
"push": false,
"triage": false,
"pull": false
},
"releases": [
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/releases/220772489",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/releases/220772489/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-meta-plugin/releases/220772489/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-meta-plugin/releases/tag/0.1.1",
"id": 220772489,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOOr1vXs4NKLiJ",
"tag_name": "0.1.1",
"target_commitish": "refs/heads/main",
"name": "Release 0.1.1",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-05-24 06:25:15 UTC",
"published_at": "2025-05-24 06:30:51 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/tarball/0.1.1",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/zipball/0.1.1",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Add integration tests (#7) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Add dry run to workflow_dispatch and add tag trigger to release workflow (#8) @athackst\r\n\r\n## :memo: Documentation\r\n\r\n* Fix build status badge in readme README.md (#5) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/releases/219325781",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/releases/219325781/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-meta-plugin/releases/219325781/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-meta-plugin/releases/tag/0.1.0",
"id": 219325781,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOOr1vXs4NEqVV",
"tag_name": "0.1.0",
"target_commitish": "refs/heads/main",
"name": "Release 0.1.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-05-18 07:03:29 UTC",
"published_at": "2025-05-18 07:10:18 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/tarball/0.1.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-meta-plugin/zipball/0.1.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Create initial jekyll-meta plugin (#1) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Fix gemspec to require file path instead of relative (#3) @athackst\r\n* Remove default to dry run from release script (#2) @athackst\r\n",
"mentions_count": 1
}
],
"contributors": [
{
"login": "athackst",
"id": 6098197,
"node_id": "MDQ6VXNlcjYwOTgxOTc=",
"avatar_url": "https://avatars.githubusercontent.com/u/6098197?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/athackst",
"html_url": "https://github.com/athackst",
"followers_url": "https://api.github.com/users/athackst/followers",
"following_url": "https://api.github.com/users/athackst/following{/other_user}",
"gists_url": "https://api.github.com/users/athackst/gists{/gist_id}",
"starred_url": "https://api.github.com/users/athackst/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/athackst/subscriptions",
"organizations_url": "https://api.github.com/users/athackst/orgs",
"repos_url": "https://api.github.com/users/athackst/repos",
"events_url": "https://api.github.com/users/athackst/events{/privacy}",
"received_events_url": "https://api.github.com/users/athackst/received_events",
"type": "User",
"user_view_type": "public",
"site_admin": false,
"contributions": 9
}
]
},
{
"id": 666952321,
"node_id": "R_kgDOJ8DigQ",
"name": "jekyll-theme-profile",
"full_name": "PrimerPages/jekyll-theme-profile",
"private": false,
"owner": {
"login": "PrimerPages",
"id": 211580654,
"node_id": "O_kgDODJx27g",
"avatar_url": "https://avatars.githubusercontent.com/u/211580654?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/PrimerPages",
"html_url": "https://github.com/PrimerPages",
"followers_url": "https://api.github.com/users/PrimerPages/followers",
"following_url": "https://api.github.com/users/PrimerPages/following{/other_user}",
"gists_url": "https://api.github.com/users/PrimerPages/gists{/gist_id}",
"starred_url": "https://api.github.com/users/PrimerPages/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/PrimerPages/subscriptions",
"organizations_url": "https://api.github.com/users/PrimerPages/orgs",
"repos_url": "https://api.github.com/users/PrimerPages/repos",
"events_url": "https://api.github.com/users/PrimerPages/events{/privacy}",
"received_events_url": "https://api.github.com/users/PrimerPages/received_events",
"type": "Organization",
"user_view_type": "public",
"site_admin": false
},
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile",
"description": "Github Primer based Jekyll Theme",
"fork": false,
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile",
"forks_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/forks",
"keys_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/keys{/key_id}",
"collaborators_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/collaborators{/collaborator}",
"teams_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/teams",
"hooks_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/hooks",
"issue_events_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/issues/events{/number}",
"events_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/events",
"assignees_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/assignees{/user}",
"branches_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/branches{/branch}",
"tags_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tags",
"blobs_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/git/blobs{/sha}",
"git_tags_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/git/tags{/sha}",
"git_refs_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/git/refs{/sha}",
"trees_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/git/trees{/sha}",
"statuses_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/statuses/{sha}",
"languages_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/languages",
"stargazers_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/stargazers",
"contributors_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/contributors",
"subscribers_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/subscribers",
"subscription_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/subscription",
"commits_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/commits{/sha}",
"git_commits_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/git/commits{/sha}",
"comments_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/comments{/number}",
"issue_comment_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/issues/comments{/number}",
"contents_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/contents/{+path}",
"compare_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/compare/{base}...{head}",
"merges_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/merges",
"archive_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/{archive_format}{/ref}",
"downloads_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/downloads",
"issues_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/issues{/number}",
"pulls_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/pulls{/number}",
"milestones_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/milestones{/number}",
"notifications_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/notifications{?since,all,participating}",
"labels_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/labels{/name}",
"releases_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases{/id}",
"deployments_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/deployments",
"created_at": "2023-07-16 06:21:09 UTC",
"updated_at": "2025-06-29 17:23:21 UTC",
"pushed_at": "2025-07-17 17:11:16 UTC",
"git_url": "git://github.com/PrimerPages/jekyll-theme-profile.git",
"ssh_url": "git@github.com:PrimerPages/jekyll-theme-profile.git",
"clone_url": "https://github.com/PrimerPages/jekyll-theme-profile.git",
"svn_url": "https://github.com/PrimerPages/jekyll-theme-profile",
"homepage": "https://primerpages.github.io/jekyll-theme-profile/",
"size": 15343,
"stargazers_count": 9,
"watchers_count": 9,
"language": "HTML",
"has_issues": true,
"has_projects": false,
"has_downloads": true,
"has_wiki": false,
"has_pages": true,
"has_discussions": false,
"forks_count": 1,
"mirror_url": null,
"archived": false,
"disabled": false,
"open_issues_count": 1,
"license": {
"key": "mit",
"name": "MIT License",
"spdx_id": "MIT",
"url": "https://api.github.com/licenses/mit",
"node_id": "MDc6TGljZW5zZTEz"
},
"allow_forking": true,
"is_template": false,
"web_commit_signoff_required": false,
"topics": [
"jekyll-theme",
"jekyll-themes"
],
"visibility": "public",
"forks": 1,
"open_issues": 1,
"watchers": 9,
"default_branch": "main",
"permissions": {
"admin": false,
"maintain": false,
"push": false,
"triage": false,
"pull": false
},
"releases": [
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/202143568",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/202143568/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/202143568/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/2.0.0",
"id": 202143568,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4MDHdQ",
"tag_name": "2.0.0",
"target_commitish": "refs/heads/main",
"name": "Release 2.0.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-06-29 17:23:18 UTC",
"published_at": "2025-06-29 17:43:39 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/2.0.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/2.0.0",
"body": "# What’s Changed\r\n\r\n## :zap: Major\r\n\r\n* Modify to support Github pages remote theme (#384) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix docs layout, add debug (#385) @athackst\r\n\r\n## Dependency Updates\r\n\r\n<details>\r\n<summary>6 changes</summary>\r\n\r\n* Bump athackst/htmlproofer-action from 0.3.2 to 0.4.0 (#387) @[dependabot[bot]](https://github.com/apps/dependabot)\r\n* Bump ruby/setup-ruby from 1.229.0 to 1.245.0 (#383) @[dependabot[bot]](https://github.com/apps/dependabot)\r\n* Bump ruby/setup-ruby from 1.228.0 to 1.229.0 (#369) @[dependabot[bot]](https://github.com/apps/dependabot)\r\n* Bump ruby/setup-ruby from 1.222.0 to 1.228.0 (#368) @[dependabot[bot]](https://github.com/apps/dependabot)\r\n* Bump ruby/setup-ruby from 1.221.0 to 1.222.0 (#363) @[dependabot[bot]](https://github.com/apps/dependabot)\r\n* Bump athackst/htmlproofer-action from 0.3.1 to 0.3.2 (#362) @[dependabot[bot]](https://github.com/apps/dependabot)\r\n</details>\r\n",
"reactions": {
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/202143568/reactions",
"total_count": 1,
"+1": 0,
"-1": 0,
"laugh": 0,
"hooray": 0,
"confused": 0,
"heart": 0,
"rocket": 1,
"eyes": 0
},
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/202118965",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/202118965/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/202118965/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.12.5",
"id": 202118965,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4MDBc1",
"tag_name": "1.12.5",
"target_commitish": "refs/heads/main",
"name": "Release 1.12.5",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-02-24 21:27:58 UTC",
"published_at": "2025-02-24 21:28:10 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.12.5",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.12.5",
"body": "# What’s Changed\n\n## :bug: Bug Fixes\n\n* Fix check for github pages (#360) @athackst\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201960229",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201960229/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201960229/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.12.4",
"id": 201960229,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4MCasl",
"tag_name": "1.12.4",
"target_commitish": "refs/heads/main",
"name": "Release 1.12.4",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-02-24 18:42:48 UTC",
"published_at": "2025-02-24 18:46:23 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.12.4",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.12.4",
"body": "# What’s Changed\n\n* Release v1.12.4 (#359) @athackst\n\n## :bug: Bug Fixes\n\n* Fix compatibility with github pages (#358) @athackst\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201958977",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201958977/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201958977/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.12.3",
"id": 201958977,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4MCaZB",
"tag_name": "1.12.3",
"target_commitish": "refs/heads/main",
"name": "Release 1.12.3",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-02-24 06:41:54 UTC",
"published_at": "2025-02-24 06:42:05 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.12.3",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.12.3",
"body": "# What’s Changed\n\n## :toolbox: Maintenance\n\n* Reducing required github-metadata to 2.9 (#356) @athackst\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201602307",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201602307/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201602307/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.12.2",
"id": 201602307,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4MBDUD",
"tag_name": "1.12.2",
"target_commitish": "refs/heads/main",
"name": "Release 1.12.2",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-02-24 05:01:14 UTC",
"published_at": "2025-02-24 05:01:27 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.12.2",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.12.2",
"body": "# What’s Changed\n\n* Release v1.12.2 (#355) @athackst\n* Update Gemfiles to rate limit GitHub calls (#354) @athackst\n\n## :toolbox: Maintenance\n\n* Add script to close stale releases to workflow (#353) @athackst\n\n## Dependency Updates\n\n* Bump peter-evans/create-pull-request from 5 to 7 (#352) @[dependabot[bot]](https://github.com/apps/dependabot)\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201595899",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201595899/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/201595899/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.12.1",
"id": 201595899,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4MBBv7",
"tag_name": "1.12.1",
"target_commitish": "refs/heads/main",
"name": "Release 1.12.1",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-02-21 07:26:51 UTC",
"published_at": "2025-02-21 07:27:02 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.12.1",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.12.1",
"body": "# What’s Changed\n\n## :bug: Bug Fixes\n\n* Add relative_url to docs dropdown nav links (#349) @athackst\n* Fix css theme colors (#348) @athackst\n* Fix custom header color (#347) @athackst\n* Fix post timeline card image to use relative_url (#346) @athackst\n\n## :memo: Documentation\n\n* Fix post descriptions (#350) @athackst\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/200778012",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/200778012/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/200778012/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.12.0",
"id": 200778012,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4L96Ec",
"tag_name": "1.12.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.12.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-02-21 06:32:16 UTC",
"published_at": "2025-02-21 06:32:28 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.12.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.12.0",
"body": "# What’s Changed\n\n## :rocket: New\n\n* Update primer css to 21.5.1 (#335) @athackst\n* Add option to set favicon from the config (#329) @athackst\n\n## :bug: Bug Fixes\n\n* Let include set social tooltip direction (#332) @athackst\n* Support links to tags from post timeline (#330) @athackst\n\n## :toolbox: Maintenance\n\n* Workflows use release token so other workflows are triggered (#344) @athackst\n* Cleanup masthead css (#343) @athackst\n* Fix lookup function for open release PRs (#340) @athackst\n* Update release draft workflow (#338) @athackst\n* Create release pr workflow (#336) @athackst\n* Set size of the masthead through include (#333) @athackst\n* Move unused images to demo so they're not included in theme (#331) @athackst\n* Cleanup unneeded lines in workflows (#328) @athackst\n* Remove bumping and add version determination to release workflow (#327) @athackst\n\n## :memo: Documentation\n\n* Update demo documentation (#326) @athackst\n\n## Dependency Updates\n\n* Bump ruby/setup-ruby from 1.214.0 to 1.221.0 (#325) @[dependabot[bot]](https://github.com/apps/dependabot)\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/197472736",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/197472736/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/197472736/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.11.0",
"id": 197472736,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4LxTHg",
"tag_name": "1.11.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.11.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-02-15 02:20:07 UTC",
"published_at": "2025-02-17 07:54:56 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.11.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.11.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add edit links to bottom of doc if edit_url is set (#317) @athackst\r\n* Make paginator navigation links an include file (#305) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix custom header sidebar so position is fixed (#324) @athackst\r\n* Polish up header colors, fix docs (#322) @athackst\r\n* Add color behind docs menu (#321) @athackst\r\n* Tag links to use relative_url (#320) @athackst\r\n* Fix all spelling words (#319) @athackst\r\n* Fix continue spelling in timeline card (#318) @athackst\r\n* Update timeline card to better handle continue and pagination (#315) @athackst\r\n* Fix all menus (#314) @athackst\r\n* Fix overlay menu in sidebar and stacked styles (#311) @athackst\r\n* Fix up how custom colors are handled, add header image (#310) @athackst\r\n* Update spacing between components (#306) @athackst\r\n* Fix formatting and improve encapsulation of link cards (#303) @athackst\r\n* Fix typo in post-timeline causing posts to not show up in profile layout (#302) @athackst\r\n* Refactor post-timeline to be more maintainable (#301) @athackst\r\n* Update the spacing of post-timeline card (#300) @athackst\r\n* Update default config (#293) @athackst\r\n* Update link card, linktree and profile to use include (#290) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Add tag index to root (#309) @athackst\r\n* Sort plugins (#308) @athackst\r\n* Remove unneeded spec files dir _plugins (#307) @athackst\r\n* Update page to include title if set and tag and category layouts to use (#304) @athackst\r\n* Add jekyll build and serve tasks (#295) @athackst\r\n* Remove incremental from serve script (#294) @athackst\r\n* Streamline vscode tasks and reduce dependencies (#289) @athackst\r\n* Update demo posts (#287) @athackst\r\n\r\n## :memo: Documentation\r\n\r\n* Add post for custom header (#323) @athackst\r\n* Add live demo to paginate timeline doc (#316) @athackst\r\n* Add octicons to links to demo pages (#299) @athackst\r\n* Update main readme file to link to site (#298) @athackst\r\n* Reorganize and update docs (#297) @athackst\r\n* Improve index and style pages for better preview (#296) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/197072830",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/197072830/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/197072830/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.10.1",
"id": 197072830,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4Lvxe-",
"tag_name": "1.10.1",
"target_commitish": "refs/heads/main",
"name": "Release 1.10.1",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-01-29 20:18:11 UTC",
"published_at": "2025-01-29 20:25:33 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.10.1",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.10.1",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Assign user_img where it is used (#286) @athackst\r\n* Update post timeline to attempt to find index (#285) @athackst\r\n* Remove video from post header (#284) @athackst\r\n* Add default image to masthead (#283) @athackst\r\n* Remove options from default config that aren't needed (#282) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Update devcontainer and vscode settings (#281) @athackst\r\n\r\n## Dependency Updates\r\n\r\n* Bump release-drafter/release-drafter from 6.0.0 to 6.1.0 (#278) @[dependabot[bot]](https://github.com/apps/dependabot)\r\n* Bump ruby/setup-ruby from 1.207.0 to 1.214.0 (#280) @[dependabot[bot]](https://github.com/apps/dependabot)\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/168568137",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/168568137/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/168568137/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.10.0",
"id": 168568137,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4KDCVJ",
"tag_name": "1.10.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.10.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2025-01-10 19:00:01 UTC",
"published_at": "2025-01-27 04:21:42 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.10.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.10.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Include _config.yml in gem file to provide a default config (#267) @athackst\r\n* Update docs layout and menu (#247) @athackst\r\n* Update linktree and linktree-card, make docs (#246) @athackst\r\n* Update post-timeline and add paginate_timeline layout (#245) @athackst\r\n* Add post-index include and update tag_index layout to use it (#244) @athackst\r\n* Add post-gallery include and update category_index layout to use it (#243) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix post timeline to work with post limit and reverse order (#248) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Drop deprecated ruby version 2.7 (#269) @athackst\r\n* Handle the case of empty public repositories (#268) @athackst\r\n* Update config so that a basic site can be built from main (#266) @athackst\r\n* Migrate from deprecated sass import (#264) @athackst\r\n* Add ports to devcontainer configuration (#242) @athackst\r\n* Update dev setup (#241) @athackst\r\n\r\n## Dependency Updates\r\n\r\n<details>\r\n<summary>12 changes</summary>\r\n\r\n* Bump ruby/setup-ruby from 1.206.0 to 1.207.0 (#275) @dependabot\r\n* Bump athackst/htmlproofer-action from 0.3.0 to 0.3.1 (#274) @dependabot\r\n* Bump ruby/setup-ruby from 1.204.0 to 1.206.0 (#273) @dependabot\r\n* Bump ruby/setup-ruby from 1.203.0 to 1.204.0 (#265) @dependabot\r\n* Bump ruby/setup-ruby from 1.202.0 to 1.203.0 (#262) @dependabot\r\n* Bump ruby/setup-ruby from 1.201.0 to 1.202.0 (#261) @dependabot\r\n* Bump ruby/setup-ruby from 1.200.0 to 1.201.0 (#260) @dependabot\r\n* Bump ruby/setup-ruby from 1.199.0 to 1.200.0 (#259) @dependabot\r\n* Bump ruby/setup-ruby from 1.197.0 to 1.199.0 (#258) @dependabot\r\n* Bump ruby/setup-ruby from 1.196.0 to 1.197.0 (#256) @dependabot\r\n* Bump ruby/setup-ruby from 1.191.0 to 1.196.0 (#255) @dependabot\r\n* Bump ruby/setup-ruby from 1.190.0 to 1.191.0 (#250) @dependabot\r\n</details>\r\n",
"reactions": {
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/168568137/reactions",
"total_count": 1,
"+1": 0,
"-1": 0,
"laugh": 0,
"hooray": 1,
"confused": 0,
"heart": 0,
"rocket": 0,
"eyes": 0
},
"mentions_count": 2
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/139745225",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/139745225/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/139745225/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.9.0",
"id": 139745225,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4IVFfJ",
"tag_name": "1.9.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.9.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2024-08-03 04:43:31 UTC",
"published_at": "2024-08-03 04:48:41 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.9.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.9.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Replace home with profile layout (#220) @athackst\r\n* Fix documentation layout and add docs (#219) @athackst\r\n* Add ability to set light and dark themes by name (#218) @athackst\r\n* Add video as heading image if defined (#217) @athackst\r\n* Add support for jekyll-category-pages plugin (#216) @athackst\r\n* Add class to masthead to adjust the circle badge size (#215) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix category_layout.html (#240) @athackst\r\n* Fix relative links and layouts page (#239) @athackst\r\n* Fix docs urls (#238) @athackst\r\n* Add rake to gemfile (#206) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Add local path to post create command (#214) @athackst\r\n\r\n## Dependency Updates\r\n\r\n<details>\r\n<summary>15 changes</summary>\r\n\r\n* Bump ruby/setup-ruby from 1.188.0 to 1.190.0 (#237) @dependabot\r\n* Bump ruby/setup-ruby from 1.187.0 to 1.188.0 (#236) @dependabot\r\n* Bump ruby/setup-ruby from 1.184.0 to 1.187.0 (#235) @dependabot\r\n* Bump ruby/setup-ruby from 1.183.0 to 1.184.0 (#232) @dependabot\r\n* Bump ruby/setup-ruby from 1.180.0 to 1.183.0 (#231) @dependabot\r\n* Bump ruby/setup-ruby from 1.179.0 to 1.180.0 (#227) @dependabot\r\n* Bump ruby/setup-ruby from 1.178.0 to 1.179.0 (#225) @dependabot\r\n* Bump ruby/setup-ruby from 1.175.1 to 1.178.0 (#224) @dependabot\r\n* Bump ruby/setup-ruby from 1.173.0 to 1.175.1 (#213) @dependabot\r\n* Bump actions/configure-pages from 4 to 5 (#210) @dependabot\r\n* Bump ruby/setup-ruby from 1.172.0 to 1.173.0 (#209) @dependabot\r\n* Bump ruby/setup-ruby from 1.171.0 to 1.172.0 (#208) @dependabot\r\n* Bump TimonVS/pr-labeler-action from 4 to 5 (#207) @dependabot\r\n* Bump ruby/setup-ruby from 1.162.0 to 1.171.0 (#204) @dependabot\r\n* Bump release-drafter/release-drafter from 5.25.0 to 6.0.0 (#205) @dependabot\r\n</details>\r\n",
"mentions_count": 2
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134843428",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134843428/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134843428/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.8.6",
"id": 134843428,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4ICYwk",
"tag_name": "1.8.6",
"target_commitish": "refs/heads/main",
"name": "Release 1.8.6",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-12-22 22:54:43 UTC",
"published_at": "2023-12-22 22:56:39 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.8.6",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.8.6",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Update cookie to be strict (#194) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Update jekyll site deps (#195) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134395615",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134395615/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134395615/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.8.5",
"id": 134395615,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4IArbf",
"tag_name": "1.8.5",
"target_commitish": "refs/heads/main",
"name": "Release 1.8.5",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-12-20 21:26:59 UTC",
"published_at": "2023-12-20 21:33:44 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.8.5",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.8.5",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix timeline video size (#189) @athackst\r\n* Fix the height of videos in timeline card (#186) @athackst\r\n\r\n## Dependency Updates\r\n\r\n* Bump actions/deploy-pages from 3 to 4 (#187) @dependabot\r\n* Bump actions/upload-pages-artifact from 2 to 3 (#188) @dependabot\r\n* Revert \"Bump actions/upload-pages-artifact from 2 to 3\" (#191) @athackst\r\n* Revert \"Bump actions/deploy-pages from 3 to 4\" (#190) @athackst\r\n",
"mentions_count": 2
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134384290",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134384290/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/134384290/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.8.4",
"id": 134384290,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4IAoqi",
"tag_name": "1.8.4",
"target_commitish": "refs/heads/main",
"name": "Release 1.8.4",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-12-18 21:08:39 UTC",
"published_at": "2023-12-18 21:27:07 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.8.4",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.8.4",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Remove Toolbar class from landing page (#185) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/133456177",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/133456177/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/133456177/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.8.3",
"id": 133456177,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4H9GEx",
"tag_name": "1.8.3",
"target_commitish": "refs/heads/main",
"name": "Release 1.8.3",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-12-15 20:50:39 UTC",
"published_at": "2023-12-17 21:48:24 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.8.3",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.8.3",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Remove duplicate title tag (#183) @athackst\r\n* Fix appearance of video on mobile in timeline (#181) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Rename 'example' to 'demo' (#184) @athackst\r\n* Add data-proofer-ignore to socials (#182) @athackst\r\n\r\n## Dependency Updates\r\n\r\n* Bump ruby/setup-ruby from 1.161.0 to 1.162.0 (#180) @dependabot\r\n",
"mentions_count": 2
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/132879125",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/132879125/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/132879125/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.8.2",
"id": 132879125,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4H65MV",
"tag_name": "1.8.2",
"target_commitish": "refs/heads/main",
"name": "Release 1.8.2",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-12-07 08:46:09 UTC",
"published_at": "2023-12-07 17:53:08 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.8.2",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.8.2",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Remove height-full from page (#179) @athackst\r\n\r\n## Dependency Updates\r\n\r\n* Bump actions/deploy-pages from 2 to 3 (#177) @dependabot\r\n* Bump actions/configure-pages from 3 to 4 (#176) @dependabot\r\n",
"mentions_count": 2
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/132353188",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/132353188/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/132353188/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.8.1",
"id": 132353188,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4H44yk",
"tag_name": "1.8.1",
"target_commitish": "refs/heads/main",
"name": "Release 1.8.1",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-12-03 05:46:17 UTC",
"published_at": "2023-12-03 05:49:28 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.8.1",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.8.1",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Add kramdown parser to dependencies (#175) @athackst\r\n* Fix post print styles (#174) @athackst\r\n* Fix location of social in footer to be right justified (#173) @athackst\r\n* Fix location of the toggle in the landing layout (#172) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131597155",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131597155/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131597155/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.8.0",
"id": 131597155,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4H2ANj",
"tag_name": "1.8.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.8.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-12-01 22:02:56 UTC",
"published_at": "2023-12-01 22:21:32 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.8.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.8.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add docs layout (#169) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix docs menu (#171) @athackst\r\n* Fix tag link (#166) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131491741",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131491741/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131491741/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.7.2",
"id": 131491741,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4H1med",
"tag_name": "1.7.2",
"target_commitish": "refs/heads/main",
"name": "Release 1.7.2",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-11-27 08:01:20 UTC",
"published_at": "2023-11-27 08:05:00 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.7.2",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.7.2",
"body": "# What’s Changed\r\n\r\n* Update nav so that paths highlight when active (#160) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Only show related posts if the size is >0 (#164) @athackst\r\n* Add div to extend page to full height of screen (#163) @athackst\r\n* Use either the excerpt or the description in post-card (#162) @athackst\r\n* Fix formatting of linktree layout and allow defining links per page (#159) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Update style/formatting (#165) @athackst\r\n* Fix permissions of jekyll workflow (#161) @athackst\r\n\r\n## :memo: Documentation\r\n\r\n* Add appbar to readme (#158) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131393909",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131393909/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/131393909/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.7.1",
"id": 131393909,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4H1Ol1",
"tag_name": "1.7.1",
"target_commitish": "refs/heads/main",
"name": "Release 1.7.1",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-11-26 16:26:09 UTC",
"published_at": "2023-11-26 16:29:42 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.7.1",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.7.1",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Remove unneeded dependencies from gemspec and refactor (#157) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130831816",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130831816/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130831816/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.7.0",
"id": 130831816,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4HzFXI",
"tag_name": "1.7.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.7.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-11-23 02:17:24 UTC",
"published_at": "2023-11-23 02:17:51 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.7.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.7.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add related posts to post page (#152) @athackst\r\n* Add tags to post layout and add tag page (#151) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix share link image for twitter->x (#154) @athackst\r\n* Fix toc so it doesn't improperly show on pages (#153) @athackst\r\n* Fix feature card (#150) @athackst\r\n* Update posts_limit to be able to be defined in page (#149) @athackst\r\n* Check for content before displaying continue in timeline block (#148) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Improve readability of comments in config (#155) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130711371",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130711371/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130711371/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.6.1",
"id": 130711371,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4Hyn9L",
"tag_name": "1.6.1",
"target_commitish": "refs/heads/main",
"name": "Release 1.6.1",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-11-21 17:47:54 UTC",
"published_at": "2023-11-21 17:52:21 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.6.1",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.6.1",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Move page style elements to .Page (#147) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130699545",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130699545/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/130699545/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.6.0",
"id": 130699545,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4HylEZ",
"tag_name": "1.6.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.6.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-11-21 17:28:35 UTC",
"published_at": "2023-11-21 17:30:52 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.6.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.6.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add new landing page (#145) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix formatting (#141) @athackst\r\n* Use either video or image in the post timeline (#140) @athackst\r\n* For posts use image for post or site image (#139) @athackst\r\n* set user_metadata from site only (#138) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Improve consistency in workflow names (#146) @athackst\r\n* Add permissions to bump_version workflow (#142) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/129872816",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/129872816/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/129872816/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.5.0",
"id": 129872816,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4HvbOw",
"tag_name": "1.5.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.5.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-11-21 06:01:22 UTC",
"published_at": "2023-11-21 06:03:59 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.5.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.5.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add repositories layout and test page (#133) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix stacked header top margin (#134) @athackst\r\n* Fix minor formatting issues (#132) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Update bump version workflow (#137) @athackst\r\n* Rename pr labeler workflow (#136) @athackst\r\n* Rename workflow publish_docs to jekyll_site (#135) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/119752951",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/119752951/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/119752951/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.4.0",
"id": 119752951,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4HI0j3",
"tag_name": "1.4.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.4.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-11-16 22:21:52 UTC",
"published_at": "2023-11-16 22:34:11 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.4.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.4.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add profile layout (#109) @athackst\r\n* Add linktree example and custom css for page (#96) @athackst\r\n* Update blog post style to match github blog (#94) @athackst\r\n* Redesign and add appbar option (#93) @athackst\r\n* Update the look of posts on paginate (#92) @athackst\r\n* Add footer (#83) @athackst\r\n* Allow post timeline to grab icon from type (#71) @athackst\r\n* Add print styles for clean prints of pages (#70) @athackst\r\n* Add menu for nav dropdown on mobile (#69) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Update stacked layout on mobile to show the header (#131) @athackst\r\n* Another try to fix the circle badge (#130) @athackst\r\n* Another try to fix circle badge in masthead (#129) @athackst\r\n* Fix various padding issues (#126) @athackst\r\n* Add padding to masthead image so border doesn't get cut off (#125) @athackst\r\n* Update anchor link height on resize (#123) @athackst\r\n* Remove gutter-condensed from posts (#122) @athackst\r\n* Fix padding for masthead (#121) @athackst\r\n* Fix timeline anchor to update on resize (#120) @athackst\r\n* Improve linkcard formatting (#119) @athackst\r\n* Change layout to of Profile to Page (#118) @athackst\r\n* Change tooltip position of mini-repo-info card to (#117) @athackst\r\n* Use image tag instead of social_image for SEO (#115) @athackst\r\n* Move from gutter-condensed to p-responsive (#114) @athackst\r\n* Attempt to fix nav overlay height for iphone - emulators not working (#113) @athackst\r\n* Simplify nav overlay (#112) @athackst\r\n* Switch to the SEO plugin (#111) @athackst\r\n* Fix sidebar, add collapse option (#110) @athackst\r\n* Fix minor formatting errors (#108) @athackst\r\n* Fix toc capture and convert README to post (#107) @athackst\r\n* Fix linktree width when viewing on mobile (#106) @athackst\r\n* Add additional padding to overlay to handle iphone screens better (#105) @athackst\r\n* Add script to calculate sticky position for timeline (#103) @athackst\r\n* Rename and make post timeline look more like github blog (#91) @athackst\r\n* Fix centering on masthead (#90) @athackst\r\n* Fix instagram and threads social icons (#87) @athackst\r\n* Fix footer formatting (#86) @athackst\r\n* Fix links to have a better max width (#84) @athackst\r\n* Fix toggle location so it doesn't cause scrolling (#82) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Update profile page name in config (#124) @athackst\r\n* Add default container extensions to devcontainer (#116) @athackst\r\n* Cleanup global assigns (#104) @athackst\r\n* Update link thumbnails (#95) @athackst\r\n* Add Link css to link-card for easier overriding (#89) @athackst\r\n* Move scripts to assets/js (#88) @athackst\r\n* Rename header.html to head to better classify contents (#77) @athackst\r\n\r\n## :memo: Documentation\r\n\r\n* Update contributing documentation (#128) @athackst\r\n\r\n## Dependency Updates\r\n\r\n<details>\r\n<summary>10 changes</summary>\r\n\r\n* Bump ruby/setup-ruby from 1.160.0 to 1.161.0 (#127) @dependabot\r\n* Bump ruby/setup-ruby from 1.159.0 to 1.160.0 (#85) @dependabot\r\n* Bump ruby/setup-ruby from 1.158.0 to 1.159.0 (#81) @dependabot\r\n* Bump ruby/setup-ruby from 1.156.0 to 1.158.0 (#80) @dependabot\r\n* Bump release-drafter/release-drafter from 5.24.0 to 5.25.0 (#78) @dependabot\r\n* Bump ruby/setup-ruby from 1.155.0 to 1.156.0 (#76) @dependabot\r\n* Bump ruby/setup-ruby from 1.154.0 to 1.155.0 (#75) @dependabot\r\n* Bump ruby/setup-ruby from 1.153.0 to 1.154.0 (#74) @dependabot\r\n* Bump ruby/setup-ruby from 1.152.0 to 1.153.0 (#73) @dependabot\r\n* Bump actions/checkout from 3 to 4 (#72) @dependabot\r\n</details>\r\n",
"mentions_count": 2
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/118062753",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/118062753/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/118062753/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.3.1",
"id": 118062753,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4HCX6h",
"tag_name": "1.3.1",
"target_commitish": "refs/heads/main",
"name": "Release 1.3.1",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-08-31 02:27:38 UTC",
"published_at": "2023-09-04 00:24:59 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.3.1",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.3.1",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Standardize theme toggle placement across all styles (#68) @athackst\r\n* Fix typos in meta tags (#65) @athackst\r\n* Increase topbar container size to xl (#64) @athackst\r\n* Fix margin to be padding so overlay works with background on header (#63) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Clean up assigns in layouts and includes (#67) @athackst\r\n* Cleanup assignments in header (#66) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/117925125",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/117925125/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/117925125/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.3.0",
"id": 117925125,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4HB2UF",
"tag_name": "1.3.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.3.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-08-20 21:09:19 UTC",
"published_at": "2023-08-20 21:09:57 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.3.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.3.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add optional header custom styling (#60) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Add required ruby version (#62) @athackst\r\n* Update syntax highlighting to handle line numbers (#61) @athackst\r\n* Fix typo in accessing background.overlay (#59) @athackst\r\n",
"reactions": {
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/117925125/reactions",
"total_count": 1,
"+1": 0,
"-1": 0,
"laugh": 0,
"hooray": 1,
"confused": 0,
"heart": 0,
"rocket": 0,
"eyes": 0
},
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/117226605",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/117226605/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/117226605/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.2.0",
"id": 117226605,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G_Lxt",
"tag_name": "1.2.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.2.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-08-14 20:49:20 UTC",
"published_at": "2023-08-14 20:50:43 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.2.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.2.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Set color of profile from _config.yml (#57) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/116980065",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/116980065/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/116980065/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.1.0",
"id": 116980065,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G-Plh",
"tag_name": "1.1.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.1.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-08-14 02:34:44 UTC",
"published_at": "2023-08-14 02:41:55 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.1.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.1.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add tooltips to repo-info and color toggle (#55) @athackst\r\n* Add mail and github to social links (#54) @athackst\r\n* Add general overlay option (#53) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Increase spacing between toggle and user image (#56) @athackst\r\n* Fix minor spacing issues (#52) @athackst\r\n* Truncate previous and next post titles (#51) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/116155614",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/116155614/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/116155614/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/1.0.0",
"id": 116155614,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G7GTe",
"tag_name": "1.0.0",
"target_commitish": "refs/heads/main",
"name": "Release 1.0.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-08-13 05:53:22 UTC",
"published_at": "2023-08-13 06:00:01 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/1.0.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/1.0.0",
"body": "# What’s Changed\r\n\r\n## :zap: Breaking\r\n\r\n* Update site social card image to 'social_image' (#45) @athackst\r\n* Rename link urls and images to 'url' and 'thumbnail' (#43) @athackst\r\n\r\n## :rocket: New\r\n\r\n* Add mini repo card and fix up default layouts (#48) @athackst\r\n* Update site social card image to 'social_image' (#45) @athackst\r\n* Add nav option for website (#44) @athackst\r\n* Add ability to set social icon colors from config (#42) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix spelling (#50) @athackst\r\n* Make nav items use relative-url (#49) @athackst\r\n* Fix formatting issue created by d-flex for mobile (#47) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Move images to media folder so gem doesn't include them (#46) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114765901",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114765901/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114765901/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/0.3.0",
"id": 114765901,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G1zBN",
"tag_name": "0.3.0",
"target_commitish": "refs/heads/main",
"name": "Release 0.3.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-08-10 06:36:07 UTC",
"published_at": "2023-08-10 06:43:17 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/0.3.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/0.3.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add background option (#40) @athackst\r\n* Add social media support for threads and x (#36) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix breadcrumbs (#35) @athackst\r\n* Update sidebar spacing (#34) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Fix/success check (#39) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114600581",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114600581/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114600581/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/0.2.5",
"id": 114600581,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G1KqF",
"tag_name": "0.2.5",
"target_commitish": "refs/heads/main",
"name": "Release 0.2.5",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-08-01 06:55:57 UTC",
"published_at": "2023-08-01 07:07:57 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/0.2.5",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/0.2.5",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Make canonical link from absolute_url (#31) @athackst\r\n* Add alt to social images (#30) @athackst\r\n* Fix masthead name so that it will wrap if needed (#29) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114574234",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114574234/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114574234/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/0.2.4",
"id": 114574234,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G1EOa",
"tag_name": "0.2.4",
"target_commitish": "refs/heads/main",
"name": "Release 0.2.4",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-07-31 22:58:24 UTC",
"published_at": "2023-07-31 23:04:35 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/0.2.4",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/0.2.4",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Append index.html to the meta urls seems to fix twitter cards. (#28) @athackst\r\n\r\n## Dependency Updates\r\n\r\n* Bump actions/upload-pages-artifact from 1 to 2 (#27) @dependabot\r\n",
"mentions_count": 2
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114438398",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114438398/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114438398/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/0.2.3",
"id": 114438398,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G0jD-",
"tag_name": "0.2.3",
"target_commitish": "refs/heads/main",
"name": "Release 0.2.3",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-07-31 06:32:37 UTC",
"published_at": "2023-07-31 06:35:32 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/0.2.3",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/0.2.3",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix folder URLs for meta and nav (#26) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114414457",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114414457/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114414457/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/0.2.2",
"id": 114414457,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G0dN5",
"tag_name": "0.2.2",
"target_commitish": "refs/heads/main",
"name": "Release 0.2.2",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-07-30 23:04:04 UTC",
"published_at": "2023-07-30 23:13:24 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/0.2.2",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/0.2.2",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Fix default permalink to include index so twitter cards will work. (#25) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114355894",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114355894/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114355894/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/0.2.1",
"id": 114355894,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4G0O62",
"tag_name": "0.2.1",
"target_commitish": "refs/heads/main",
"name": "Release 0.2.1",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-07-30 03:00:04 UTC",
"published_at": "2023-07-30 15:19:20 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/0.2.1",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/0.2.1",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Meta from an autogenerator to fix typos. (#24) @athackst\r\n* Fix twitter cards (#23) @athackst\r\n* Chanage type to website (#22) @athackst\r\n* Try changing meta type to object (#21) @athackst\r\n* Fix twitter image meta (#20) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114059595",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114059595/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/114059595/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/0.2.0",
"id": 114059595,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4GzGlL",
"tag_name": "0.2.0",
"target_commitish": "refs/heads/main",
"name": "Release 0.2.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-07-29 23:22:14 UTC",
"published_at": "2023-07-29 23:28:02 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/0.2.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/0.2.0",
"body": "# What’s Changed\r\n\r\n## :rocket: New\r\n\r\n* Add twitter card to header (#18) @athackst\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Use absoulte urls in meta data (#19) @athackst\r\n* Fix social image (#17) @athackst\r\n* Fix social and header links (#16) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Update docs workflow to include 'canonical' jekyll build->deploy (#15) @athackst\r\n* Add release task to devcontainer (#14) @athackst\r\n",
"mentions_count": 1
},
{
"url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/113942693",
"assets_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/releases/113942693/assets",
"upload_url": "https://uploads.github.com/repos/PrimerPages/jekyll-theme-profile/releases/113942693/assets{?name,label}",
"html_url": "https://github.com/PrimerPages/jekyll-theme-profile/releases/tag/0.1.0",
"id": 113942693,
"author": {
"login": "github-actions[bot]",
"id": 41898282,
"node_id": "MDM6Qm90NDE4OTgyODI=",
"avatar_url": "https://avatars.githubusercontent.com/in/15368?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/github-actions%5Bbot%5D",
"html_url": "https://github.com/apps/github-actions",
"followers_url": "https://api.github.com/users/github-actions%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/github-actions%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/github-actions%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/github-actions%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/github-actions%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/github-actions%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/github-actions%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/github-actions%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/github-actions%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false
},
"node_id": "RE_kwDOJ8Digc4GyqCl",
"tag_name": "0.1.0",
"target_commitish": "refs/heads/main",
"name": "Release 0.1.0",
"draft": false,
"immutable": false,
"prerelease": false,
"created_at": "2023-07-28 19:29:04 UTC",
"published_at": "2023-07-28 19:34:50 UTC",
"assets": [
],
"tarball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/tarball/0.1.0",
"zipball_url": "https://api.github.com/repos/PrimerPages/jekyll-theme-profile/zipball/0.1.0",
"body": "# What’s Changed\r\n\r\n## :bug: Bug Fixes\r\n\r\n* Add logic to handle paginate from assets so defaults will work (#13) @athackst\r\n* Fix nav links to be relative (#12) @athackst\r\n* Fix version spacing. (#11) @athackst\r\n* Fix page links (#10) @athackst\r\n* Update paginate links to be relative_url (#8) @athackst\r\n* Fix workflow files. (#6) @athackst\r\n\r\n## :toolbox: Maintenance\r\n\r\n* Fix bump spacing (#9) @athackst\r\n* Update to release token (#7) @athackst\r\n\r\n## Dependency Updates\r\n\r\n* Bump release-drafter/release-drafter from 5.20.0 to 5.24.0 (#3) @dependabot\r\n* Bump TimonVS/pr-labeler-action from 3.1.0 to 4.1.1 (#2) @dependabot\r\n",
"mentions_count": 2
}
],
"contributors": [
{
"login": "athackst",
"id": 6098197,
"node_id": "MDQ6VXNlcjYwOTgxOTc=",
"avatar_url": "https://avatars.githubusercontent.com/u/6098197?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/athackst",
"html_url": "https://github.com/athackst",
"followers_url": "https://api.github.com/users/athackst/followers",
"following_url": "https://api.github.com/users/athackst/following{/other_user}",
"gists_url": "https://api.github.com/users/athackst/gists{/gist_id}",
"starred_url": "https://api.github.com/users/athackst/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/athackst/subscriptions",
"organizations_url": "https://api.github.com/users/athackst/orgs",
"repos_url": "https://api.github.com/users/athackst/repos",
"events_url": "https://api.github.com/users/athackst/events{/privacy}",
"received_events_url": "https://api.github.com/users/athackst/received_events",
"type": "User",
"user_view_type": "public",
"site_admin": false,
"contributions": 293
},
{
"login": "dependabot[bot]",
"id": 49699333,
"node_id": "MDM6Qm90NDk2OTkzMzM=",
"avatar_url": "https://avatars.githubusercontent.com/in/29110?v=4",
"gravatar_id": "",
"url": "https://api.github.com/users/dependabot%5Bbot%5D",
"html_url": "https://github.com/apps/dependabot",
"followers_url": "https://api.github.com/users/dependabot%5Bbot%5D/followers",
"following_url": "https://api.github.com/users/dependabot%5Bbot%5D/following{/other_user}",
"gists_url": "https://api.github.com/users/dependabot%5Bbot%5D/gists{/gist_id}",
"starred_url": "https://api.github.com/users/dependabot%5Bbot%5D/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/dependabot%5Bbot%5D/subscriptions",
"organizations_url": "https://api.github.com/users/dependabot%5Bbot%5D/orgs",
"repos_url": "https://api.github.com/users/dependabot%5Bbot%5D/repos",
"events_url": "https://api.github.com/users/dependabot%5Bbot%5D/events{/privacy}",
"received_events_url": "https://api.github.com/users/dependabot%5Bbot%5D/received_events",
"type": "Bot",
"user_view_type": "public",
"site_admin": false,
"contributions": 56
}
]
}
],
"releases": [
],
"releases_url": "https://github.com/PrimerPages/github-pages-demo/releases",
"repository_name": "github-pages-demo",
"repository_nwo": "PrimerPages/github-pages-demo",
"repository_url": "https://github.com/PrimerPages/github-pages-demo",
"show_downloads": true,
"source": {
"branch": "main",
"path": "/"
},
"tar_url": "https://github.com/PrimerPages/github-pages-demo/tarball/main",
"url": "https://primerpages.github.io/github-pages-demo",
"versions": {
"jekyll": "3.10.0",
"jekyll-sass-converter": "1.5.2",
"kramdown": "2.4.0",
"kramdown-parser-gfm": "1.1.0",
"jekyll-commonmark-ghpages": "0.5.1",
"liquid": "4.0.4",
"rouge": "3.30.0",
"github-pages-health-check": "1.18.2",
"jekyll-redirect-from": "0.16.0",
"jekyll-sitemap": "1.4.0",
"jekyll-feed": "0.17.0",
"jekyll-gist": "1.5.0",
"jekyll-paginate": "1.1.0",
"jekyll-coffeescript": "1.2.2",
"jekyll-seo-tag": "2.8.0",
"jekyll-github-metadata": "2.16.1",
"jekyll-avatar": "0.8.0",
"jekyll-remote-theme": "0.4.3",
"jekyll-include-cache": "0.2.1",
"jemoji": "0.13.0",
"jekyll-mentions": "1.6.0",
"jekyll-relative-links": "0.6.1",
"jekyll-optional-front-matter": "0.3.2",
"jekyll-readme-index": "0.3.0",
"jekyll-default-layout": "0.1.5",
"jekyll-titles-from-headings": "0.5.3",
"minima": "2.5.1",
"jekyll-swiss": "1.0.0",
"jekyll-theme-primer": "0.6.0",
"jekyll-theme-architect": "0.2.0",
"jekyll-theme-cayman": "0.2.0",
"jekyll-theme-dinky": "0.2.0",
"jekyll-theme-hacker": "0.2.0",
"jekyll-theme-leap-day": "0.2.0",
"jekyll-theme-merlot": "0.2.0",
"jekyll-theme-midnight": "0.2.0",
"jekyll-theme-minimal": "0.2.0",
"jekyll-theme-modernist": "0.2.0",
"jekyll-theme-slate": "0.2.0",
"jekyll-theme-tactile": "0.2.0",
"jekyll-theme-time-machine": "0.2.0",
"ruby": "3.3.4",
"github-pages": "232",
"html-pipeline": "2.14.3",
"sass": "3.7.4",
"safe_yaml": "1.0.5",
"nokogiri": "1.16.7"
},
"wiki_url": "https://github.com/PrimerPages/github-pages-demo/wiki",
"zip_url": "https://github.com/PrimerPages/github-pages-demo/zipball/main"
}
}
Page Variables
{
"path": "_docs/debug.md",
"relative_path": "_docs/debug.md",
"excerpt": "<h2 id=\"jekyll-version\">Jekyll version</h2>\n\n",
"previous": null,
"id": "/docs/debug",
"collection": "docs",
"next": {
"path": "_docs/get-started.md",
"relative_path": "_docs/get-started.md",
"excerpt": "<p>This theme is based on GitHub’s primer style. It supports both light and dark modes, and four style options: <a href=\"../appbar.md\">appbar</a>, <a href=\"../sidebar.md\">sidebar</a>, <a href=\"../stacked.md\">stacked</a>, and <a href=\"../topbar.md\">topbar</a>,.</p>\n\n",
"previous": {
"path": "_docs/debug.md",
"relative_path": "_docs/debug.md",
"excerpt": "<h2 id=\"jekyll-version\">Jekyll version</h2>\n\n",
"previous": null,
"id": "/docs/debug",
"collection": "docs",
"next": {
"path": "_docs/get-started.md",
"relative_path": "_docs/get-started.md",
"id": "/docs/get-started",
"collection": "docs",
"url": "/docs/get-started.html",
"draft": false,
"categories": [
],
"layout": "docs",
"index": "/docs/index.html",
"permalink": "/docs/:path:output_ext",
"toc": true,
"title": "Get started",
"order": 1,
"image": "https://raw.githubusercontent.com/PrimerPages/jekyll-theme-profile/main/screenshot.png",
"slug": "get-started",
"ext": ".md",
"tags": [
],
"date": "2025-07-20 19:22:16 +0000"
},
"output": null,
"content": "## Jekyll version\n\n<pre>{{ jekyll.version }}</pre>\n\n## Jekyll environment\n\n<pre>{{ jekyll.environment }}</pre>\n\n## Site Variables\n\n<pre>{{ site | inspect }}</pre>\n\n## Page Variables\n\n<pre>{{ page | inspect }}</pre>\n\n{% if paginator %}\n## Paginator Variables\n\n<pre>{{ paginator | inspect }}</pre>\n{% endif %}\n",
"url": "/docs/debug.html",
"draft": false,
"categories": [
],
"layout": "docs",
"index": "/docs/index.html",
"permalink": "/docs/:path:output_ext",
"toc": true,
"title": "Debug",
"order": 100,
"slug": "debug",
"ext": ".md",
"tags": [
],
"date": "2025-07-20 19:22:16 +0000"
},
"id": "/docs/get-started",
"collection": "docs",
"next": {
"path": "_docs/index.html",
"relative_path": "_docs/index.html",
"excerpt": "<div class=\"d-flex flex-wrap gutter\">\n <div class=\"d-flex flex-column col-12 col-sm-6 col-lg-4 col-xl-3 pb-4\">\n <div class=\"pt-2 mb-4 text-normal\">\n <ul class=\"list-style-none pl-0\">\n \n \n <li>\n <a class=\"pt-2\" href=\"/github-pages-demo/docs/debug.html\">Debug</a>\n </li>\n \n \n \n <li>\n <a class=\"pt-2\" href=\"/github-pages-demo/docs/get-started.html\">Get started</a>\n </li>\n \n \n \n \n \n <li>\n <a class=\"pt-2\" href=\"/github-pages-demo/docs/posts.html\">Write a post</a>\n </li>\n \n \n </ul>\n </div>\n </div>\n</div>\n",
"previous": {
"path": "_docs/get-started.md",
"relative_path": "_docs/get-started.md",
"id": "/docs/get-started",
"collection": "docs",
"url": "/docs/get-started.html",
"draft": false,
"categories": [
],
"layout": "docs",
"index": "/docs/index.html",
"permalink": "/docs/:path:output_ext",
"toc": true,
"title": "Get started",
"order": 1,
"image": "https://raw.githubusercontent.com/PrimerPages/jekyll-theme-profile/main/screenshot.png",
"slug": "get-started",
"ext": ".md",
"tags": [
],
"date": "2025-07-20 19:22:16 +0000"
},
"id": "/docs/index",
"collection": "docs",
"next": {
"path": "_docs/posts.md",
"relative_path": "_docs/posts.md",
"id": "/docs/posts",
"collection": "docs",
"url": "/docs/posts.html",
"draft": false,
"categories": [
],
"layout": "docs",
"index": "/docs/index.html",
"permalink": "/docs/:path:output_ext",
"toc": true,
"title": "Write a post",
"order": 3,
"slug": "posts",
"ext": ".md",
"tags": [
],
"date": "2025-07-20 19:22:16 +0000"
},
"output": null,
"content": "<div class=\"d-flex flex-wrap gutter\">\n <div class=\"d-flex flex-column col-12 col-sm-6 col-lg-4 col-xl-3 pb-4\">\n <div class=\"pt-2 mb-4 text-normal\">\n <ul class=\"list-style-none pl-0\">\n {% for doc in site.docs %}\n {% unless doc.url == page.url %}\n <li>\n <a class=\"pt-2\" href=\"{{ doc.url | relative_url }}\">{{ doc.title }}</a>\n </li>\n {% endunless %}\n {% endfor %}\n </ul>\n </div>\n </div>\n</div>\n",
"url": "/docs/index.html",
"draft": false,
"categories": [
],
"layout": "page",
"index": "/docs/index.html",
"permalink": "/docs/:path:output_ext",
"toc": false,
"title": "Documentation",
"order": 0,
"slug": "index",
"ext": ".html",
"tags": [
],
"date": "2025-07-20 19:22:16 +0000"
},
"output": null,
"content": "This theme is based on GitHub's primer style. It supports both light and dark modes, and four style options: [appbar](/github-pages-demo/appbar/), [sidebar](/github-pages-demo/sidebar/), [stacked](/github-pages-demo/stacked/), and [topbar](/github-pages-demo/topbar/),.\n\n\n\n## Installation\n\nAdd this line to your Jekyll site's `Gemfile`:\n\n```ruby\ngem \"jekyll-theme-profile\"\n```\n\nAnd then execute:\n\n```shell\nbundle install\n```\n\nOr install it yourself as:\n\n```shell\ngem install jekyll-theme-profile\n```\n\n## Configuration\n\nAnd add this line to your Jekyll site's `_config.yml`:\n\n```yaml\ntheme: jekyll-theme-profile\nstyle: topbar # One of \"stacked\", \"sidebar\", \"topbar\", \"appbar\"\nrepository: PrimerPages/jekyll-theme-profile # for repository info to be included\nrepo_info: true # Show the information for the source of this project\nuser_metadata: true # Show the metadata associated with the user\nprofile_link: true # Show a link to the github profile for the user\n```\n\nOr you can start with a [sample config](https://github.com/PrimerPages/jekyll-theme-profile/blob/main/demo/_config.yml) that you can copy and customize.\n\n## Building\n\nBuild the site and make it available on a local server\n\n```shell\nbundle exec jekyll serve\n```\n",
"url": "/docs/get-started.html",
"draft": false,
"categories": [
],
"layout": "docs",
"index": "/docs/index.html",
"permalink": "/docs/:path:output_ext",
"toc": true,
"title": "Get started",
"order": 1,
"image": "https://raw.githubusercontent.com/PrimerPages/jekyll-theme-profile/main/screenshot.png",
"slug": "get-started",
"ext": ".md",
"tags": [
],
"date": "2025-07-20 19:22:16 +0000"
},
"output": null,
"content": "## Jekyll version\n\n<pre>{{ jekyll.version }}</pre>\n\n## Jekyll environment\n\n<pre>{{ jekyll.environment }}</pre>\n\n## Site Variables\n\n<pre>{{ site | inspect }}</pre>\n\n## Page Variables\n\n<pre>{{ page | inspect }}</pre>\n\n{% if paginator %}\n## Paginator Variables\n\n<pre>{{ paginator | inspect }}</pre>\n{% endif %}\n",
"url": "/docs/debug.html",
"draft": false,
"categories": [
],
"layout": "docs",
"index": "/docs/index.html",
"permalink": "/docs/:path:output_ext",
"toc": true,
"title": "Debug",
"order": 100,
"slug": "debug",
"ext": ".md",
"tags": [
],
"date": "2025-07-20 19:22:16 +0000"
}
