Add buy me a coffee link to footer

This commit is contained in:
kolaente 2020-04-16 23:18:49 +02:00
parent c0d3eccb16
commit cbc6a98e90
Signed by: konrad
GPG Key ID: F40E70337AB24C9B
3 changed files with 78 additions and 51 deletions

View File

@ -1,60 +1,67 @@
<footer class="footer"> <footer class="footer">
<div class="container"> <div class="container">
<div class="has-text-centered"> <div class="has-text-centered">
<p> <p>
Copyright &copy; {{ now.Year }} Copyright &copy; {{ now.Year }}
<a href="{{ .Site.Params.website }}">{{ .Site.Params.author }}</a>. <a href="{{ .Site.Params.website }}">{{ .Site.Params.author }}</a>.
All rights reserved. Made with ♥️ and <a href="https://gohugo.io">Hugo</a>. All rights reserved. Made with ♥️ and <a href="https://gohugo.io">Hugo</a>.
{{/* The site urls are hard coded because both sites are located at the same path but the base website url is different on the docs page */}} {{/* The site urls are hard coded because both sites are located at the same path but the base website
<a href="https://vikunja.io/contact/">Contact</a> | url is different on the docs page */}}
<a href="https://vikunja.io/privacy/">Privacy Policy</a> <a href="https://vikunja.io/contact/">Contact</a> |
</p> <a href="https://vikunja.io/privacy/">Privacy Policy</a>
<p> </p>
<a href="https://riot.im/app/#/room/!dCRiCiLaCCFVNlDnYs:matrix.org?via=matrix.org"> <p class="footer-buttons">
<img src="https://img.shields.io/badge/chat-on%20matrix.org-brightgreen" alt="Chat on matrix.org"/> <a href="https://riot.im/app/#/room/!dCRiCiLaCCFVNlDnYs:matrix.org?via=matrix.org">
</a> <img src="https://img.shields.io/badge/chat-on%20matrix.org-brightgreen" alt="Chat on matrix.org"/>
</p> </a>
{{/* <a target="_blank" href="https://www.buymeacoffee.com/kolaente" class="button coffe is-primary">
Commented out until we actually have a multi-language website. <span class="icon is-small">
<p> <img src="https://cdn.buymeacoffee.com/buttons/bmc-new-btn-logo.svg" alt="Buy me a coffee">
{{ $lang := .Lang }}{{ $base := .Site.BaseURL }}{{ range .Site.Languages }} </span>
<a class="nav-link" href="{{ $base }}{{ .Lang }}">{{ .LanguageName }}</a> <span>Buy Me A Coffe</span>
{{ end }} </a>
</p> </p>
*/}} {{/*
</div> Commented out until we actually have a multi-language website.
</div> <p>
</footer> {{ $lang := .Lang }}{{ $base := .Site.BaseURL }}{{ range .Site.Languages }}
<a class="nav-link" href="{{ $base }}{{ .Lang }}">{{ .LanguageName }}</a>
{{ end }}
</p>
*/}}
</div>
</div>
</footer>
<script> <script>
document.addEventListener('DOMContentLoaded', function () { document.addEventListener('DOMContentLoaded', function () {
// Get all "navbar-burger" elements // Get all "navbar-burger" elements
var $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0); var $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
// Check if there are any navbar burgers // Check if there are any navbar burgers
if ($navbarBurgers.length > 0) { if ($navbarBurgers.length > 0) {
// Add a click event on each of them // Add a click event on each of them
$navbarBurgers.forEach(function ($el) { $navbarBurgers.forEach(function ($el) {
$el.addEventListener('click', function () { $el.addEventListener('click', function () {
// Get the target from the "data-target" attribute // Get the target from the "data-target" attribute
var target = $el.dataset.target; var target = $el.dataset.target;
var $target = document.getElementById(target); var $target = document.getElementById(target);
// Toggle the class on both the "navbar-burger" and the "navbar-menu" // Toggle the class on both the "navbar-burger" and the "navbar-menu"
$el.classList.toggle('is-active'); $el.classList.toggle('is-active');
$target.classList.toggle('is-active'); $target.classList.toggle('is-active');
document.getElementById('navbar-background').classList.toggle('is-active'); document.getElementById('navbar-background').classList.toggle('is-active');
}); });
}); });
} }
}); });
</script> </script>
{{ partial "fathom-tracking.html" . }} {{ partial "fathom-tracking.html" . }}
</body> </body>
</html> </html>

View File

@ -72,6 +72,15 @@
box-shadow: none; box-shadow: none;
} }
} }
&.coffe {
padding: 1em 1.5em;
height: auto;
// Shadow from the original button
box-shadow: 0px 1px 2px rgba(190, 190, 190, 0.5) !important;
-webkit-box-shadow: 0px 1px 2px 2px rgba(190, 190, 190, 0.5) !important;
}
} }
.input, .input,
@ -249,3 +258,14 @@ h1,h2,h3,h4,h5,h6{
} }
} }
} }
.footer-buttons {
display: flex;
justify-content: center;
align-items: center;
margin-top: .5em;
*:not(:last-child) {
margin-right: .5em;
}
}

View File

@ -279,4 +279,4 @@ h1, h2, h3, h4, h5, h6 {
color: lighten(#000, 70%); color: lighten(#000, 70%);
} }
} }
} }