feat: call to action banner
This commit is contained in:
parent
f7c9337b3f
commit
74f38a9b52
@ -228,6 +228,15 @@ paginate = 5
|
|||||||
# TocTitle = "Table of Contents" # default
|
# 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]
|
[params.twitter]
|
||||||
# set Twitter handles for Twitter cards
|
# set Twitter handles for Twitter cards
|
||||||
# see https://developer.twitter.com/en/docs/tweets/optimize-with-cards/guides/getting-started#card-and-content-attribution
|
# see https://developer.twitter.com/en/docs/tweets/optimize-with-cards/guides/getting-started#card-and-content-attribution
|
||||||
|
23
assets/css/banner.scss
Normal file
23
assets/css/banner.scss
Normal file
@ -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;
|
||||||
|
}
|
||||||
|
}
|
@ -11,6 +11,7 @@
|
|||||||
@import "post";
|
@import "post";
|
||||||
@import "pagination";
|
@import "pagination";
|
||||||
@import "footer";
|
@import "footer";
|
||||||
|
@import "banner";
|
||||||
|
|
||||||
@import "prism";
|
@import "prism";
|
||||||
@import "syntax";
|
@import "syntax";
|
||||||
|
12
assets/js/banner.js
Normal file
12
assets/js/banner.js
Normal file
@ -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);
|
||||||
|
}
|
||||||
|
}
|
@ -18,6 +18,10 @@ themeColor = "blue"
|
|||||||
showMenuItems = 2
|
showMenuItems = 2
|
||||||
fullWidthTheme = false
|
fullWidthTheme = false
|
||||||
centerTheme = true
|
centerTheme = true
|
||||||
|
[params.banner]
|
||||||
|
dismissible = false
|
||||||
|
text = "Check it out on GitHub"
|
||||||
|
url = "https://github.com/mirus-ua/hugo-theme-re-terminal"
|
||||||
|
|
||||||
[languages]
|
[languages]
|
||||||
[languages.en.params]
|
[languages.en.params]
|
||||||
|
@ -11,6 +11,23 @@
|
|||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body class="{{- ( or .Params.color $.Site.Params.ThemeColor ) -}}">
|
<body class="{{- ( or .Params.color $.Site.Params.ThemeColor ) -}}">
|
||||||
|
{{ if .Site.Params.Banner }}
|
||||||
|
{{ with .Site.Params.Banner }}
|
||||||
|
<div id="banner">
|
||||||
|
<span>
|
||||||
|
{{ if .url }}
|
||||||
|
<a href="{{ .url }}">{{ .text }}</a>
|
||||||
|
{{ else }}
|
||||||
|
{{ .text }}
|
||||||
|
{{ end }}
|
||||||
|
</span>
|
||||||
|
{{ if .dismissible }}
|
||||||
|
<button type="button">x</button>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
{{ $container := cond ($.Site.Params.FullWidthTheme | default false) "container full" (cond ($.Site.Params.CenterTheme | default true) "container center" "container") }}
|
{{ $container := cond ($.Site.Params.FullWidthTheme | default false) "container full" (cond ($.Site.Params.CenterTheme | default true) "container center" "container") }}
|
||||||
|
|
||||||
<div class="{{- $container -}}{{- cond ($.Site.Params.oneHeadingSize | default true) " headings--one-size" "" }}">
|
<div class="{{- $container -}}{{- cond ($.Site.Params.oneHeadingSize | default true) " headings--one-size" "" }}">
|
||||||
|
@ -19,5 +19,12 @@
|
|||||||
|
|
||||||
<script type="text/javascript" src="{{ $bundle.RelPermalink }}"></script>
|
<script type="text/javascript" src="{{ $bundle.RelPermalink }}"></script>
|
||||||
|
|
||||||
|
<!-- Banner JS if it enabled -->
|
||||||
|
{{ if .Site.Params.Banner }}
|
||||||
|
{{ $banner := resources.Get "js/banner.js" | js.Build | resources.Minify }}
|
||||||
|
|
||||||
|
<script type="text/javascript" src="{{ $banner.RelPermalink }}"></script>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
<!-- Extended footer section-->
|
<!-- Extended footer section-->
|
||||||
{{ partial "extended_footer.html" . }}
|
{{ partial "extended_footer.html" . }}
|
||||||
|
@ -35,5 +35,5 @@
|
|||||||
"scripts": {
|
"scripts": {
|
||||||
"test": "echo 'Test'"
|
"test": "echo 'Test'"
|
||||||
},
|
},
|
||||||
"version": "1.1.2"
|
"version": "1.2.0"
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "re-terminal",
|
"name": "re-terminal",
|
||||||
"version": "1.1.2",
|
"version": "1.2.0",
|
||||||
"author": "Mirus <@mirus-ua> <mirusim@gmail.com>",
|
"author": "Mirus <@mirus-ua> <mirusim@gmail.com>",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
Loading…
Reference in New Issue
Block a user