diff --git a/CHANGELOG.md b/CHANGELOG.md index 47ad2299e3..e365377c2d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,5 @@ # Changelog @@ -8,10 +8,43 @@ Useful links: Docsy [releases][] & [tags][]. Jump to the [latest][] release. For a list of issues targeted for the next release, see the [22Q2][] milestone. -## [0.5.0][] - next planned release (unpublished yet) +## 0.7.0 - next planned release (unpublished yet) + +**New**: + +**Breaking changes**: + +**Other changes**: + +## [0.6.0][] For the full list of the changes found in this release, see the [release -notes][0.5.0]. **BREAKING CHANGES** are documented below. +notes][0.6.0]. + +With this release we declare a feature freeze while we migrate to the newest +Bootstrap version. See [the announcement][bs-announcement] for more information. + +**New**: + +- **Simplified use of mermaid diagrams**: when using a `mermaid` code block on + your page, mermaid is now automatically enabled (needs hugo version >= 0.93.0). + For existing sites build with hugo 0.93.0+, parameter `mermaid.enable` + can be removed from site config. + +- **Add render hook for chem code blocks**: add auto-activation of `math` and + `chem` blocks via KateX and mhchem. Support for formula rendering activation + on individual pages only. Hugo version >= 0.93.0 required. + +**Breaking changes**: + + +**Other changes**: + + +## [0.5.1][] + +For the full list of the changes found in this release, see the [release +notes][0.5.1]. **BREAKING CHANGES** are documented below. **After you update** your project's Docsy: @@ -24,17 +57,44 @@ notes][0.5.0]. **BREAKING CHANGES** are documented below. **Breaking changes**: -- **Upgraded Bootstrap** to v4.6.2, resulting in some style changes. For - details, see [v4.6.2 release notes][]. -- **[Upgraded FontAwesome][]** to v6.1.2 from v5. While many icons were renamed, - the v5 names will still work. For all the details, see [What's changed][]. - +- **Tabbed panes, text display**. By default, the content of a tab inside a tabbed + pane is shown as code. As of version 0.4 of the shortcode, you can add the + parameter `code=false` to your `tabpane` or `tab` shortcode in order to render + tab content(s) as text (markdown or html). As of version 0.5 the name of this + parameter was changed, we now use `text=true` in order to mark content as text. +- **Display logo by default**. Most projects show their logo in the navbar. In + support of this majority, Docsy now displays a logo by default. For details on + how to hide the logo (or your brand name), see [Styling your project logo and + name][]. +- **Upgraded Bootstrap** to v4.6.2 from v4.6.1, resulting in some style changes + (such as an adjustment in the size of `small`). For details, see [v4.6.2 + release notes][]. +- **[Upgraded FontAwesome][]** to v6 from v5. While many icons were renamed, the + v5 names still work. For details about icon renames and more, see [What's + changed][]. +- **Search-box**: the HTML structure and class names have changed, due to the + Font Awesome upgrade, for both online and offline search. This may affect your + project if you have overridden search styling or scripts. + +**Other changes**: + +- By default, Docsy now uses the [gtag.js][] analytics library for all site + tags. For details, see [Adding Analytics > Setup][]. + +[Adding Analytics > Setup]: https://www.docsy.dev/docs/adding-content/feedback/#setup [v4.6.2 release notes]: https://github.com/twbs/bootstrap/releases/tag/v4.6.2 [docsy as an npm package]: https://www.docsy.dev/docs/get-started/other-options/#option-3-docsy-as-an-npm-package +[gtag.js]: https://support.google.com/analytics/answer/10220869 +[styling your project logo and name]: + https://www.docsy.dev/docs/adding-content/lookandfeel/#styling-your-project-logo-and-name [upgraded fontawesome]: https://fontawesome.com/docs/web/setup/upgrade/ [what's changed]: https://fontawesome.com/docs/web/setup/upgrade/whats-changed +## [0.5.0][] + +Unpublished. + ## [0.4.0][] For a full list of the changes to this release, see the [release notes][0.4.0]. @@ -96,6 +156,13 @@ For a full list of the changes to this release, see the [release notes][0.3.0]. [Algolia DocSearch v3](https://docsearch.algolia.com/docs/DocSearch-v3). If your site uses the deprecated DocSearch v2, you must [update your DocSearch code](https://docsearch.algolia.com/docs/migrating-from-v2). +- (**Edit**) [PR #1009][] inadvertently changed the base [Bootstrap styles for + cards][bs4cards], as well as the Docsy `highlight` style. For details, see + [issue #1154][]. Release [0.5.0][] includes a fix. + +[bs4cards]: https://getbootstrap.com/docs/4.1/components/card/ +[pr #1009]: https://github.com/google/docsy/pull/1009 +[issue #1154]: https://github.com/google/docsy/issues/1154 ## [0.2.0][] @@ -123,13 +190,16 @@ For a full list of the changes to this release, see the [release notes][0.x.y]. [@deining]: https://github.com/deining [@lisafc]: https://github.com/LisaFC -[0.2.0]: https://github.com/google/docsy/releases/v0.2.0 -[0.3.0]: https://github.com/google/docsy/releases/v0.3.0 -[0.4.0]: https://github.com/google/docsy/releases/v0.4.0 +[0.6.0]: https://github.com/google/docsy/releases/v0.6.0 +[0.5.1]: https://github.com/google/docsy/releases/v0.5.1 [0.5.0]: https://github.com/google/docsy/releases/v0.5.0 +[0.4.0]: https://github.com/google/docsy/releases/v0.4.0 +[0.3.0]: https://github.com/google/docsy/releases/v0.3.0 +[0.2.0]: https://github.com/google/docsy/releases/v0.2.0 [0.x.y]: # [22q2]: https://github.com/google/docsy/milestone/3 [hugo modules]: https://gohugo.io/hugo-modules/ [latest]: https://github.com/google/docsy/releases/latest [releases]: https://github.com/google/docsy/releases [tags]: https://github.com/google/docsy/tags +[bs-announcement]: https://github.com/google/docsy/discussions/1308 diff --git a/assets/js/click-to-copy.js b/assets/js/click-to-copy.js new file mode 100644 index 0000000000..5fdb041a86 --- /dev/null +++ b/assets/js/click-to-copy.js @@ -0,0 +1,86 @@ +let codeListings = document.querySelectorAll('.highlight > pre'); + +for (let index = 0; index < codeListings.length; index++) +{ + const codeSample = codeListings[index].querySelector('code'); + const copyButton = document.createElement("button"); + copyButton.setAttribute('type', 'button'); + copyButton.onclick = function() { copyCode(codeSample); }; + copyButton.classList.add('fas', 'fa-copy'); + + const buttonTooltip = document.createElement('div'); + buttonTooltip.classList.add('c2c-tooltip'); + buttonTooltip.setAttribute('role', 'tooltip'); + buttonTooltip.innerHTML += 'Copy to clipboard'; + + const buttonDiv = document.createElement('div'); + buttonDiv.classList.add('click-to-copy'); + + // Use Popper to create and handle the tooltip behavior. + + const popperInstance = Popper.createPopper(copyButton, buttonTooltip, + { + modifiers: + [ + { + name: 'offset', + options: + { + offset: [0, -48], + }, + }, + ], + }); + + copyButton.addEventListener('click', () => + { + buttonTooltip.innerHTML = 'Copied!'; + }); + + copyButton.addEventListener('mouseenter', () => + { + buttonTooltip.setAttribute('show-tooltip', ''); + + // Enable eventListeners when the code block is on the viewport + + popperInstance.setOptions((options) => ({ + ...options, + modifiers: + [ + ...options.modifiers, + { name: 'eventListeners', enabled: true }, + ], + })); + popperInstance.update(); + }); + + copyButton.addEventListener('mouseleave', () => + { + buttonTooltip.removeAttribute('show-tooltip'); + + // Reset the message in case the button was clicked + buttonTooltip.innerHTML = 'Copy to clipboard'; + + // Disble eventListeners when the code block is NOT on the viewport + + popperInstance.setOptions((options) => ({ + ...options, + modifiers: + [ + ...options.modifiers, + { name: 'eventListeners', enabled: false }, + ], + })); + }); + + buttonDiv.append(copyButton); + buttonDiv.append(buttonTooltip); + codeListings[index].insertBefore(buttonDiv, codeSample); + +} + +function copyCode(codeSample) +{ + navigator.clipboard.writeText(codeSample.textContent.trim()); +} + diff --git a/assets/js/mermaid.js b/assets/js/mermaid.js index 821e567872..6b021d416d 100644 --- a/assets/js/mermaid.js +++ b/assets/js/mermaid.js @@ -1,18 +1,23 @@ -{{ with .Site.Params.mermaid }} -{{ if .enable }} (function($) { var needMermaid = false; + +{{ if ge hugo.Version "0.93.0" -}} + if ($('.mermaid').length > 0) { + needMermaid = true; + }; +{{ else -}} $('.language-mermaid').parent().replaceWith(function() { needMermaid = true; return $('
').text($(this).text());
     });
