https://bjschafer.com/posts/Recent content in Posts on Braxton's PortfolioHugo -- gohugo.ioenMon, 08 Jun 2020 08:06:25 +0600https://bjschafer.com/posts/introduction/Mon, 08 Jun 2020 08:06:25 +0600https://bjschafer.com/posts/introduction/<p>Greeting! This is an introduction post. This post tests the followings:</p> <ul> <li>Hero image is in the same directory as the post.</li> <li>This post should be at top of the sidebar.</li> <li>Post author should be the same as specified in <code>author.yaml</code> file.</li> </ul>https://bjschafer.com/posts/category/sub-category/rich-content/Mon, 08 Jun 2020 08:06:25 +0600https://bjschafer.com/posts/category/sub-category/rich-content/<p>This sample post tests the followings:</p> <ul> <li>Category, sub-category nesting in the sidebar.</li> <li>Hero image and other images are in <code>images</code> folder inside this post directory.</li> <li>Different media rendering like image, tweet, YouTube video, Vimeo video etc.</li> </ul> <h3 id="image-sample">Image Sample</h3> <img src="https://bjschafer.com/posts/category/sub-category/rich-content/images/forest.jpg" alt="Forest" class="center" > <div style="margin-top: rem;"></div> <h3 id="tweet-sample">Tweet Sample</h3> <blockquote class="twitter-tweet"><p lang="en" dir="ltr">Owl bet you&#39;ll lose this staring contest 🦉 <a href="https://t.co/eJh4f2zncC">pic.twitter.com/eJh4f2zncC</a></p>&mdash; San Diego Zoo Wildlife Alliance (@sandiegozoo) <a href="https://x.com/sandiegozoo/status/1453110110599868418?ref_src=twsrc%5Etfw">October 26, 2021</a></blockquote> <script async src="https://platform.x.com/widgets.js" charset="utf-8"></script> <div style="margin-top: rem;"></div> <h3 id="youtube-video-sample">YouTube Video Sample</h3> <div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;"> <iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share; fullscreen" loading="eager" referrerpolicy="strict-origin-when-cross-origin" src="https://www.youtube.com/embed/ZJthWmvUzzc?autoplay=0&amp;controls=1&amp;end=0&amp;loop=0&amp;mute=0&amp;start=0" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;" title="YouTube video"></iframe> </div> <div style="margin-top: rem;"></div> <h3 id="vimeo-video-sample">Vimeo Video Sample</h3> <div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;"> <iframe src="https://player.vimeo.com/video/48912912?dnt=0" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;" allow="fullscreen"> </iframe> </div>https://bjschafer.com/posts/shortcodes/Mon, 08 Jun 2020 08:06:25 +0600https://bjschafer.com/posts/shortcodes/<p>This is a sample post intended to test the followings:</p> <ul> <li>Default hero image.</li> <li>Different shortcodes.</li> </ul> <h2 id="alert">Alert</h2> <p>The following alerts are available in this theme.</p> <div class="alert success"> <span><i data-feather="check-circle"></i></span> <span><strong>This is sample alert with <code>type=&quot;success&quot;</code>.</strong></span> </div> <div class="alert danger"> <span><i data-feather="alert-octagon"></i></span> <span><strong>This is sample alert with <code>type=&quot;danger&quot;</code>.</strong></span> </div> <div class="alert warning"> <span><i data-feather="alert-triangle"></i></span> <span><strong>This is sample alert with <code>type=&quot;warning&quot;</code>.</strong></span> </div> <div class="alert info"> <span><i data-feather="info"></i></span> <span><strong>This is sample alert with <code>type=&quot;info&quot;</code>.</strong></span> </div> <div class="alert dark"> <span><i data-feather="alert-circle"></i></span> <span><strong>This is sample alert with <code>type=&quot;dark&quot;</code>.</strong></span> </div> <div class="alert primary"> <span><i data-feather="alert-circle"></i></span> <span><strong>This is sample alert with <code>type=&quot;primary&quot;</code>.</strong></span> </div> <div class="alert secondary"> <span><i data-feather="alert-circle"></i></span> <span><strong>This is sample alert with <code>type=&quot;secondary&quot;</code>.</strong></span> </div> <h2 id="image">Image</h2> <h4 id="a-sample-image-without-any-attribute">A sample image without any attribute.</h4> <img src="https://bjschafer.com/posts/shortcodes/boat.jpg" alt="A boat at the sea" > <div style="margin-top: 3rem;"></div> <h4 id="a-sample-image-with-height-and-width-attributes">A sample image with <code>height</code> and <code>width</code> attributes.</h4> <img src="https://bjschafer.com/posts/shortcodes/boat.jpg" alt="A boat at the sea" width="600" height="400" > <div style="margin-top: 3rem;"></div> <h4 id="a-center-aligned-image-with-height-and-width-attributes">A center aligned image with <code>height</code> and <code>width</code> attributes.</h4> <img src="https://bjschafer.com/posts/shortcodes/boat.jpg" alt="A boat at the sea" width="600" height="400" class="center" > <div style="margin-top: 3rem;"></div> <h4 id="a-image-with-float-attribute">A image with <code>float</code> attribute.</h4> <img src="https://bjschafer.com/posts/shortcodes/boat.jpg" alt="A boat at the sea" width="500" height="200" style="float: right;" > <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras egestas lectus sed leo ultricies ultricies. Praesent tellus risus, eleifend vel efficitur ac, venenatis sit amet sem. Ut ut egestas erat. Fusce ut leo turpis. Morbi consectetur sed lacus vitae vehicula. Cras gravida turpis id eleifend volutpat. Suspendisse nec ipsum eu erat finibus dictum. Morbi volutpat nulla purus, vel maximus ex molestie id. Nullam posuere est urna, at fringilla eros venenatis quis.</p>