From 74f38a9b522482bbef72c14bfc263df808eb33ea Mon Sep 17 00:00:00 2001 From: Mirus Date: Tue, 30 Jul 2024 14:37:30 +0300 Subject: [PATCH] feat: call to action banner --- README.md | 9 +++++++++ assets/css/banner.scss | 23 +++++++++++++++++++++++ assets/css/style.scss | 3 ++- assets/js/banner.js | 12 ++++++++++++ exampleSite/config.toml | 4 ++++ layouts/_default/baseof.html | 17 +++++++++++++++++ layouts/partials/footer.html | 7 +++++++ package.hugo.json | 2 +- package.json | 2 +- 9 files changed, 76 insertions(+), 3 deletions(-) create mode 100644 assets/css/banner.scss create mode 100644 assets/js/banner.js diff --git a/README.md b/README.md index 5f7c4fd..db82dba 100644 --- a/README.md +++ b/README.md @@ -228,6 +228,15 @@ paginate = 5 # TocTitle = "Table of Contents" # default + # you can set a banner on the top of the page with a call to action + # defaults: dismissible = false; URL is optional + # [params.banner] + # dismissible = false + # text = "Check it out on GitHub" + # url = "https://github.com/mirus-ua/hugo-theme-re-terminal" + + + [params.twitter] # set Twitter handles for Twitter cards # see https://developer.twitter.com/en/docs/tweets/optimize-with-cards/guides/getting-started#card-and-content-attribution diff --git a/assets/css/banner.scss b/assets/css/banner.scss new file mode 100644 index 0000000..6955b1e --- /dev/null +++ b/assets/css/banner.scss @@ -0,0 +1,23 @@ +#banner { + width: 100%; + height: 2rem; + display: grid; + grid-template-columns: 1fr auto; + background: $accent; + + & span { + display: flex; + align-items: center; + justify-content: center; + } + + & a { + color: #1d212c; + display: inline; + } + + & > button { + padding: 0 5px 0 0; + margin: 0; + } +} \ No newline at end of file diff --git a/assets/css/style.scss b/assets/css/style.scss index f32f759..ecda4c5 100644 --- a/assets/css/style.scss +++ b/assets/css/style.scss @@ -11,9 +11,10 @@ @import "post"; @import "pagination"; @import "footer"; +@import "banner"; @import "prism"; @import "syntax"; @import "code"; @import "terms"; -@import "gist"; +@import "gist"; \ No newline at end of file diff --git a/assets/js/banner.js b/assets/js/banner.js new file mode 100644 index 0000000..f3518e5 --- /dev/null +++ b/assets/js/banner.js @@ -0,0 +1,12 @@ +const banner = document.getElementById("banner"); +const buttons = banner.getElementsByTagName("button"); + +if (buttons?.[0]) { + const listener = buttons[0].addEventListener("click", () => { + banner.remove(); + }); + + if (!document.getElementById("banner")) { + removeEventListener("click", listener); + } +} diff --git a/exampleSite/config.toml b/exampleSite/config.toml index d0e093e..30f695c 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -18,6 +18,10 @@ themeColor = "blue" showMenuItems = 2 fullWidthTheme = false centerTheme = true +[params.banner] +dismissible = false +text = "Check it out on GitHub" +url = "https://github.com/mirus-ua/hugo-theme-re-terminal" [languages] [languages.en.params] diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 8b19fcd..89dbd18 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -11,6 +11,23 @@ +{{ if .Site.Params.Banner }} + {{ with .Site.Params.Banner }} + + {{ end }} +{{ end }} + {{ $container := cond ($.Site.Params.FullWidthTheme | default false) "container full" (cond ($.Site.Params.CenterTheme | default true) "container center" "container") }}
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index a389e6e..7a3fb82 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -19,5 +19,12 @@ + +{{ if .Site.Params.Banner }} + {{ $banner := resources.Get "js/banner.js" | js.Build | resources.Minify }} + + +{{ end }} + {{ partial "extended_footer.html" . }} diff --git a/package.hugo.json b/package.hugo.json index 33c05a9..05b2a77 100644 --- a/package.hugo.json +++ b/package.hugo.json @@ -35,5 +35,5 @@ "scripts": { "test": "echo 'Test'" }, - "version": "1.1.2" + "version": "1.2.0" } diff --git a/package.json b/package.json index 52ec0aa..db976d9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "re-terminal", - "version": "1.1.2", + "version": "1.2.0", "author": "Mirus <@mirus-ua> ", "main": "index.js", "license": "MIT",