+{{ end -}}
 
     if (!needMermaid)  {
         mermaid.initialize({startOnLoad: false});
         return;
     }
 
-    var params = {{ . | jsonify | safeJS }};
+    var params = {{ .Site.Params.mermaid | jsonify | safeJS }};
 
     // site params are stored with lowercase keys; lookup correct casing
     // from Mermaid default config.
@@ -34,5 +39,3 @@
     settings.startOnLoad = true;
     mermaid.initialize(settings);
 })(jQuery);
-{{ end }}
-{{ end }}
diff --git a/assets/js/offline-search.js b/assets/js/offline-search.js
index 55e8a81caf..666a4b45d1 100644
--- a/assets/js/offline-search.js
+++ b/assets/js/offline-search.js
@@ -4,7 +4,7 @@
     'use strict';
 
     $(document).ready(function () {
-        const $searchInput = $('.td-search-input');
+        const $searchInput = $('.td-search input');
 
         //
         // Options for popover
@@ -14,7 +14,7 @@
         $searchInput.data('placement', 'bottom');
         $searchInput.data(
             'template',
-            ''
+            ''
         );
 
         //
@@ -130,11 +130,8 @@
                             .css({ fontWeight: 'bold' })
                     )
                     .append(
-                        $('')
-                            .addClass('fas fa-times search-result-close-button')
-                            .css({
-                                cursor: 'pointer',
-                            })
+                        $('')
+                            .addClass('td-offline-search-results__close-button')
                     )
             );
 
