Add bootstrap 5 and bootblog5 themes in mako and jinja

AUTHORS.txt

@@ -38,6 +38,7 @@
 * `Detlev Zundel <https://github.com/laodzu>`_
 * `Dhruv Baldawa <https://github.com/dhruvbaldawa>`_
 * `Dirk Engling <https://github.com/erdgeist>`_
+* `Diego Carrasco <https://github.com/dacog>`_
 * `Dmitry Verkhoturov <https://github.com/paskal>`_
 * `Du Phan <https://github.com/fehiepsi>`_
 * `Duncan Lock <https://github.com/dflock>`_

CHANGES.txt

@@ -11,6 +11,7 @@ Features
   via an optional ``conf.py`` method ``TEMPLATE_ENGINE_FACTORY``.
 * Switch to pyproject.toml
 * Add path handler ``slug_source`` linking to source of post.
+* Add bootstrap5 and bootblog5 themes
 
 Bugfixes
 --------

nikola/data/symlinked.txt

@@ -25,6 +25,11 @@ nikola/data/themes/base/assets/js/luxon.min.js
 nikola/data/themes/base/messages/messages_cz.py
 nikola/data/themes/bootblog4-jinja/assets/css/bootblog.css
 nikola/data/themes/bootblog4-jinja/bundles
+nikola/data/themes/bootblog5-jinja/assets/css/bootstrap.min.css
+nikola/data/themes/bootblog5-jinja/bundles
+nikola/data/themes/bootblog5/assets/css/bootstrap.min.css
+nikola/data/themes/bootblog5/assets/js/bootstrap.min.js
+nikola/data/themes/bootblog5/assets/js/luxon.min.js
 nikola/data/themes/bootstrap4-jinja/assets/css/bootstrap.min.css
 nikola/data/themes/bootstrap4-jinja/assets/js/bootstrap.min.js
 nikola/data/themes/bootstrap4-jinja/assets/js/jquery.min.js
@@ -34,4 +39,13 @@ nikola/data/themes/bootstrap4/assets/css/bootstrap.min.css
 nikola/data/themes/bootstrap4/assets/js/bootstrap.min.js
 nikola/data/themes/bootstrap4/assets/js/jquery.min.js
 nikola/data/themes/bootstrap4/assets/js/popper.min.js
+nikola/data/themes/bootstrap5-jinja/assets/css/bootstrap.min.css
+nikola/data/themes/bootstrap5-jinja/assets/js/bootstrap.min.js
+nikola/data/themes/bootstrap5-jinja/assets/js/luxon.min.js
+nikola/data/themes/bootstrap5-jinja/assets/js/popper.min.js
+nikola/data/themes/bootstrap5-jinja/bundles
+nikola/data/themes/bootstrap5/assets/css/bootstrap.min.css
+nikola/data/themes/bootstrap5/assets/js/bootstrap.min.js
+nikola/data/themes/bootstrap5/assets/js/luxon.min.js
+nikola/data/themes/bootstrap5/assets/js/popper.min.js
 nikola/plugins/command/auto/livereload.js

nikola/data/themes/bootblog4-jinja/bootblog4-jinja.theme

@@ -9,4 +9,5 @@ tags = bootstrap
 
 [Family]
 family = bootblog4
-mako-version = bootstrap4
+mako-version = bootblog4
+

nikola/data/themes/bootblog5-jinja/README.md

