Add extra info modal
This commit is contained in:
parent
d51764b859
commit
36c86e59ab
4 changed files with 263 additions and 4 deletions
|
@ -12,6 +12,7 @@ import {
|
|||
faNotebook,
|
||||
faPodium,
|
||||
faPresentation,
|
||||
faScaleBalanced,
|
||||
faUniversity,
|
||||
faUserAstronaut,
|
||||
faVideo,
|
||||
|
@ -103,6 +104,7 @@ library.add(
|
|||
faPeertube,
|
||||
faPodium,
|
||||
faPresentation,
|
||||
faScaleBalanced,
|
||||
faStackOverflow,
|
||||
faSteam,
|
||||
faUniversity,
|
||||
|
|
|
@ -138,3 +138,11 @@
|
|||
.fa-stack-top {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.table-condensed th {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.table-condensed td {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
|
||||
|
||||
<body>
|
||||
{{ partial "extras-modal" . }}
|
||||
<div class="container-fluid">
|
||||
<div class="row wrapper min-vh-100 flex-column flex-sm-row">
|
||||
<aside class="col-12 col-md-3 p-0 bg-dark flex-shrink-1">
|
||||
|
@ -142,14 +143,15 @@
|
|||
>
|
||||
<i class="fax fa-nextcloud fa-fw"></i>
|
||||
</a>
|
||||
<a
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-primary btn-sm"
|
||||
href="#"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#extras-modal"
|
||||
title="Extras"
|
||||
>
|
||||
<i class="fad fa-cowbell fa-fw"></i>
|
||||
</a>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
247
layouts/partials/extras-modal.html
Normal file
247
layouts/partials/extras-modal.html
Normal file
|
@ -0,0 +1,247 @@
|
|||
<div
|
||||
class="modal fade"
|
||||
id="extras-modal"
|
||||
tabindex="-1"
|
||||
aria-labelledby="extras-modal-label"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-scrollable modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5">Bonus content</h1>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-close"
|
||||
data-bs-dismiss="modal"
|
||||
aria-label="Close"
|
||||
></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<ul class="nav nav-tabs" role="tablist">
|
||||
<li class="nav-item" role="presentation">
|
||||
<a
|
||||
class="nav-link active"
|
||||
data-bs-toggle="tab"
|
||||
href="#oss"
|
||||
aria-selected="true"
|
||||
role="tab"
|
||||
>Open Source</a
|
||||
>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<a class="nav-link" data-bs-toggle="tab" href="#privacy" role="tab">
|
||||
Privacy</a
|
||||
>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<a class="nav-link" data-bs-toggle="tab" href="#debug" role="tab">
|
||||
Debug
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane fade show active p-3" id="oss" role="tabpanel">
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/4.0/">
|
||||
<img
|
||||
class="img img-responsive"
|
||||
alt="Creative Commons License"
|
||||
style="border-width:0; display: block; margin: 0 auto"
|
||||
src="https://i.creativecommons.org/l/by/4.0/88x31.png"
|
||||
/>
|
||||
</a>
|
||||
<p>
|
||||
“{{ .Title }}” by
|
||||
Thomas A. Christensen II is licensed under a
|
||||
<a
|
||||
rel="license"
|
||||
href="http://creativecommons.org/licenses/by/4.0/"
|
||||
>Creative Commons Attribution 4.0 International License</a
|
||||
>.
|
||||
</p>
|
||||
<p>
|
||||
All images, unless otherwise noted, are licensed under a
|
||||
<a
|
||||
rel="license"
|
||||
href="http://creativecommons.org/licenses/by-nd/4.0/"
|
||||
>Creative Commons Attribution-NoDerivatives 4.0 International
|
||||
License</a
|
||||
>, instead.
|
||||
</p>
|
||||
<hr />
|
||||
<p>
|
||||
This site is open source!
|
||||
<br />
|
||||
<a
|
||||
class="btn btn-dark"
|
||||
href="https://code.millironx.com/millironx/millironx.github.io"
|
||||
>
|
||||
<i class="fax fa-gitea"></i> Get the code! »
|
||||
</a>
|
||||
<a
|
||||
class="btn btn-dark"
|
||||
href="https://code.millironx.com/millironx/millironx.github.io/src/branch/master/LICENSE"
|
||||
>
|
||||
<i class="fad fa-scale-balanced"></i> MIT Licensed »
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
In addition, I used a number of excellent open-source libraries
|
||||
and toolkits in building it. I dedicate this space to
|
||||
acknowledging them all.
|
||||
</p>
|
||||
<table class="table table-condensed table-responsive table-striped">
|
||||
<tr>
|
||||
<th>Project name</th>
|
||||
<th>URL</th>
|
||||
<th>License</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Hugo</th>
|
||||
<td><a href="https://gohugo.io/">gohugo.io</a></td>
|
||||
<td>
|
||||
<a href="https://github.com/gohugoio/hugo/blob/master/LICENSE"
|
||||
>Apache License v2</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Node.js</th>
|
||||
<td><a href="https://nodejs.org/">nodejs.org</a></td>
|
||||
<td>
|
||||
<a href="https://github.com/nodejs/node/blob/HEAD/LICENSE"
|
||||
>MIT License</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Bootstrap 5</th>
|
||||
<td>
|
||||
<a href="https://getbootstrap.com/">getbootstrap.com</a>
|
||||
</td>
|
||||
<td>
|
||||
<a href="https://github.com/twbs/bootstrap/blob/main/LICENSE"
|
||||
>MIT License</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Bootswatch Lux 5</th>
|
||||
<td>
|
||||
<a href="https://bootswatch.com/lux/">bootswatch.com</a>
|
||||
</td>
|
||||
<td>
|
||||
<a
|
||||
href="https://github.com/thomaspark/bootswatch/blob/v5/LICENSE"
|
||||
>MIT License</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>JQuery 3</th>
|
||||
<td><a href="https://jquery.com/">jquery.com</a></td>
|
||||
<td><a href="https://jquery.org/license">MIT License</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Font Awesome 6</th>
|
||||
<td><a href="https://fontawesome.com/">fontawesome.com</a></td>
|
||||
<td>
|
||||
<a href="https://fontawesome.com/license/"
|
||||
>Font Awesome Pro License</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Get S*** Done Toolkit</th>
|
||||
<td>
|
||||
<a
|
||||
href="https://www.creative-tim.com/product/get-shit-done-kit"
|
||||
>creative-tim.com</a
|
||||
>
|
||||
</td>
|
||||
<td>
|
||||
<a
|
||||
href="https://github.com/timcreative/freebies/blob/master/LICENSE.md"
|
||||
>MIT License</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>FitText</th>
|
||||
<td><a href="http://fittextjs.com/">fittextjs.com</a></td>
|
||||
<td><a href="http://www.wtfpl.net/">WTFPL License</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>jQuery Mask Plugin</th>
|
||||
<td>
|
||||
<a href="https://igorescobar.github.io/jQuery-Mask-Plugin/"
|
||||
>igorescobar.github.io</a
|
||||
>
|
||||
</td>
|
||||
<td>
|
||||
<a
|
||||
href="https://github.com/igorescobar/jQuery-Mask-Plugin/blob/master/LICENSE"
|
||||
>MIT License</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>PostCSS</th>
|
||||
<td><a href="https://postcss.org/">postcss.com</a></td>
|
||||
<td>
|
||||
<a href="https://github.com/postcss/postcss/blob/main/LICENSE"
|
||||
>MIT License</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>PurgeCSS</th>
|
||||
<td><a href="https://purgecss.com/">purgecss.com</a></td>
|
||||
<td>
|
||||
<a
|
||||
href="https://github.com/FullHuman/purgecss/blob/main/LICENSE"
|
||||
>MIT License</a
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-pane fade p-3" id="privacy" role="tabpanel">
|
||||
<p>
|
||||
I take privacy very seriously. That said, I do need
|
||||
<i>some</i> info on how many people visit. As a compromise, this
|
||||
site uses <a href="https://goatcounter.com">GoatCounter</a>, a
|
||||
privacy-friendly (as much as possible) web analytics library.
|
||||
</p>
|
||||
<p>
|
||||
You may view all analytics gathered at
|
||||
<a href="https://millironx.goatcounter.com/"
|
||||
>millironx.goatcounter.com</a
|
||||
>.
|
||||
</p>
|
||||
<p>
|
||||
If you do not wish to participate in my site's analytics, you may
|
||||
install a content-blocking extension into your browser and block
|
||||
the domain
|
||||
<code>gc.zgo.at</code>. I recommend either
|
||||
<a href="https://github.com/gorhill/uBlock">uBlock Origin</a>
|
||||
(instructions
|
||||
<a
|
||||
href="https://github.com/gorhill/uBlock/wiki/Dashboard:-My-filters"
|
||||
>here</a
|
||||
>) or <a href="https://noscript.net">NoScript</a> for this
|
||||
purpose.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane fade p-3" id="debug" role="tabpanel">
|
||||
<dl>
|
||||
{{ range $key, $val := .Params }}
|
||||
<dt>{{ $key }}</dt>
|
||||
<dd>{{ $val }}</dd>
|
||||
{{ end }}
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
Loading…
Reference in a new issue