@@ -182,14 +179,14 @@
             }
 
             $targetSearchInput.on('shown.bs.popover', () => {
-                $('.search-result-close-button').on('click', () => {
+                $('.td-offline-search-results__close-button').on('click', () => {
                     $targetSearchInput.val('');
                     $targetSearchInput.trigger('change');
                 });
             });
 
             $targetSearchInput
-                .data('content', $html[0].outerHTML)
+                .data('content', $html[0])
                 .popover('show');
         };
     });
diff --git a/assets/js/search.js b/assets/js/search.js
index 83fbb155d5..2ae687c791 100644
--- a/assets/js/search.js
+++ b/assets/js/search.js
@@ -21,7 +21,7 @@ limitations under the License.
     var Search = {
         init: function() {
             $(document).ready(function() {
-               $(document).on('keypress', '.td-search-input', function(e) {
+               $(document).on('keypress', '.td-search input', function(e) {
                     if (e.keyCode !== 13) {
                         return
                     }
diff --git a/assets/scss/_code.scss b/assets/scss/_code.scss
index d491beeb45..b96850bff6 100644
--- a/assets/scss/_code.scss
+++ b/assets/scss/_code.scss
@@ -7,10 +7,56 @@
 	
         margin: 2rem 0;
         padding: 0;
-	    
+        position: relative;
+
+        .click-to-copy {
+            display: block;
+            text-align: right;
+            height: 1ex;
+        }
+
         pre {
             margin: 0;
             padding: 1rem;
+
+            // Default click-to-copy button
+
+            button {
+               position: absolute;
+               color: $gray-400;
+               border-radius: 3px;
+               border-width: 0;
+               background-color: inherit;
+               box-shadow: 1px 1px $gray-400;
+               right: 8px;
+               top: 6px;
+
+               &:hover {
+                  color: $dark;
+                  background-color: $gray-400;
+               }
+               &:active {
+                  color: $dark;
+                  background-color: $gray-400;
+                  transform: translateY(2px);
+               }
+            }
+
+            .c2c-tooltip {
+               background: $dark;
+               color: $white;
+               padding: 2px 4px;
+               border-radius: 3px;
+               display: block;
+               visibility: hidden;
+               opacity: 0;
+               transition: visibility 0s, opacity 0.5s linear;
+            }
+
+            .c2c-tooltip[show-tooltip] {
+               visibility: visible;
+               opacity: 1;
+            }
         }
     }
 
diff --git a/assets/scss/_content.scss b/assets/scss/_content.scss
index 3e72e00ebb..9a9f3969ef 100644
--- a/assets/scss/_content.scss
+++ b/assets/scss/_content.scss
@@ -35,7 +35,7 @@
         @extend .img-fluid;
     }
 
-    > table {
+    table {
         @extend .table-striped;
 
         @extend .table-responsive;
@@ -43,14 +43,14 @@
         @extend .table;
     }
 
-    > blockquote {
+    blockquote {
         padding: 0 0 0 1rem;
         margin-bottom: $spacer;
         color: $gray-600;
         border-left: 6px solid $secondary;
     }
 
-    > ul li, > ol li {
+    ul li, ol li {
         margin-bottom: .25rem;
     }
 
diff --git a/assets/scss/_nav.scss b/assets/scss/_nav.scss
index 2b82c0440a..d34f180b08 100644
--- a/assets/scss/_nav.scss
+++ b/assets/scss/_nav.scss
@@ -36,14 +36,12 @@
         width: 100%;
     }
 
-
     .navbar-brand {
         text-transform: none;
         text-align: middle;
 
-        .nav-link {
-            display: inline-block;
-            margin-right: -30px;
+        &__name {
+          font-weight: $font-weight-bold;
         }
 
         svg {
@@ -58,14 +56,12 @@
         font-weight: $font-weight-bold;
     }
 
-    .td-search-input {
-        border: none;
-        color: $navbar-dark-color;
-        @include placeholder {
-            color: $navbar-dark-color;
-        }
+    .navbar-nav {
+        white-space: nowrap;
     }
 
+    // For .td-search__input styling, see _search.scss
+
     .dropdown {
         min-width: 100px;
     }
@@ -89,9 +85,7 @@
             .navbar-nav {
                 padding-bottom: 2rem;
                 overflow-x: auto;
-                white-space: nowrap;
                 -webkit-overflow-scrolling: touch;
-
             }
         }
     }
diff --git a/assets/scss/_search.scss b/assets/scss/_search.scss
index 4c8fe88ee1..481ec5ddb6 100644
--- a/assets/scss/_search.scss
+++ b/assets/scss/_search.scss
@@ -1,24 +1,103 @@
 // Search
 
-.td-search-input {
+.td-search {
     background: transparent;
-    max-width: 90%;
+    position: relative;
+    width: 90%;
+
+    // Search icon
+    &__icon {
+        // Vertically center the content.
+        display: flex;
+        align-items: center;
+        height: 100%;
+
+        // Position this on the left of the input.
+        position: absolute;
+        left: 0.75em;
 
-    &.form-control:focus {
-        border-color: lighten($primary, 60%);
-        box-shadow: 0 0 0 2px lighten($primary, 30%);
-        color: inherit;
+        // Click-through to the underlying input.
+        pointer-events: none;
+
+        &:before {
+            @extend .fa;
+            content: fa-content($fa-var-search);
+        }
+
+        // Styling adjustments for the navbar
+        @at-root {
+            .td-navbar & {
+                color: $navbar-dark-color;
+            }
+        }
     }
 
-    @if $enable-rounded {
-        border-radius: 1rem;
+    // Search input element
+    &__input {
+        width: 100%;
+        text-indent: 1.25em;
+
+        @if $enable-rounded {
+            border-radius: 1rem;
+        }
+
+        &:not(:focus) {
+            background: transparent;
+        }
+
+        &.form-control:focus {
+            border-color: lighten($primary, 60%);
+            box-shadow: 0 0 0 2px lighten($primary, 30%);
+            color: inherit;
+        }
+
+        // Styling adjustments for the navbar
+        @at-root {
+            .td-navbar & {
+                border: none;
+                color: $navbar-dark-color;
+
+                @include placeholder {
+                    color: $navbar-dark-color;
+                }
+            }
+        }
+
     }
 
-    font-family: $font-family-base, $font-awesome-font-name;
+    // Hide icon on focus
+    &:focus-within {
+
+        .td-search__icon {
+            display: none;
+        }
+
+        .td-search-input {
+            text-indent: 0px;
+        }
+    }
+
+    &:not(:focus-within) {
+        color: $input-placeholder-color;
+    }
 }
 
-.popover.offline-search-result {
-    // Override bootstrap default style (max-width: $popover-max-width;)
+// Offline search
+
+.td-search--offline {
+
+    &:focus-within {
+        // Don't hide the search icon on focus: this gives better UX when user
+        // explores content of search-results popup and focus is lost.
+
+        .td-search__icon {
+            display: flex;
+            color: $input-placeholder-color;
+        }
+    }
+}
+
+.td-offline-search-results {
     max-width: 90%;
 
     .card {
@@ -28,4 +107,14 @@
             font-weight: bold;
         }
     }
+
+    &__close-button {
+        // cursor: pointer;
+        float: right;
+
+        &:after {
+            @extend .fas;
+            content: fa-content($fa-var-times);
+        }
+    }
 }
diff --git a/assets/scss/shortcodes/tabbed-pane.scss b/assets/scss/shortcodes/tabbed-pane.scss
index f63b50d064..65096aee6e 100644
--- a/assets/scss/shortcodes/tabbed-pane.scss
+++ b/assets/scss/shortcodes/tabbed-pane.scss
@@ -1,14 +1,17 @@
 .tab-content {
-  .highlight {
-    margin: 0rem 0 2rem 0;
+  .tab-pane {
+    pre {
+      margin: 0rem 0 0rem 0;
+    }
   }
 }
+
 .tab-content {
   .tab-pane {
     .highlight {
-    margin: 0rem 0 0rem 0;
-    border: none;
-    max-width: 100%;
+      margin: 0rem 0 0rem 0;
+      border: none;
+      max-width: 100%;
     }
     margin-top: 0rem;
     margin-bottom: 1.5rem;
@@ -16,7 +19,7 @@
     border-left: 1px solid rgba(0, 0, 0, 0.125);
     border-right: 1px solid rgba(0, 0, 0, 0.125);
     border-bottom: 1px solid rgba(0, 0, 0, 0.125);
-    }
+  }
 }
 
 .tab-body {
@@ -27,10 +30,9 @@
   padding: 1.5rem;
 
   @each $color, $value in $theme-colors {
-      &-#{$color} {
-
-          border-style: solid;
-          border-color: $value;
-      }
+    &-#{$color} {
+      border-style: solid;
+      border-color: $value;
+    }
   }
 }
diff --git a/dependencies/config.toml b/dependencies/config.toml
index 3d4ec07abd..3ba31f38f9 100644
--- a/dependencies/config.toml
+++ b/dependencies/config.toml
@@ -37,3 +37,6 @@ _merge = "deep"
 [[module.imports.mounts]]
   source = "scss"
   target = "assets/vendor/Font-Awesome/scss"
+[[module.imports.mounts]]
+  source = "webfonts"
+  target = "static/webfonts"
diff --git a/dependencies/go.mod b/dependencies/go.mod
index 21e47f477c..29a0cb1729 100644
--- a/dependencies/go.mod
+++ b/dependencies/go.mod
@@ -3,6 +3,6 @@ module github.com/google/docsy/dependencies
 go 1.12
 
 require (
-	github.com/FortAwesome/Font-Awesome v0.0.0-20210804190922-7d3d774145ac // indirect
-	github.com/twbs/bootstrap v4.6.1+incompatible // indirect
+	github.com/FortAwesome/Font-Awesome v0.0.0-20221115183454-96cafbd73ec4 // indirect
+	github.com/twbs/bootstrap v4.6.2+incompatible // indirect
 )
diff --git a/go.mod b/go.mod
index a92e03b58f..70b0dbf1d3 100644
--- a/go.mod
+++ b/go.mod
@@ -3,7 +3,7 @@ module github.com/google/docsy
 go 1.12
 
 require (
-	github.com/FortAwesome/Font-Awesome v0.0.0-20210804190922-7d3d774145ac // indirect
-	github.com/google/docsy/dependencies v0.4.1-0.20220905171817-ae8b8117ed16 // indirect
-	github.com/twbs/bootstrap v4.6.1+incompatible // indirect
+	github.com/FortAwesome/Font-Awesome v0.0.0-20221115183454-96cafbd73ec4 // indirect
+	github.com/google/docsy/dependencies v0.6.0 // indirect
+	github.com/twbs/bootstrap v4.6.2+incompatible // indirect
 )
diff --git a/go.sum b/go.sum
index 8032032524..ca3df92a6a 100644
--- a/go.sum
+++ b/go.sum
@@ -1,6 +1,12 @@
-github.com/FortAwesome/Font-Awesome v0.0.0-20210804190922-7d3d774145ac h1:AjwgwoaDsNEA1Wtc8pgw/BqG7SEk9bKxXPjEPQQ42vY=
-github.com/FortAwesome/Font-Awesome v0.0.0-20210804190922-7d3d774145ac/go.mod h1:IUgezN/MFpCDIlFezw3L8j83oeiIuYoj28Miwr/KUYo=
+github.com/FortAwesome/Font-Awesome v0.0.0-20220831210243-d3a7818c253f h1:bvkUptSRPZBr3Kxuk+bnWCEmQ5MtEJX5fjezyV0bC3g=
+github.com/FortAwesome/Font-Awesome v0.0.0-20220831210243-d3a7818c253f/go.mod h1:IUgezN/MFpCDIlFezw3L8j83oeiIuYoj28Miwr/KUYo=
+github.com/FortAwesome/Font-Awesome v0.0.0-20221115183454-96cafbd73ec4 h1:xfr9SidRCMEh4A8fdkLhFPcHAVbrdv3Ua0Jp/nSmhhQ=
+github.com/FortAwesome/Font-Awesome v0.0.0-20221115183454-96cafbd73ec4/go.mod h1:IUgezN/MFpCDIlFezw3L8j83oeiIuYoj28Miwr/KUYo=
+github.com/google/docsy/dependencies v0.4.0/go.mod h1:2zZxHF+2qvkyXhLZtsbnqMotxMukJXLaf8fAZER48oo=
 github.com/google/docsy/dependencies v0.4.1-0.20220905171817-ae8b8117ed16 h1:6Ju+wn/ReUk9qmvKU68JlYhnWe48Tq+2HZ4vyeSpNMk=
 github.com/google/docsy/dependencies v0.4.1-0.20220905171817-ae8b8117ed16/go.mod h1:2zZxHF+2qvkyXhLZtsbnqMotxMukJXLaf8fAZER48oo=
-github.com/twbs/bootstrap v4.6.1+incompatible h1:75PsBfPU1SS65ag0Z3Cq6JNXVAfUNfB0oCLHh9k9Fu8=
-github.com/twbs/bootstrap v4.6.1+incompatible/go.mod h1:fZTSrkpSf0/HkL0IIJzvVspTt1r9zuf7XlZau8kpcY0=
+github.com/google/docsy/dependencies v0.5.1-0.20221014161617-be5da07ecff1 h1:DH0NbaXJjODFImfRJGCSXDhnRO/IaD2VTGVlRjULUtc=
+github.com/google/docsy/dependencies v0.5.1-0.20221014161617-be5da07ecff1/go.mod h1:EDGc2znMbGUw0RW5kWwy2oGgLt0iVXBmoq4UOqstuNE=
+github.com/google/docsy/dependencies v0.5.1/go.mod h1:EDGc2znMbGUw0RW5kWwy2oGgLt0iVXBmoq4UOqstuNE=
+github.com/twbs/bootstrap v4.6.2+incompatible h1:TDa+R51BTiy1wEHSYjmqDb8LxNl/zaEjAOpRE9Hwh/o=
+github.com/twbs/bootstrap v4.6.2+incompatible/go.mod h1:fZTSrkpSf0/HkL0IIJzvVspTt1r9zuf7XlZau8kpcY0=
diff --git a/i18n/ar.toml b/i18n/ar.toml
index 12d93820d4..8035bd935c 100644
--- a/i18n/ar.toml
+++ b/i18n/ar.toml
@@ -15,6 +15,9 @@ other = "ابحث في هذا الموقع"
 # Used in sentences such as "Posted in News"
 [ui_in]
 other = "في"
+# Used in sentences such as "All Tags"
+[ui_all]
+other = "كل"
 
 # Footer text
 [footer_all_rights_reserved]
@@ -33,6 +36,8 @@ other = "منشئة"
 other = "اخر تعديل"
 [post_edit_this]
 other = "عدل هذه الصفحة"
+[post_view_this]
+other = "أنظر مصدر الصفحة"
 [post_create_child_page]
 other = " أنشئ صفحة فرعية"
 [post_create_issue]
@@ -42,9 +47,9 @@ other = "أنشئ مسألة حول المشروع"
 [post_posts_in]
 other = "منشور في"
 [post_reading_time]
-other = "minute read"
+other = "دقيقة للقراءة"
 [post_less_than_a_minute_read]
-other = "less than a minute"
+other = "أقل من دقيقة"
 
 # Print support
 [print_printable_section]
@@ -58,18 +63,18 @@ other = "اطبع القسم كاملا"
 
 # Community
 [community_join]
-other = "Join the {{ .Site.Title }} community"
+other = "انضم الي مجتمع {{ .Site.Title }}"
 [community_introduce]
-other = "{{ .Site.Title }} is an open source project that anyone in the community can use, improve, and enjoy. We'd love you to join us! Here's a few ways to find out what's happening and get involved."
+other = "{{ .Site.Title }} هو مشروع مفتوح المصدر يمكن لأي شخص في المجتمع استخدامه وتحسينه والاستمتاع به. يسعدنا أن تنضم إلينا! إليك بعض الطرق للمشاركة و معرفة ما يحدث."
 [community_learn]
-other = "Learn and Connect"
+other = "تعلم وتواصل"
 [community_using]
-other = "Using or want to use {{ .Site.Title }}? Find out more here:"
+other = "تستخدام أو تريد استخدام {{ .Site.Title }}؟ اكتشف المزيد هنا:"
 [community_develop]
-other = "Develop and Contribute"
+other = "طور و ساهم"
 [community_contribute]
-other = "If you want to get more involved by contributing to {{ .Site.Title }}, join us here:"
+other = "إذا كنت ترغب في المشاركة بشكل أكبر من خلال المساهمة في {{ .Site.Title }}, انضم إلينا هنا:"
 [community_how_to]
-other = "You can find out how to contribute to {{ .Site.Title }} in our"
+other = "يمكنك معرفة كيفية المساهمة في {{ .Site.Title }} من خلال"
 [community_guideline]
-other = "Contribution Guidelines"
+other = "إرشادات المساهمة"
diff --git a/i18n/nl.toml b/i18n/nl.toml
index 8f1ac46774..b259842763 100644
--- a/i18n/nl.toml
+++ b/i18n/nl.toml
@@ -18,6 +18,9 @@ other = "Doorzoek deze site"
 [ui_in]
 other = "in"
 
+[ui_all]
+other = "alle"
+
 # Footer text
 [footer_all_rights_reserved]
 other = "Alle rechten voorbehouden"
@@ -25,7 +28,6 @@ other = "Alle rechten voorbehouden"
 [footer_privacy_policy]
 other = "Privacy Policy"
 
-
 # Post (blog, articles etc.)
 [post_byline_by]
 other = "Door"
@@ -35,6 +37,8 @@ other = "Aangemaakt"
 other = "Laatst gewijzigd"
 [post_edit_this]
 other = "Bewerk deze pagina"
+[post_view_this]
+other = "Bekijk paginabron"
 [post_create_child_page]
 other = "Maak sub pagina"
 [post_create_issue]
@@ -56,22 +60,22 @@ other = "Klik hier om te printen"
 [print_show_regular]
 other = "Terug naar normale view van deze pagina"
 [print_entire_section]
-other = "Print complete sectie"
+other = "Print volledige sectie"
 
 # Community
 [community_join]
-other = "Join the {{ .Site.Title }} community"
+other = "Wordt lid van de {{ .Site.Title }} community"
 [community_introduce]
-other = "{{ .Site.Title }} is an open source project that anyone in the community can use, improve, and enjoy. We'd love you to join us! Here's a few ways to find out what's happening and get involved."
+other = "{{ .Site.Title }} is een open source project welke iedereen kan gebruiken, verbeteren en van kan genieten. We zouden het fijn vinden als je betrokken wordt! Hier zijn een aantal manieren om erachter te komen wat er speelt en hoe je betrokken kunt worden."
 [community_learn]
-other = "Learn and Connect"
+other = "Leren en aansluiten"
 [community_using]
-other = "Using or want to use {{ .Site.Title }}? Find out more here:"
+other = "Gebruik je {{ .Site.Title }} of wil je dit gebruiken? Meer informatie hier:"
 [community_develop]
-other = "Develop and Contribute"
+other = "Ontwikkel en draag bij"
 [community_contribute]
-other = "If you want to get more involved by contributing to {{ .Site.Title }}, join us here:"
+other = "Als je meer betrokken wil zijn door bij te dragen aan {{ .Site.Title }}, meldt je hier aan:"
 [community_how_to]
-other = "You can find out how to contribute to {{ .Site.Title }} in our"
+other = "Je kunt meer informatie vinden over hoe bij te dragen aan {{ .Site.Title }} in onze"
 [community_guideline]
-other = "Contribution Guidelines"
+other = "Richtlijnen voor bijdrage"
diff --git a/layouts/_default/_markup/render-codeblock-chem.html b/layouts/_default/_markup/render-codeblock-chem.html
new file mode 100644
index 0000000000..1480857725
--- /dev/null
+++ b/layouts/_default/_markup/render-codeblock-chem.html
@@ -0,0 +1,18 @@
+{{ .Page.Store.Set "hasmhchem" true -}}
+
+{{/* set default delimiters */ -}}
+{{ $delimiter_left := "$$" -}}
+{{ $delimiter_right := "$$" -}}
+
+{{/* override delimiters if set in config file */ -}}
+{{ with $.Page.Site.Params.katex.options.delimiters -}}
+  {{ range first 1 ( where . "display" true ) -}}
+    {{ $delimiter_left = index . "left" -}}
+    {{ $delimiter_right = index . "right" -}}
+  {{ end -}}
+{{ end -}}
+
+{{/* output of chemical formulae */}}
+
{{ $delimiter_left -}}
+{{ .Inner | safeHTML -}}
+{{ $delimiter_right -}}
{{ "" -}}
diff --git a/layouts/_default/_markup/render-codeblock-math.html b/layouts/_default/_markup/render-codeblock-math.html
new file mode 100644
index 0000000000..8308694906
--- /dev/null
+++ b/layouts/_default/_markup/render-codeblock-math.html
@@ -0,0 +1,18 @@
+{{ .Page.Store.Set "hasKaTeX" true -}}
+
+{{/* set default delimiters */ -}}
+{{ $delimiter_left := "$$" -}}
+{{ $delimiter_right := "$$" -}}
+
+{{/* override delimiters if set in config file */ -}}
+{{ with $.Page.Site.Params.katex.options.delimiters -}}
+  {{ range first 1 ( where . "display" true ) -}}
+    {{ $delimiter_left = index . "left" -}}
+    {{ $delimiter_right = index . "right" -}}
+  {{ end -}}
+{{ end -}}
+
+{{/* output of equation */}}
+
{{ $delimiter_left -}}
+{{ .Inner | safeHTML -}}
+{{ $delimiter_right }}
{{ "" -}}
\ No newline at end of file
diff --git a/layouts/_default/_markup/render-codeblock-mermaid.html b/layouts/_default/_markup/render-codeblock-mermaid.html
new file mode 100644
index 0000000000..0b8d7c01bd
--- /dev/null
+++ b/layouts/_default/_markup/render-codeblock-mermaid.html
@@ -0,0 +1,5 @@
+{{ .Page.Store.Set "hasmermaid" true -}}
+
+

+  {{- .Inner | safeHTML }}
+

diff --git a/layouts/_internal/google_analytics_gtag.html b/layouts/_internal/google_analytics_gtag.html
new file mode 100644
index 0000000000..32b6a33654
--- /dev/null
+++ b/layouts/_internal/google_analytics_gtag.html
@@ -0,0 +1,42 @@
+{{/*
+
+  This is a modified copy of
+
+  https://github.com/gohugoio/hugo/blob/master/tpl/tplimpl/embedded/templates/google_analytics.html,
+
+  specifically this version:
+
+  https://github.com/gohugoio/hugo/blob/f7e00c039ff3cea5f991b05c1e325666004cf129/tpl/tplimpl/embedded/templates/google_analytics.html
+
+  The only differences between this copy and the original are that we've dropped:
+
+  - The `{{ if hasPrefix . "G-"}}` condition
+  - The `{{ else }}` block
+  - The `anonymize_ip` argument to the `gtag()` call, since it is superfluous.
+    For details, see https://github.com/gohugoio/hugo/issues/10093.
+
+*/}}
+
+{{- $pc := .Site.Config.Privacy.GoogleAnalytics -}}
+{{- if not $pc.Disable }}{{ with .Site.GoogleAnalytics -}}
+
+
+{{- end }}{{ end -}}
+
+{{- define "__ga_js_set_doNotTrack" -}}{{/* This is also used in the async version. */}}
+{{- $pc := .Site.Config.Privacy.GoogleAnalytics -}}
+{{- if not $pc.RespectDoNotTrack -}}
+var doNotTrack = false;
+{{- else -}}
+var dnt = (navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack);
+var doNotTrack = (dnt == "1" || dnt == "yes");
+{{- end -}}
+{{- end -}}
\ No newline at end of file
diff --git a/layouts/blog/list.html b/layouts/blog/list.html
index c63c3099be..0f781cb87e 100644
--- a/layouts/blog/list.html
+++ b/layouts/blog/list.html
@@ -8,7 +8,7 @@
 

 	

 		{{- if .Pages -}}
-		{{ $pag := .Paginate (( $.Scratch.Get "blog-pages").GroupByDate "2006" "asc" )}}
+		{{ $pag := .Paginate (( $.Scratch.Get "blog-pages").GroupByDate "2006" )}}
 			{{ range $pag.PageGroups }}
 			
{{ T "post_posts_in" }} {{ .Key }}