@@ -0,0 +1,6 @@
+This is a theme based on Bootstrap 5 and the [blog example](https://getbootstrap.com/docs/5.3/examples/blog/) by @mdo.
+
+Note that unlike previous versions of Bootstrap, icon fonts are not built-in.
+You can use Font Awesome for this.
+
+This theme **does not** support Bootswatch font/color schemes.

nikola/data/themes/bootblog5-jinja/assets/css/bootblog.css

@@ -0,0 +1,224 @@
+/* stylelint-disable selector-list-comma-newline-after */
+
+.blog-header {
+  line-height: 1;
+  border-bottom: var(--bs-border-width) solid var(--bs-border-color);
+}
+
+.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;
+}
+
+.display-4 {
+  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-end {
+  height: 100%;
+  border-radius: 0 var(--bs-border-radius) var(--bs-border-radius) 0;
+}
+
+.flex-auto {
+  flex: 0 0 auto;
+}
+
+.h-150 { height: 150px; }
+@media (min-width: 768px) {
+  .h-md-150 { height: 150px; }
+}
+
+.h-250 { height: 250px; }
+@media (min-width: 768px) {
+  .h-md-250 { height: 250px; }
+}
+
+.border-top { border-top: var(--bs-border-width) solid var(--bs-border-color); }
+.border-bottom { border-bottom: var(--bs-border-width) solid var(--bs-border-color); }
+
+.shadow-sm { box-shadow: var(--bs-box-shadow-sm) !important; }
+
+/*
+ * Blog name and description
+ */
+.blog-title {
+  margin-bottom: 0;
+  font-size: 2rem;
+  font-weight: 400;
+}
+
+.blog-description {
+  font-size: 1.1rem;
+  color: var(--bs-secondary-color);
+}
+
+@media (min-width: 40em) {
+  .blog-title {
+    font-size: 3.5rem;
+  }
+}
+
+/* Pagination */
+.blog-pagination {
+  margin-bottom: 4rem;
+}
+
+.blog-pagination > .btn {
+  border-radius: 2rem;
+}
+
+/*
+ * Blog posts
+ */
+article {
+  margin-bottom: 4rem;
+}
+
+article:last-child {
+  margin-bottom: 0;
+}
+
+.entry-title {
+  margin-bottom: .25rem;
+  font-size: 2.5rem;
+}
+
+article .metadata {
+  margin-bottom: 1.25rem;
+  color: var(--bs-secondary-color);
+}
+
+/*
+ * Footer
+ */
+.blog-footer {
+  padding: 2.5rem 0;
+  color: var(--bs-secondary-color);
+  text-align: center;
+  background-color: var(--bs-tertiary-bg);
+  border-top: var(--bs-border-width) solid var(--bs-border-color);
+}
+
+.blog-footer p:last-child {
+  margin-bottom: 0;
+}
+
+@media (min-width: 576px) {
+  .nbb-navbar-toggler {
+    display: none;
+  }
+
+  .nbb-header {
+    justify-content: space-between !important;
+  }
+}
+
+/* Various fixes that make this theme look better for Nikola's needs */
+.navbar-brand {
+    padding: 0;
+    white-space: initial;
+}
+
+.bootblog5-featured-large-image {
+    height: 100%;
+    border-top-end-radius: var(--bs-border-radius) !important;
+    border-bottom-end-radius: var(--bs-border-radius) !important;
+}
+
+.bootblog5-featured-jumbotron-row {
+    margin-inline: 0;
+}
+
+.bootblog5-right-nav {
+    flex-direction: row;
+}
+
+.bootblog5-right-nav .nav-link {
+    padding-inline: .5rem;
+}
+
+.bootblog5-featured-text {
+    overflow: auto;
+}
+
+/* extend the mobile appearance to `sm`, because otherwise weird things happen */
+@media (min-width: 576px) {
+    .nbb-navbar-toggler {
+        display: block;
+    }
+}
+
+@media (max-width: 767px) {
+    .bootblog5-right-nav {
+        margin-top: 1rem;
+    }
+
+    .bootblog5-search-form-holder {
+        position: absolute;
+        top: 2.75rem;
+    }
+
+    .bootblog5-search-form-holder input.form-control {
+        width: 6rem;
+    }
+
+    .bootblog5-brand {
+        text-align: start;
+    }
+}
+
+@media (min-width: 768px) {
+    .nbb-navbar-toggler {
+        display: none;
+    }
+
+    .flex-collapse {
+        display: flex !important;
+    }
+
+    .bootblog5-search-form-holder {
+        display: block !important;
+    }
+
+    .bootblog5-brand {
+        text-align: center;
+    }
+}

nikola/data/themes/bootblog5-jinja/assets/css/bootstrap.min.css

@@ -0,0 +1 @@
+../../../../../../npm_assets/node_modules/bootstrap5/dist/css/bootstrap.min.css

nikola/data/themes/bootblog5-jinja/bootblog5-jinja.theme

@@ -0,0 +1,13 @@
+[Theme]
+engine = jinja
+parent = bootstrap5-jinja
+author = The Nikola Contributors
+author_url = https://getnikola.com/
+license = MIT
+based_on = Bootstrap 5 <http://getbootstrap.com/>, Bootstrap 4 blog example <http://getbootstrap.com/docs/4.0/examples/blog/>
+tags = bootstrap
+
+[Family]
+family = bootblog5
+mako-version = bootblog5
+

nikola/data/themes/bootblog5-jinja/bundles

@@ -0,0 +1 @@
+../bootblog5/bundles