Rework alert shortcode

Author: chalin

assets/scss/_alerts.scss

@@ -17,4 +17,8 @@
             border-width: 0 0 0 4px;
         }
     }
+
+    :last-child {
+        margin-bottom: 0;
+    }
 }

layouts/shortcodes/alert.html

@@ -1,10 +1,13 @@
-{{ $_hugo_config := `{ "version": 1 }` }}
-{{ $color := .Get "color" | default "primary" }}
+{{ $color := .Get "color" | default "primary" -}}
 <div class="alert alert-{{ $color }}" role="alert">
-{{ with .Get "title" }}<h4 class="alert-heading">{{ . | safeHTML }}</h4>{{ end }}
-{{ if eq .Page.File.Ext "md" }}
-    {{ .Inner | markdownify }}
-{{ else }}
-    {{ .Inner | htmlUnescape | safeHTML }}
-{{ end }}
+{{ with .Get "title" -}}
+  <h4 class="alert-heading">
+    {{- . | safeHTML -}}
+  </h4>
+{{ end -}}
+{{ if .Get "markdownify" -}}
+  {{ .Inner | markdownify }}
+{{ else -}}
+  {{ .Inner }}
+{{ end -}}
 </div>

userguide/content/en/docs/Adding content/Shortcodes/index.md

@@ -49,7 +49,7 @@ The **blocks/cover** shortcode creates a landing page type of block that fills t
 Note that the relevant shortcode parameters above will have sensible defaults, but is included here for completeness.
 
 {{% alert title="Hugo Tip" %}}
-> Using the bracket styled shortcode delimiter, `>}}`, tells Hugo that the inner content is HTML/plain text and needs no further processing. Changing the delimiter to `%}}` means Hugo will treat the content as Markdown. You can use both styles in your pages.
+Using the bracket styled shortcode delimiter, `>}}`, tells Hugo that the inner content is HTML/plain text and needs no further processing. Changing the delimiter to `%}}` means Hugo will treat the content as Markdown. You can use both styles in your pages.
 {{% /alert %}}
 
 

userguide/content/en/docs/Deployment/_index.md

@@ -18,11 +18,11 @@ Depending on your deployment choice you may want to serve your site locally duri
     git clone --recurse-submodules --depth 1 https://github.com/my/example.git
     ```
    
-    {{% alert title="Note" color="primary" %}}
+    {{< alert title="Note" markdownify=true >}}
 If you've just added the theme as a submodule in a local version of your site and haven't committed it to a repo yet,  you must get local copies of the theme's own submodules before serving your site.
-    
+
     git submodule update --init --recursive
-    {{% /alert %}}
+    {{< /alert >}}
 
 1.  Ensure you have the tools described in [Prerequisites and installation](/docs/getting-started/#prerequisites-and-installation) installed on your local machine, including `postcss-cli` (you'll need it to generate the site resources the first time you run the server).
 1.  Run the `hugo server` command in your site root. By default your site will be available at http://localhost:1313/.
@@ -59,7 +59,7 @@ Then follow the instructions in [Host on Netlify](https://gohugo.io/hosting-and-
    1. Specify `HUGO_VERSION` as the **Key** for the new variable, and `0.53` or later as its **Value**. 
 1. Click **Deploy site**.
 
-{{% alert title="Note" color="primary" %}}
+{{% alert title="Note" %}}
 Netlify uses your site repo's `package.json` file to install any JavaScript dependencies (like `postcss`) before building your site. If you haven't just copied our example site's version of this file, make sure that you've specified all our [prerequisites](/docs/getting-started/#install-postcss).
 
 For example, if you want to use a version of `postcss-cli` later than version 8.0.0, you need to ensure that your `package.json` also specifies `postcss` separately:
@@ -121,12 +121,12 @@ There are several options for publishing your web site using [Amazon Web Service
 
 For more information about the Hugo `deploy` command, including command line options, see this [synopsis](https://gohugo.io/commands/hugo_deploy). In particular, you may find the `--maxDeletes int` option or the `--force` option (which forces upload of all files) useful.
 
-{{% alert title="Automated deployment with GitHub actions" color="primary" %}}
+{{% alert title="Automated deployment with GitHub actions" %}}
 If the source of your site lives in a GitHub repository, you can use [GitHub Actions](https://docs.github.com/en/actions) to deploy the site to your S3 bucket as soon as you commit changes to your GitHub repo. Setup of this workflow is described in this [blog post](https://capgemini.github.io/development/Using-GitHub-Actions-and-Hugo-Deploy-to-Deploy-to-AWS/).
 {{% /alert %}}
 
 
-{{% alert title="Handling aliases" color="primary" %}}
+{{% alert title="Handling aliases" %}}
 If you are using [aliases](https://gohugo.io/content-management/urls/#aliases) for URL management, you should have a look at this [blog post](https://blog.cavelab.dev/2021/10/hugo-aliases-to-s3-redirects/). It explains how to turn aliases into proper `301` redirects when using Amazon S3.
 {{% /alert %}}