source/scss: Import vanilla blog.css from Bootstrap example

I want to keep a vanilla version of theirs separate from my local
modifications.

source/scss/main.scss

@@ -1,113 +1,26 @@
-/* stylelint-disable selector-list-comma-newline-after */
+/* don't style links in headers */
-
-.blog-header {
-  line-height: 1;
-  border-bottom: 1px solid #e5e5e5;
-}
-
-.blog-header-logo {
-  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
-  font-size: 2.25rem;
-}
-
-.blog-header-logo:hover {
-  text-decoration: none;
-}
-
 h1, h2, h3, h4, h5, h6 {
-  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
-
   a, a:hover, a:focus {
     color: inherit;
     text-decoration: none;
   }
 }
 
-.display-4 {
+/* use larger height for featured blocks */
-  font-size: 2.5rem;
-}
-@media (min-width: 768px) {
-  .display-4 {
-    font-size: 3rem;
-  }
-}
-
-.nav-scroller {
-  position: relative;
-  z-index: 2;
-  height: 2.75rem;
-  overflow-y: hidden;
-}
-
-.nav-scroller .nav {
-  display: flex;
-  flex-wrap: nowrap;
-  padding-bottom: 1rem;
-  margin-top: -1px;
-  overflow-x: auto;
-  text-align: center;
-  white-space: nowrap;
-  -webkit-overflow-scrolling: touch;
-}
-
-.nav-scroller .nav-link {
-  padding-top: .75rem;
-  padding-bottom: .75rem;
-  font-size: .875rem;
-}
-
-.card-img-right {
-  height: 100%;
-  border-radius: 0 3px 3px 0;
-}
-
-.flex-auto {
-  flex: 0 0 auto;
-}
-
 .h-300 { height: 300px; }
 @media (min-width: 768px) {
   .h-md-300 { height: 300px; }
 }
 
-/* Pagination */
+/* make sure article images don't escape their parent */
-.blog-pagination {
-  margin-bottom: 4rem;
-}
-.blog-pagination > .btn {
-  border-radius: 2rem;
-}
-
-/*
- * Blog posts
- */
-.blog-post {
-  margin-bottom: 4rem;
-}
-.blog-post-title {
-  margin-bottom: .25rem;
-  font-size: 2.5rem;
-}
-.blog-post-meta {
-  margin-bottom: 1.25rem;
-  color: #727272;
-}
 article img {
   max-width: 100%;
   height: auto;
   margin: 13px auto;
 }
 
-/*
+/* italicize and mute figure captions */
- * Footer
+figcaption {
- */
+  font-style: italic;
-.blog-footer {
-  padding: 2.5rem 0;
   color: #727272;
-  text-align: center;
-  background-color: #f9f9f9;
-  border-top: .05rem solid #e5e5e5;
-}
-.blog-footer p:last-child {
-  margin-bottom: 0;
 }

source/scss/style.scss

@@ -2,6 +2,10 @@
 // see: node_modules/bootstrap/scss/bootstrap.scss
 @import 'bootstrap';
 
+// Bootstrap v5 Blog Example CSS
+// see: https://getbootstrap.com/docs/5.0/examples/blog/blog.css
+@import 'blog';
+
 // self-hosted Playfair font
 // see: https://medium.com/clio-calliope/making-google-fonts-faster-aadf3c02a36d
 @import 'fonts';