Merge pull request #372 from gethinode/develop

Implement web sharing

.eslintignore

@@ -1,5 +1,6 @@
 assets/js/critical/color.js
 assets/js/analytics.js
 assets/js/flexsearch.js
+assets/js/sharing.js
 assets/js/vendor
 node_modules

.github/workflows/build.yml

@@ -12,7 +12,7 @@ jobs:
     strategy:
       matrix:
         os: [macos-latest, windows-latest, ubuntu-latest]
-        node-version: [14.x, 16.x, 18.x]
+        node-version: [16.x, 18.x, 20.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     runs-on: ${{ matrix.os }}

.github/workflows/lint.yml

@@ -14,7 +14,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [14.x, 16.x, 18.x]
+        node-version: [16.x, 18.x, 20.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:

assets/js/sharing.js

@@ -0,0 +1,36 @@
+{{- if site.Params.sharing.webshare -}}
+
+// Adapted from: https://dev.to/j471n/how-to-share-anything-from-your-website-by-web-share-api-1h5g
+
+// function for Web Share API
+function webShareAPI (title, description, link) {
+  navigator
+    .share({
+      title,
+      text: description,
+      url: link
+    })
+    .then(() => console.log('Successful share'))
+    .catch((error) => console.log('Error sharing', error))
+}
+
+const shareBtn = document.getElementById('btn-webshare')
+
+if (shareBtn !== null) {
+  if (navigator.share) {
+    const title = shareBtn.getAttribute('data-sharing-title')
+    const description = shareBtn.getAttribute('data-sharing-description')
+    const url = shareBtn.getAttribute('data-sharing-url')
+
+    // show button if it supports webShareAPI
+    shareBtn.style.display = 'block'
+    shareBtn.addEventListener('click', () =>
+      webShareAPI(title, description, url)
+    )
+  } else {
+    // hide button if host does not support Web Share API
+    shareBtn.style.display = 'none'
+  }
+}
+
+{{- end -}}

config/_default/params.toml

@@ -5,6 +5,9 @@
     enableDarkMode = true
     modes = ["light", "dark"]
     canonifyAssetsURLs = false
+    [main.externalLinks]
+        cue = false
+        tab = false
 # toml-docs-end main
 
 # toml-docs-start modules
@@ -60,6 +63,7 @@
     enabled = true
     sort = "weight"
     reverse = false
+    webshare = true
 
 [[sharing.providers]]
     name = "LinkedIn"

go.mod

@@ -3,7 +3,7 @@ module github.com/gethinode/hinode
 go 1.19
 
 require (
-	github.com/gethinode/mod-bootstrap v1.1.0 // indirect
+	github.com/gethinode/mod-bootstrap v1.1.1 // indirect
 	github.com/gethinode/mod-flexsearch v1.1.4 // indirect
 	github.com/gethinode/mod-fontawesome v1.2.1 // indirect
 	github.com/gethinode/mod-katex v1.0.2 // indirect

go.sum

@@ -2,6 +2,8 @@ github.com/gethinode/mod-bootstrap v1.0.1 h1:NDZar+UEL42YHCvzzO+jVgqkZU5INA12Bpj
 github.com/gethinode/mod-bootstrap v1.0.1/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
 github.com/gethinode/mod-bootstrap v1.1.0 h1:BbalsW8kmFhv+J+dcc41TGcjIlM/p69AB0h0oGhAXIU=
 github.com/gethinode/mod-bootstrap v1.1.0/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
+github.com/gethinode/mod-bootstrap v1.1.1 h1:Tx4M5hGVOFrEaxnUONDAm6N9xuRi5UphKlT7F26HujU=
+github.com/gethinode/mod-bootstrap v1.1.1/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
 github.com/gethinode/mod-flexsearch v1.0.1 h1:FJkRsUzSnQTXl3MWCigT4E6vfff870UWTnkGqaDGIhA=
 github.com/gethinode/mod-flexsearch v1.0.1/go.mod h1:TXbGbWsvmhBdsTzRt887mcpFfr4ORpzG3+h/l4W3YM4=
 github.com/gethinode/mod-flexsearch v1.1.0 h1:7BCMyQDlYlskNXuazt8Jg/jg9WREexu2xVkYqThkAX4=

layouts/partials/assets/button.html

@@ -22,6 +22,11 @@
                     "between", "around", or "evenly".
     "toast"         Optional id of the toast to display when the button is clicked.
     "clipboard"     Optional text to be copied to the clipboard when the button is clicked.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "main.externalLinks.cue" in the site's parameters.
+    "tab"           Optional flag to indicate if an external link should open in a new tab, defaults to setting
+                    "main.externalLinks.tab" in the site's parameters.
+    "attributes"    Optional dictionary of key-value pairs added as custom attributes to the button element ('<a>').
 -->
 
 {{- $title := trim .title " \r\n" -}}
@@ -95,6 +100,7 @@
 {{- end -}}
 
 {{- $class := .class }}
+{{ with $badge }}{{ $class = printf "%s me-3" $class }}{{ end }}
 
 {{- $order := "last" -}}
 {{- with .order }}{{ $order = . }}{{ end -}}
@@ -113,8 +119,29 @@
 {{- $toast := .toast -}}
 {{- $clipboard := .clipboard -}}
 
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
+{{- $isExternal := ne (urls.Parse (absURL $href)).Host (urls.Parse site.BaseURL).Host -}}
+{{- $target := "" -}}
+{{- $rel := "" -}}
+
+{{- if $isExternal -}}
+    {{- if $tab -}}
+        {{- $target = "_blank" -}}
+        {{- $rel = "noopener noreferrer" -}}
+    {{- end -}}
+
+    {{- if and $title $cue -}}
+        {{ $suffix := partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+        {{- $title = printf "%s %s" $title $suffix | safeHTML -}}
+    {{- end -}}
+{{- end -}}
+
+{{- $attributes := .attributes -}}
+
 <a aria-label="{{ $title }}" {{ if ne $state "disabled" }}{{ with $href }}href="{{ . }}"{{ end }}{{ end }}
     {{ with $id }}id="{{ . }}"{{ end }}
+    {{ with $target }}target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}
     {{ with $toast }}data-toast-target="{{ $toast }}"{{ end }}
     {{ with $clipboard }}data-clipboard="{{ $clipboard }}"{{ end }}
     {{ if eq $type "button" }}class="btn btn-{{ if $outline }}outline-{{ end }}{{ $color }} {{ if ne $size "md"}}btn-{{ $size }}{{ end }} position-relative {{ if in (slice "disabled" "active") $state }}{{ $state }}{{ end }} {{ $class }}"
@@ -124,11 +151,14 @@
     {{ with $collapse }}data-bs-toggle="collapse" aria-expanded="false" aria-controls="{{ . }}"{{ end }}
     {{ if eq $state "active" }}data-bs-toggle="button" aria-pressed="true"{{ end }}
     {{ if eq $state "inactive" }}data-bs-toggle="button" aria-pressed="false"{{ end }}
+    {{ range $key, $val := $attributes }}
+        {{ print $key | safeHTMLAttr }}="{{ $val }}"
+    {{ end }}
     >
 
     <div class="d-flex justify-content-{{ $justify }}">
-        <div>{{ $title }}</div>
-        {{- with $icon }}<div class="align-self-center{{ if eq $order "first" }} order-first pe-1{{ else }} ps-1{{ end }}">{{ partial "assets/icon.html" (dict "icon" $icon) }}</div>{{ end }}
+        <div class="my-auto">{{ $title }}</div>
+        {{- with $icon }}<div class="align-self-center{{ if $title }}{{ if eq $order "first" }} order-first pe-1{{ else }} ps-1{{ end }}{{ end }}">{{ partial "assets/icon.html" (dict "icon" $icon) }}</div>{{ end }}
     </div>
 
     {{- with $badge }}

layouts/partials/assets/navbar-item.html

@@ -9,12 +9,24 @@
 {{- $isActive := hasPrefix $pageURL $menuURL -}}
 {{- $isAlias := $menu.Params.alias -}}
 {{- $isIcon := $menu.Params.icon -}}
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
 
 {{- $url := urls.Parse $menuURL -}}
 {{- $baseURL := urls.Parse $.Site.Params.Baseurl -}}
 {{- $isExternal := ne $url.Host $baseURL.Host -}}
 {{- $externalHref := "" }}
-{{- if $isExternal }}{{ $externalHref = "target=\"_blank\" rel=\"noopener noreferrer\"" }}{{ end -}}
+{{- $suffix := "" }}
+
+{{- if $isExternal }}
+    {{- if $tab -}}
+        {{ $externalHref = "target=\"_blank\" rel=\"noopener noreferrer\"" }}
+    {{- end -}}
+
+    {{- if $cue -}}
+        {{ $suffix = partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+    {{- end -}}
+{{ end -}}
 
 {{- $mainNav := urlize (lower $menu.Name) -}}
 {{- $childNav := "" -}}
@@ -44,5 +56,5 @@
     {{- with $menu.Pre }}{{ . }}{{ end -}}
     <span {{ if $isActive }} class="active"{{ end }}>{{ if not $isIcon }}{{ $menu.Name }}{{ end }}</span>
     {{- with $menu.Post }}{{ . }}{{ end -}}
-    {{- if and $isExternal (not $isIcon)}} {{ partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}{{ end -}}
+    {{- if not $isIcon }} {{ $suffix }}{{ end -}}
 </a>

layouts/partials/assets/navbar.html

@@ -21,11 +21,11 @@
     {{- $collapsed := .collapsed -}}
 
     <li class="nav-item dropdown {{ if $collapsed }}d-{{ $size }}-none{{ else }}d-none d-{{ $size }}-block{{ end }}">
-        <a class="nav-link dropdown-toggle" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false" id="navbar-color-theme">
+        <a class="nav-link dropdown-toggle" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false" id="navbar-color-theme{{ if $collapsed }}-collapsed{{ end }}">
             {{- partial "assets/icon.html" (dict "icon" "fas sun theme-icon-active") }} {{ if $collapsed }} {{ T "colorMode" }} {{ end }}
             <span class="d-md-none"></span>
         </a>
-        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbar-color-theme">
+        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbar-color-theme{{ if $collapsed }}-collapsed{{ end }}">
             <li>
                 <a class="dropdown-item{{ if $collapsed }} switch-mode-collapsed{{ end }}" data-bs-theme-value="light" href="#!">
                     {{- partial "assets/icon.html" (dict "icon" "fas sun theme-icon") }}

layouts/partials/assets/sharing.html

@@ -23,6 +23,10 @@
                 {{- end -}}
                 {{ partial "assets/button.html" (dict "toast" $target "clipboard" $clipboard "href" $url "icon" (printf "%s fa-fw" $item.icon) "class" "btn-social p-0" )}}
             {{- end -}}
+            {{ if .Site.Params.sharing.webshare }}
+                {{ $attr := dict "data-sharing-title" .Title "data-sharing-description" .Description "data-sharing-url" .Permalink }}
+                {{ partial "assets/button.html" (dict "href" "#!" "icon" "fas share-nodes fa-fw" "id" "btn-webshare" "class" "btn-social p-0" "attributes" $attr )}}
+            {{- end -}}
         </div>
     {{- end -}}
 {{- end -}}

layouts/partials/footer/social.html

@@ -1,3 +1,4 @@
+{{- $tab := site.Params.main.externalLinks.tab -}}
 <div class="container-fluid">
     <div class="row row-cols-1 row-cols-sm-4 bg-primary p-3 bg-opacity-{{ .Site.Params.style.themeOpacity | default "25" | safeHTML }} align-items-center">
         <div class="col col-md-2 d-none d-md-block"></div>
@@ -7,7 +8,7 @@
         </div>
         <div class="col text-sm-start text-center col-sm-6 col-md-4">
             {{ range .Site.Menus.social -}}
-                <a href="{{ .URL }}" target="_blank" rel="noopener noreferrer" aria-label="{{ .Name | safeHTML }}" class="text-decoration-none link-secondary d-inline p-2">
+                <a href="{{ .URL }}" {{ if $tab }} target="_blank" rel="noopener noreferrer"{{ end }} aria-label="{{ .Name | safeHTML }}" class="text-decoration-none link-secondary d-inline p-2">
                     {{ .Pre | safeHTML }}
                 </a>
             {{ end -}}

layouts/partials/utilities/link.html

@@ -0,0 +1,43 @@
+{{ $destination := .destination }}
+{{- if not $destination -}}
+    {{- errorf "partial [utilities/link.html] - Missing param 'destination'" -}}
+{{- end -}}
+
+{{- $target := "" -}}
+{{- $rel := "" -}}
+{{- $case := .case | default true }}
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
+{{- $isExternal := ne (urls.Parse (absURL $destination)).Host (urls.Parse site.BaseURL).Host -}}
+
+{{ $text := .text }}
+{{- if not $text -}}
+    {{ if $isExternal }}
+        {{ $text = (urls.Parse (absURL $destination)).Host }}
+    {{ else }}
+        {{ $target := site.GetPage $destination }}
+        {{ if not $target }}
+            {{- errorf "partial [utilities/link.html] - Cannot find page: %s" $destination -}}
+        {{ else }}
+            {{ $text = $target.Title }}
+            {{ if not $case }}{{ $text = lower $text }}{{ end }}
+            {{ $destination = $target.RelPermalink }}
+        {{ end }}
+    {{ end }}
+{{- end -}}
+
+{{- if $isExternal -}}
+    {{- if $tab -}}
+        {{- $target = "_blank" -}}
+        {{- $rel = "noopener noreferrer" -}}
+    {{- end -}}
+
+    {{- if $cue -}}
+        {{ $suffix := partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+        {{- $text = printf "%s %s" $text $suffix | safeHTML -}}
+    {{- end -}}
+{{ else }}
+    {{ $destination = relLangURL $destination }}
+{{- end -}}
+
+<a href="{{ $destination | safeURL }}"{{ with $target }} target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}>{{ $text }}</a>

layouts/shortcodes/alert.html

@@ -4,10 +4,27 @@
                     "warning", "info", "light", "dark", "white" or "black".
     "dismissible"   Optional flag to indicate the alert is dismissible, defaults to false.
     "icon"          Optional class and name of a Font Awesome icon to include.
+    "type"          Optional type of the alert, either "danger" or "info". Generates an alert with related color and
+                    icon.
 -->
 
 {{- $error := false -}}
 {{ $color := "primary" -}}
+{{ $icon := "" }}
+{{ $type := "" -}}
+
+{{ with .Get "type" }}{{ $type = . }}{{ end -}}
+{{ $supportedTypes := slice "danger" "info" -}}
+{{ if $type }}
+    {{ if not (in $supportedTypes $type) -}}
+        {{ errorf "Invalid value for param 'type': %s" .Position -}}
+        {{ $error = true -}}
+    {{ else }}
+        {{ $color = $type }}
+        {{ if eq $type "danger" }}{{ $icon = "fas triangle-exclamation" }}{{ else }}{{ $icon = "fa lightbulb" }}{{ end }}
+    {{ end -}}
+{{ end -}}
+
 {{ with .Get "color" }}{{ $color = . }}{{ end -}}
 {{ $supportedColors := slice "primary" "secondary" "success" "danger" "warning" "info" "light" "dark" -}}
 {{ if not (in $supportedColors $color) -}}
@@ -15,9 +32,9 @@
     {{ $error = true -}}
 {{ end -}}
 
-{{ $icon := "" }}
-{{ with .Get "icon" }}
-    {{ $icon = partial "assets/icon.html" (dict "icon" (printf "%s fa-2x fa-pull-left" .)) }}
+{{ with .Get "icon" }}{{ $icon = . }}{{ end }}
+{{ with $icon }}
+    {{ $icon = partial "assets/icon.html" (dict "icon" (printf "%s fa-2x fa-fw" .)) }}
 {{ end }}
 
 {{ $dismissibleParam := "false" -}}
@@ -32,9 +49,11 @@
 {{ end -}}
 
 {{- if not $error -}}
-    <div class="alert alert-{{ $color }} {{ if $dismissible }}alert-dismissible fade show{{ end }}" role="alert">
-        {{ with $icon }}{{ . }}{{ end }}
+    <div class="d-flex alert alert-{{ $color }} {{ if $dismissible }}alert-dismissible fade show{{ end }}" role="alert">
+        {{ with $icon }}<div class="pt-1 pe-2">{{ . }}</div>{{ end }}
+        <div class="flex-grow-1 my-auto">
             {{ trim .Inner " \r\n" | markdownify | safeHTML -}}
             {{ if $dismissible }}<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>{{ end }}
         </div>
+    </div>
 {{- end -}}

layouts/shortcodes/button.html

@@ -12,17 +12,29 @@
     "aria-label"    Optional label for the badge.
     "tooltip"       Optional text to display in a tooltip. Cannot be used together with collapse. Ignored for active/
                     inactive buttons.
-    "collapse"      Optional panel to collapse. Cannot be used together with tooltip. Ignored for active/inactive buttons.
+    "collapse"      Optional panel to collapse. Cannot be used together with tooltip. Ignored for active/inactive
+                    buttons.
     "placement"     Optional position of the tooltip: "top" (default), "bottom", "left", or "right". 
+    "class"         Optional class attribute of the button element, e.g. “p-5”.
+    "icon"          Font Awesome icon class attribute, required unless button title is set. An example value is
+                    "fas sort".
+    "order"         Optional order of the icon, either "first" or "last" (default).
+    "justify"       Optional justification of the button title and icon, either "start", "end", "center" (default),
+                    "between", "around", or "evenly".
     "toast"         Optional id of the toast to display when the button is clicked.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "main.externalLinks.cue" in the site's parameters.
+    "tab"           Optional flag to indicate if an external link should open in a new tab, defaults to setting
+                    "main.externalLinks.tab" in the site's parameters.
 -->
 
 {{ $error := false }}
 {{ $type := "button" -}}
 
+{{- $icon := .Get "icon" }}
 {{ $title := trim .Inner " \r\n" -}}
-{{ if not $title -}}
-    {{ errorf "Missing inner element text: %s" .Position -}}
+{{ if not (or $title $icon) -}}
+    {{ errorf "Missing icon or inner element text: %s" .Position -}}
     {{ $error = true }}
 {{ end -}}
 
@@ -69,6 +81,7 @@
 {{ if $relref }}
     {{ $href = relref . $relref }}
 {{ end }}
+{{ $class := .Get "class" -}}
 
 {{ $placement := "top" -}}
 {{ with .Get "placement" }}{{ $placement = . }}{{ end -}}
@@ -80,6 +93,25 @@
 
 {{- $toast := .Get "toast" -}}
 
+{{- $order := "last" -}}
+{{- with .Get "order" }}{{ $order = . }}{{ end -}}
+{{- $supportedOrders := slice "first" "last" -}}
+{{- if not (in $supportedOrders $order) -}}
+    {{ errorf "Invalid value for param 'order': %s" .Position -}}
+    {{ $error = true }}
+{{- end -}}
+
+{{- $justify := "center" -}}
+{{- with .Get "justify" }}{{ $justify = . }}{{ end -}}
+{{- $supportedJustify := slice "start" "end" "center" "between" "around" "evenly" -}}
+{{- if not (in $supportedJustify $justify) -}}
+    {{ errorf "Invalid value for param 'justify': %s" .Position -}}
+    {{ $error = true }}
+{{- end -}}
+
+{{- $cue := .Get "cue" | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .Get "tab" | default site.Params.main.externalLinks.tab -}}
+
 {{ if not $error }}
     {{- partial "assets/button.html" (dict 
         "type" $type
@@ -94,7 +126,13 @@
         "href" $href
         "id" $id
         "state" $state
+        "class" $class
         "placement" $placement
+        "icon" $icon
+        "order" $order
+        "justify" $justify
+        "cue" $cue
+        "tab" $tab
         "toast" $toast)
     -}} 
 {{ end }}

layouts/shortcodes/link.html

@@ -0,0 +1,55 @@
+<!-- 
+    Generates a link for a given named link or url. The shortcode supports a single unnamed parameter, or various named
+    parameters. The unnamed parameter is recognized as a named link if it does not contain any "/", otherwise it is
+    treated as a url. Any inner text is rendered as the link title, otherwise it uses the host name (for external links)
+    or page name (for internal links). The shortcode supports the following named arguments:
+    "name"          Optional name of the link maintained in the "links" section of the site's parameters. If omitted,
+                    the "url" argument should be provided instead.
+    "url"           Optional url of the link, including the scheme ("http" or "https"). If omitted, the "name" argument
+                    should be provided instead.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "main.externalLinks.cue" in the site's parameters.
+    "tab"           Optional flag to indicate if an external link should open in a new tab, defaults to setting
+                    "main.externalLinks.tab" in the site's parameters.
+    "case"          Optional flag to indicate if the retrieved title (e.g. no inner text is provided) of an internal
+                    link should use its original case, defaults to true. If false, the title is set to lower case.
+-->
+
+{{- $error := false -}}
+{{ $name := "" }}
+{{ $url := "" }}
+{{ $case := true }}
+{{ $cue := site.Params.main.externalLinks.cue }}
+{{ $tab := site.Params.main.externalLinks.tab }}
+
+{{ if .IsNamedParams }}
+    {{ $name = .Get "name" }}
+    {{ $url = .Get "url" }}
+    {{ $cue = .Get "cue" | default site.Params.main.externalLinks.cue }}
+    {{ $tab = .Get "tab" | default site.Params.main.externalLinks.tab }}
+    {{ $case = .Get "case" | default true }}
+{{ else if strings.Contains (.Get 0) "/" }}
+    {{ $url = .Get 0 }}
+{{ else }}
+    {{ $name = .Get 0 }}
+{{ end }}
+
+{{ if not (or $name $url) }}
+    {{ errorf "Expected param 'name' or 'url': %s" .Position -}}
+    {{ $error = true -}}
+{{ end }}
+
+{{ if $name }}
+    {{ $url = index site.Params.links $name }}
+    {{ if not $url }}
+        {{ errorf "Cannot find link '%s': %s" $name .Position -}}
+        {{ $error = true -}}
+    {{ end }}
+{{ end }}
+
+{{ $text := trim .Inner " \r\n" | markdownify | safeHTML }}
+
+{{- if not $error -}}
+    {{ partial "utilities/link.html" (dict "destination" $url "text" $text "cue" $cue "tab" $tab "case" $case) }}
+{{- end -}}
+

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gethinode/hinode",
-  "version": "0.16.6",
+  "version": "0.16.9",
   "description": "Hinode is a clean documentation and blog theme for Hugo, an open-source static site generator",
   "keywords": [
     "hugo",
@@ -44,7 +44,7 @@
     "create:syntax-light": "hugo gen chromastyles --style=github > ./assets/scss/components/_syntax-light.scss",
     "create:syntax-dark": "hugo gen chromastyles --style=github-dark > ./assets/scss/components/_syntax-dark.scss",
     "update:syntax-dark": "replace-in-files --string=\"#ffffcc\" --replacement=\"#b8b800\" ./assets/scss/components/_syntax-dark.scss",
-    "upgrade": "npx npm-check-updates -u && mod:update"
+    "upgrade": "npx npm-check-updates -u && npm run -s mod:update"
   },
   "repository": {
     "type": "git",