Add date

assets/sass/_colors.sass

@@ -0,0 +1,28 @@
+//
+// _colors.sass
+// Attractive dark mode color scheme for fmtools
+//
+
+// Primary palette
+$primary: #3380ff
+$primary-dark: #1a3e70
+$primary-light: #8fc6ff
+
+// Accent colors
+$accent: #1de9b6
+$accent-dark: #00897b
+$accent-light: #6fffd2
+
+
+// Success, warning, error
+$success: #00e676
+$warning: #ffd600
+$error: #ff1744
+
+// Neutral palette (dark mode)
+$darkest: #0a0c11
+$background: #10131a
+$surface: #1a1e29
+$border: #3a4054
+$text: #ffffff
+$text-subtle: #bfc9e6

assets/sass/_fonts.sass

@@ -76,6 +76,24 @@ $font-path: '/fonts/static/'
     font-weight: 900
     src: local('Source Sans 3 Black'), local('SourceSans3-Black'), url('#{$font-path}SourceSans3-Black.woff2') format('woff2'), url('#{$font-path}SourceSans3-Black.ttf') format('truetype')
 
+@font-face
+    font-family: 'Source Code Pro'
+    font-style: normal
+    font-display: swap
+    font-weight: 600
+    src: local('Source Code Pro Medium'), local('SourceCodePro-Medium'), url('#{$font-path}SourceCodePro-Medium.woff2') format('woff2'), url('#{$font-path}SourceCodePro-Medium.ttf') format('truetype')
+
+@font-face
+    font-family: 'Source Code Pro'
+    font-style: italic
+    font-display: swap
+    font-weight: 600
+    src: local('Source Code Pro Medium Italic'), local('SourceCodePro-MediumItalic'), url('#{$font-path}SourceCodePro-MediumItalic.woff2') format('woff2'), url('#{$font-path}SourceCodePro-MediumItalic.ttf') format('truetype')
+
+
+
 
 *
     font-family: 'Source Sans 3', sans-serif
+code 
+    font-family: 'Source Code Pro', monospace

assets/sass/_layout.sass

@@ -0,0 +1,264 @@
+/* _layout.sass */
+
+/* Variables */
+$spacing-unit: 1.5rem
+$section-spacing: 2rem
+$border-radius: 8px
+$body-width: 1024px
+
+html
+    background: darken($background, 3%)
+
+/* Base Layout */
+body
+    background: $background
+    color: $text
+    font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif
+    width: 100%
+    height: 100%
+    max-width: $body-width
+    margin: $spacing-unit auto
+    padding: $spacing-unit
+    box-sizing: border-box
+    border-radius: $border-radius
+
+header
+    background: $surface
+    margin: $spacing-unit
+    padding: $spacing-unit
+    display: flex
+    flex-wrap: wrap
+    align-items: center
+    justify-content: space-between
+    border-radius: $border-radius
+    margin: 0 auto
+
+header h1, header h1 a
+    margin: 0
+    font-size: 1.6rem
+    font-weight: 900
+    color: $text
+    text-decoration: none
+    padding: 0
+    transition: color 0.4s ease-in-out
+    &:hover, &:focus
+        color: $accent-light
+
+nav
+    display: flex
+    gap: $spacing-unit
+    align-items: center
+
+nav ul
+    list-style: none
+    margin: 0
+    padding: 0
+    display: flex
+    gap: 0.5rem
+    flex-wrap: wrap
+
+nav ul li
+    margin: 0
+    padding: 0
+
+nav ul li a
+    padding: 0.4rem 0.6rem
+    border-radius: $border-radius
+    background: $primary-dark
+    color: $text
+    text-decoration: none
+    font-weight: 500
+    transition: background 0.4s ease-in-out
+    &:hover, &:focus
+        background: $accent-dark
+        color: $text
+
+@media (max-width: 600px)
+    header
+        flex-direction: column
+        align-items: flex-start
+        gap: $spacing-unit
+
+    nav
+        width: 100%
+        justify-content: flex-start
+        margin-top: $spacing-unit
+
+main
+    margin: $spacing-unit 0
+    padding: $spacing-unit
+
+footer
+    background: $surface
+    margin: $spacing-unit
+    padding: $spacing-unit
+    border-radius: $border-radius
+    margin: 0 auto
+    text-align: center
+
+footer p
+    margin: 0
+    font-size: 0.9rem
+    color: $text-subtle
+    text-align: center
+
+section
+    border-bottom: 3px solid $surface
+    margin: $section-spacing 0
+    padding-bottom: $section-spacing
+
+#page-header
+    border-bottom: 3px solid $surface
+    margin: $section-spacing 0
+    padding-bottom: $section-spacing
+    text-align: center
+    h1
+        margin: 0
+        width: 100%
+        font-size: 3rem
+        word-break: break-word
+    .subtitle
+        margin: 0
+        width: 100%
+        font-size: 1.2rem
+        font-weight: 300
+        color: $text-subtle
+.time
+    font-size: 0.8rem
+    color: $text-subtle
+    text-align: center
+
+#tool-cards
+    display: flex
+    flex-wrap: wrap
+    gap: $spacing-unit
+    // justify-content: space-between
+
+    > article
+        flex: 1 1 48%
+        min-width: 300px
+        max-width: 48%
+        box-sizing: border-box
+
+    @media (max-width: 900px)
+        > article
+            flex-basis: 100%
+            max-width: 100%
+
+article
+    background: $surface
+    border-radius: 8px
+    padding: 1rem 1.5rem
+    // margin: $spacing-unit 0
+    // position: relative
+    transition: background 0.5s ease-in-out
+    &:hover, &:focus
+        background: $primary-dark
+    h3
+        margin: 0
+        font-size: 1.5rem
+        font-weight: 700
+        color: $text
+    a
+        color: $text
+        position: absolute
+        top: 0
+        left: 0
+        width: 100%
+        height: 100%
+        z-index: 1
+        text-indent: -9999px
+        overflow: hidden
+        text-decoration: none
+        transition: color 0.3s ease-in-out
+        &:hover, &:focus
+            color: $accent-light
+    &:not(a)
+        position: relative
+        z-index: 2
+    p
+        margin: 0.5rem 0
+        font-size: 1rem
+        color: $text
+        font-weight: 300
+
+    .subtitle
+        margin: 0 0 0 0.5rem
+        width: 100%
+        font-size: 1.1rem
+        font-weight: 300
+        color: $text-subtle
+
+.term-title
+    font-weight: 700
+    padding: 0.3rem 0.8rem
+    margin-bottom: 0.5rem
+    border-radius: $border-radius
+
+p code
+    background: darken($primary-dark,10%)
+    margin: 0 0.2rem
+    padding: 0.2rem 0.4rem
+    border-radius: 5px
+    font-size: 0.8rem
+
+pre
+    padding: 0.5rem
+    border-radius: 5px
+    overflow-x: auto
+    code
+        font-size: 0.8rem
+
+.banner
+    position: fixed
+    top: 0
+    width: 100%
+    max-width: $body-width
+    background-color: $accent
+    color: $darkest
+    padding: 5px 0
+    font-weight: 400
+    text-align: center
+    font-size: 1.1em
+    border-radius: 0 0 8px 8px
+    z-index: 1000
+    font-size: 0.9rem
+    height: 1.3rem
+    margin-left: calc(0% - #{$spacing-unit})
+
+    a
+        color: $darkest
+        text-decoration: underline
+        font-weight: 700
+        transition: color 0.3s ease-in-out
+        &:hover, &:focus
+            color: $primary-dark
+
+body:has(.banner)
+    margin-top: 2.6rem
+
+@media (max-width: 600px)
+    .banner
+        position: absolute
+        top: 0
+        width: calc(100% - #{$spacing-unit})
+        max-width: $body-width
+        background-color: $accent
+        color: $darkest
+        padding: 5px
+        font-weight: 400
+        text-align: center
+        font-size: 1.1em
+        border-radius: 0 0 8px 8px
+        z-index: 1000
+        font-size: 0.9rem
+        height: 4.3rem
+        margin-left: calc(0% - #{$spacing-unit})
+
+        .banner-text
+            display: block
+            margin: 0 5px
+        
+
+    body:has(.banner)
+        margin-top: 5.6rem

assets/sass/_links.sass

@@ -0,0 +1,57 @@
+/* _text.sass */
+
+a
+    color: $accent-light
+    text-decoration: underline
+    transition: color 0.3s ease-in-out
+    &:hover, &:focus
+        color: $primary
+
+#quick-links
+    text-align: left
+
+#link-list
+    display: flex
+    gap: $spacing-unit
+    align-items: center
+    flex-wrap: wrap
+    margin: 2rem 0 $spacing-unit 0
+    justify-content: center
+
+#link-list h2
+    flex: none
+
+#link-list ul
+    list-style: none
+    margin: 0
+    padding: 0
+    display: flex
+    gap: 1rem
+    flex-wrap: wrap
+
+#link-list ul li
+    margin: 0
+    padding: 0
+
+#link-list ul li a
+    padding: 0.3rem 0.6rem
+    border-radius: $border-radius
+    background: $primary-light
+    color: $darkest
+    text-decoration: none
+    font-weight: 500
+    transition: background 0.3s ease-in-out
+    &:hover, &:focus
+        background: $accent-light
+
+a.button
+    padding: 0.3rem 0.6rem
+    margin: 0 0.2rem
+    border-radius: $border-radius
+    background: $primary-light
+    color: $darkest
+    text-decoration: none
+    font-weight: 500
+    transition: background 0.3s ease-in-out
+    &:hover, &:focus
+        background: $accent-light

assets/sass/_publications.sass

@@ -0,0 +1,21 @@
+#publications
+    font-weight: 300
+    ul
+        list-style: none
+        margin: 0
+        padding: 0
+        display: flex
+        flex-direction: column
+        gap: 1em
+
+        li
+            background: $surface
+            border-radius: 8px
+            padding: 1em 1.5em
+    a
+        color: $primary-light
+        text-decoration: none
+        font-weight: 100
+        transition: color 0.3s ease-in-out
+        &:hover, &:focus
+            color: $accent-light

assets/sass/_taxonomy.sass

@@ -0,0 +1,90 @@
+
+table#taxonomy-table
+    width: 100%
+    border-collapse: collapse
+    // border: 3px solid $darkest
+    box-sizing: border-box
+    background: $surface
+    text-align: left
+
+    tr
+        border-bottom: 3px solid $background
+        &:nth-child(even)
+            background: darken($surface, 2%)
+            transition: background 0.4s ease-in-out
+        &:nth-child(odd)
+            background: lighten($surface, 3%)
+            transition: background 0.4s ease-in-out
+        &:hover, &:focus
+            background: $border
+
+    thead
+        text-align: left
+        border: none
+        border-radius: $border-radius $border-radius 0 0
+
+    th
+        color: $text
+        background: $darkest !important
+        padding: 0.6rem 0.6rem
+        text-align: left
+        font-weight: 600
+        border: none
+
+    td
+        padding: 0.3rem 0.6rem
+        text-align: left
+        font-weight: 600
+        border: none
+
+    td.description
+        font-weight: 300
+        color: $text-subtle
+    td.tool
+        min-width: 100px
+
+    a.term-link
+        padding: 0.2rem 0.6rem
+        margin: 0.2rem
+        display: inline-block
+        border-radius: $border-radius
+        text-decoration: none
+        font-weight: 500
+        color: $text
+        transition: color 0.4s ease-in-out, background 0.4s ease-in-out
+        &:hover, &:focus
+            color: $darkest !important
+            background: $text-subtle !important
+
+    a.taxonomy-name
+        padding: 0
+        margin: 0.2rem
+        display: inline-block
+        border-radius: $border-radius
+        text-decoration: none
+        font-weight: 500
+        color: $text
+        transition: color 0.4s ease-in-out
+        &:hover, &:focus
+            color: $accent-light
+
+    a
+        color: $text
+        text-decoration: none
+        &:hover, &:focus
+            color: $accent
+
+#taxonomy-page a.term-link
+    padding: 0.3rem 1.2rem
+    margin: 0.2rem
+    display: inline-block
+    border-radius: $border-radius
+    text-decoration: none
+    font-weight: 500
+    font-size: 1.2rem
+    color: $text
+    transition: color 0.4s ease-in-out, background 0.4s ease-in-out
+    &:hover, &:focus
+        color: $darkest !important
+        background: $text-subtle !important
+

assets/sass/main.sass

@@ -1,4 +1,6 @@
 @import "fonts"
-*
-    color: white
-    background: black
+@import "colors"
+@import "layout"
+@import "taxonomy"
+@import "links"
+@import "publications"

hugo.toml

@@ -1,5 +1,5 @@
 [module]
   [module.hugoVersion]
-    extended = false
+    extended = true
     min = '0.146.0'
 

layouts/404.html

@@ -0,0 +1,17 @@
+{{ define "main" }}
+
+  <div id="page-header">
+    <h1>Oh No!</h1>
+    <span class="subtitle">This is not the page you are looking for.</span>
+  </div>
+
+  <section>
+  <p>This is really embarrassing, but the page you were looking for does not exist. It may have been moved or deleted.</p>
+  <p>Please <a href="https://gitmoss.fyi/fmtools/content/issues/new" target="_blank">submit an issue</a> if you think this is a mistake, or you can go back to the <a href="{{ "/" | relLangURL }}">home page</a>.</p>
+  </section>
+
+  <!-- {{ $dateMachine := .Date | time.Format "2006-01-02T15:04:05-07:00" }}
+  {{ $dateHuman := .Date | time.Format ":date_long" }}
+  <p class="time">Updated <time datetime="{{ $dateMachine }}">{{ $dateHuman }}</time></p> -->
+
+{{ end }}

layouts/_markup/render-link.html

@@ -0,0 +1 @@
+<a href="{{ .Destination | safeURL }}"{{ with .Title}} title="{{ . }}"{{ end }}{{ if or (strings.HasPrefix .Destination "http") (strings.HasPrefix .Destination "https") }} target="_blank"{{ end }} >{{ .Text | safeHTML }}</a>

layouts/_partials/banner.html

@@ -0,0 +1,5 @@
+<div class="banner">
+    <span class="banner-text">{{ .Site.Params.bannerTitle }}
+    {{ .Site.Params.banner | markdownify }}
+    </span>
+</div>

layouts/_partials/footer.html

@@ -1 +1,4 @@
-<p>Copyright {{ now.Year }}. All rights reserved.</p>
+<p><a href="/contribute">Contribute</a> &nbsp;|&nbsp; <a href="/about">About</a> &nbsp;|&nbsp; <a href="/license">License</a> &nbsp;|&nbsp; <a href="/privacy">Privacy</a> </p>
+<!-- <p>Open-source under <a href="">MIT License</a></p> -->
+<!-- <p>The information on this website is presented for educational purposes only.</p> -->
+<p>&copy; Copyright {{ now.Year }}. An open-source project.</p>

layouts/_partials/head.html

@@ -2,6 +2,7 @@
 <!-- <meta name="viewport" content="width=device-width"> -->
 <meta name="viewport" content ="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
 <title>{{ if .IsHome }}{{ site.Title }}{{ else }}{{ printf "%s | %s" .Title site.Title }}{{ end }}</title>
 {{- partial "opengraph" . }}
 {{- partialCached "favicon" . }}

layouts/_partials/styles.html

@@ -2,3 +2,25 @@
 {{ $mainSassFile :=  "sass/main.sass" }}
 {{- $styles := resources.Get $mainSassFile | resources.ExecuteAsTemplate $mainSassFile . | css.Sass $options | resources.Fingerprint "sha512" }}
 <link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}">
+
+  <link href="/css/fontawesome.css" rel="stylesheet" />
+  <link href="/css/brands.css" rel="stylesheet" />
+  <link href="/css/solid.css" rel="stylesheet" />
+
+<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
+<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
+<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
+<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
+<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
+<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png">
+<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png">
+<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
+<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
+<link rel="icon" type="image/png" sizes="192x192"  href="/android-icon-192x192.png">
+<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
+<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
+<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
+<link rel="manifest" href="/manifest.json">
+<meta name="msapplication-TileColor" content="#ffffff">
+<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
+<meta name="theme-color" content="#ffffff">

layouts/_partials/term-link.html

@@ -7,6 +7,7 @@
 {{ $b := printf "0x%s" (substr $hash 4 2) | int }}
 {{ $rgba := printf "rgba(%d,%d,%d,0.2)" $r $g $b }}
 <a 
+    class="term-link"
     id="{{ $taxonomy | urlize }}_{{ $name | urlize }}" 
     style="background:rgba({{ $r }},{{ $g }},{{ $b }},0.4)" 
     href="{{ "/" | relLangURL}}{{ $taxonomy | urlize }}{{ "/" | relLangURL}}{{ $name | urlize }}">

layouts/baseof.html

@@ -4,6 +4,9 @@
   {{ partial "head.html" . }}
 </head>
 <body>
+  {{ if .Site.Params.banner }}
+  {{ partial "banner.html" . }}
+  {{ end }}
   <header>
     {{ partial "header.html" . }}
   </header>

layouts/home.html

@@ -1,7 +1,51 @@
 {{ define "main" }}
-  {{ .Content }}
-  {{ range site.RegularPages }}
-    <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
-    {{ .Summary }}
+
+  <div id="page-header">
+    <h1>{{ .Title }}</h1>
+    {{ if .Params.subtitle }}
+      <span class="subtitle">{{ .Params.subtitle }}</span>
     {{ end }}
+  </div>
+
+  <section>
+  {{ .Content }}
+  </section>
+
+  {{ $pages := shuffle (where site.RegularPages "Section" "tools") | first 20 }}
+  <section>
+    <h2>Try Something New</h2>
+    <p>This list shows a selection of 20 random tools, refreshed every time this site is updated.</p>
+    <div id="tool-cards">
+    {{ range $pages }}
+      <article class="tool-card">
+        <h3>
+          {{ .Title }}
+          {{ if .Params.subtitle }}
+            <span class="subtitle">{{ .Params.subtitle }}</span>
+          {{ end }}
+        </h3>
+        <p>{{ .Content | plainify | truncate 100 }}</p>
+        <a href="{{ .RelPermalink }}" style="position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;text-indent:-9999px;overflow:hidden;">{{ .Title }}</a>
+      </article>
+    {{ end }}
+    </div>
+  </section>
+
+    <div class="time" style="display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;">
+    <div class="footer-links" style="text-align: left;">
+      Help improve this page!<br/>
+      Submit an 
+      <a href="https://gitmoss.fyi/fmtools/content/issues/new?template=.gitea%2fissue_template%2ffix_tool.md&title=[FIX]%20{{ .Title | urlquery }}" target="_blank">issue</a> or 
+      <a href="https://gitmoss.fyi/fmtools/content/fork" target="_blank">pull request</a>.
+    </div>
+    {{ if now }}
+    <div class="footer-date" style="text-align: right;">
+      {{ $dateMachine := now | time.Format "2006-01-02T15:04:05-07:00" }}
+      {{ $dateHuman := now | time.Format "2 January 2006" }}
+      Made with &#9829; using <a href="https://gohugo.io" target="_blank">Hugo</a> <br/>
+      Built <time datetime="{{ $dateMachine }}">{{ $dateHuman }}</time>
+    </div>
+    {{ end }}
+  </div>
+
 {{ end }}

layouts/page.html

@@ -1,26 +1,42 @@
 {{ define "main" }}
+
+  <div id="page-header">
     <h1>{{ .Title }}</h1>
-
-  {{ $dateMachine := .Date | time.Format "2006-01-02T15:04:05-07:00" }}
-  {{ $dateHuman := .Date | time.Format ":date_long" }}
-  <time datetime="{{ $dateMachine }}">{{ $dateHuman }}</time>
-
-  {{ .Content }}
+    {{ if .Params.subtitle }}
+      <span class="subtitle">{{ .Params.subtitle }}</span>
+    {{ end }}
+    {{ with .Params.links }}
+    <!-- <section id="quick-links"> -->
+      <!-- <h2>Quick Links</h2> -->
+      <div id="link-list">
+        <ul>
+          {{ range . }}
+            <li><a href="{{ .url }}" target="_blank" rel="noopener">{{ if .icon }}<i class="{{ .icon }}"></i>&nbsp;&nbsp;{{ end }}{{ .title }}</a></li>
+          {{ end }}
+        </ul>
+      </div>
+    <!-- </section> -->
+    {{ end }}
+  </div>
 
   <section>
-    <ul id="taxonomies">
-      {{ range $taxonomyname, $taxonomy := .Site.Taxonomies }}
-        <li>{{ $taxonomyname | strings.FirstUpper }}
-        <!-- <li><a href="{{ "/" | relLangURL}}{{ $taxonomyname | urlize }}">{{ $taxonomyname }}</a> -->
-          <ul>
-            {{ range $key, $value := $taxonomy }}
-            <li><a href="{{ "/" | relLangURL}}{{ $taxonomyname | urlize }}{{ "/" | relLangURL}}{{ $key | urlize }}">{{ $key }}</a></li>
-            {{ end }}
-          </ul>
-        </li>
-      {{ end }}
-    </ul>
+  {{ .Content }}
   </section>
 
+  <div class="time" style="display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;">
+  <div class="footer-links" style="text-align: left;">
+    Help improve this page!<br/>
+    Submit an 
+    <a href="https://gitmoss.fyi/fmtools/content/issues/new?&title=[FIX]%20{{ .Title | urlquery }}" target="_blank">issue</a> or 
+    <a href="https://gitmoss.fyi/fmtools/content/fork" target="_blank">pull request</a>.
+  </div>
+  {{ if .Date }}
+  <div class="footer-date" style="text-align: right;">
+    {{ $dateMachine := .Date | time.Format "2006-01-02T15:04:05-07:00" }}
+    {{ $dateHuman := .Date | time.Format "2 January 2006" }}
+    Updated <time datetime="{{ $dateMachine }}">{{ $dateHuman }}</time>
+  </div>
+  {{ end }}
+</div>
 
 {{ end }}

layouts/section.html

@@ -1,8 +1,12 @@
 {{ define "main" }}
   <h1>{{ .Title }}</h1>
   {{ .Content }}
+  <section>
     {{ range .Pages }}
-    <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
-    {{ .Summary }}
+      <article>
+        <h3><a href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
+            <p>{{ .Content | plainify | truncate 100 }}</p>
+      </article>
     {{ end }}
+  </section>
 {{ end }}

layouts/shortcodes/button.html

@@ -0,0 +1,3 @@
+<a href="{{ .Get "href" }}" class="button">
+    {{ .Inner | safeHTML }}
+</a>

layouts/shortcodes/closed-source.html

@@ -0,0 +1,6 @@
+<div style="display: flex; align-items: center; gap: 8px;">
+    <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(226, 181, 59);"></span>
+    <span style="display:none">[</span>
+    <span style="color: rgb(226, 181, 59); font-size: 1rem;">Closed-Source Tool</span>
+    <span style="display:none">]&nbsp;</span>
+</div>

layouts/shortcodes/inactive.html

@@ -0,0 +1,12 @@
+
+
+<div style="display: flex; align-items: center; gap: 8px;">
+    <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(240, 85, 85);"></span>
+    <span style="display:none">[</span>
+    {{ if .Get "year" }}
+    <span style="color: rgb(240, 85, 85); font-size: 1rem;">Not Maintained Since {{ .Get "year" }}</span>
+    {{ else }}
+    <span style="color: rgb(240, 85, 85); font-size: 1rem;">No Longer Maintained</span>
+    {{ end }}
+    <span style="display:none">]</span>
+</div>

layouts/taxonomies.html

@@ -0,0 +1,37 @@
+{{ define "main" }}
+  <h1>{{ .Title }}</h1>
+  {{ .Content }}
+
+  <section>
+    <table id="taxonomy-table">
+      <!-- <thead>
+        <tr>
+          <th>Taxonomy</th>
+          <th>Terms</th>
+        </tr>
+      </thead> -->
+      <tbody>
+        {{ range $taxonomyname, $taxonomy := .Site.Taxonomies }}
+        {{ with $taxonomy }}
+        <tr>
+          <td>
+            <a 
+              class="taxonomy-name" 
+              href="{{ "/" | relLangURL }}{{ $taxonomyname }}">
+              {{ $taxonomyname | strings.FirstUpper }}
+            </a>
+          </td>
+          <td>
+            {{ range $key, $value := $taxonomy }}
+              {{ partial "term-link.html" (dict "name" $value.Page.Title "taxonomy" $taxonomyname) }}
+            {{ end }}
+          </td>
+        </tr>
+        {{ end }}
+        {{ end }}
+      </tbody>
+    </table>
+  </section>
+
+
+{{ end }}

layouts/taxonomy.html

@@ -1,7 +1,11 @@
 {{ define "main" }}
-  <h1>{{ .Title }}</h1>
+  <h1>All {{ .Title }}</h1>
   {{ .Content }}
+  <section id="taxonomy-page">
+  {{ $taxonomy := .Title | urlize }}
   {{ range .Pages }}
-    <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
+    <!-- <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2> -->
+    {{ partial "term-link.html" (dict "name" .LinkTitle "taxonomy" $taxonomy ) }}
   {{ end }}
+  </section>
 {{ end }}

layouts/term.html

@@ -1,7 +1,70 @@
 {{ define "main" }}
-  <h1>{{ .Title }}</h1>
+  <h1> 
+    {{ $hash := md5 .Title }}
+    {{ $r := printf "0x%s" (substr $hash 0 2) | int }}
+    {{ $g := printf "0x%s" (substr $hash 2 2) | int }}
+    {{ $b := printf "0x%s" (substr $hash 4 2) | int }}
+    {{ $rgba := printf "rgba(%d,%d,%d,0.2)" $r $g $b }}
+    <span 
+    class="term-title"
+    style="background:rgba({{ $r }},{{ $g }},{{ $b }},0.4)">
+    {{ .Title }}
+    </span>
+  </h1>
   {{ .Content }}
+  <section id="tools-list">
+  <table id="taxonomy-table">
+    <thead>
+      <tr>
+        <th>Tool</th>
+        <!-- <th>License</th> -->
+        <th>Description</th>
+        <!-- <th>Developers</th> -->
+      </tr>
+    </thead>
+    <tbody>
       {{ range .Pages }}
-    <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
+        <tr onclick="window.location='{{ .RelPermalink }}'" style="cursor:pointer;">
+          <td class="tool"><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></td>
+          <td class="description">{{ .Content | plainify | truncate 100 }}</td>
+          <!-- <td>
+            {{ $sep := "" }}
+            {{ range $key, $vals := .Params }}
+              {{ if (in (slice "applications") $key) }}
+          {{ $sep }}
+          {{ range $i, $val := $vals }}
+            {{ partial "term-link.html" (dict "name" $val "taxonomy" $key) }}
           {{ end }}
+          {{ $sep = "; " }}
+              {{ end }}
+            {{ end }}
+          </td> -->
+          <!-- <td>
+            {{ $sep := "" }}
+            {{ range $key, $vals := .Params }}
+              {{ if (in (slice "developers") $key) }}
+          {{ $sep }}
+          {{ range $i, $val := $vals }}
+            {{ partial "term-link.html" (dict "name" $val "taxonomy" $key) }}
+          {{ end }}
+          {{ $sep = "; " }}
+              {{ end }}
+            {{ end }}
+          </td> -->
+          <!-- <td>
+            {{ $sep := "" }}
+            {{ range $key, $vals := .Params }}
+              {{ if (in (slice "licenses") $key) }}
+          {{ $sep }}
+          {{ range $i, $val := $vals }}
+            {{ partial "term-link.html" (dict "name" $val "taxonomy" $key) }}
+          {{ end }}
+          {{ $sep = "; " }}
+              {{ end }}
+            {{ end }}
+          </td> -->
+        </tr>
+      {{ end }}
+    </tbody>
+  </table>
 {{ end }}

layouts/tools/page.html

@@ -1,50 +1,44 @@
 {{ define "main" }}
+
+  <div id="page-header">
     <h1>{{ .Title }}</h1>
-
-  {{ $dateMachine := .Date | time.Format "2006-01-02T15:04:05-07:00" }}
-  {{ $dateHuman := .Date | time.Format ":date_long" }}
-  Updated <time datetime="{{ $dateMachine }}">{{ $dateHuman }}</time>
-
+    {{ if .Params.subtitle }}
+      <span class="subtitle">{{ .Params.subtitle }}</span>
+    {{ end }}
     {{ with .Params.links }}
-  <section>
-    <h2>Links</h2>
+    <!-- <section id="quick-links"> -->
+      <!-- <h2>Quick Links</h2> -->
+      <div id="link-list">
         <ul>
           {{ range . }}
-        <li><a href="{{ .url }}" target="_blank" rel="noopener">{{ .title }}</a></li>
+            <li><a href="{{ .url }}" target="_blank" rel="noopener">{{ if .icon }}<i class="{{ .icon }}"></i>&nbsp;&nbsp;{{ end }}{{ .title }}</a></li>
           {{ end }}
         </ul>
-  </section>
+      </div>
+    <!-- </section> -->
     {{ end }}
+  </div>
 
-  {{ with .Params.website }}
-  <p>
-    Website: <a href="{{ . }}" target="_blank" rel="noopener">{{ . }}</a>
-  </p>
-  {{ end }}
 
-  {{ with .Params.github }}
-  <p>
-    <a href="{{ . }}" target="_blank" rel="noopener">View on GitHub</a>
-  </p>
-  {{ end }}
-
-  <section>
+  <section id="taxonomies">
     <h2>At a Glance</h2>
-    <table id="taxonomies">
-      <thead>
-        <tr>
-          <th>Taxonomy</th>
-          <th>Terms</th>
-        </tr>
-      </thead>
+    <table id="taxonomy-table">
       <tbody>
+        {{ $params := .Params }}
         {{ range $taxonomyname, $taxonomy := .Site.Taxonomies }}
-        {{ with $taxonomy }}
+          {{ $terms := index $params $taxonomyname }}
+          {{ if $terms }}
           <tr>
-          <th>{{ $taxonomyname | strings.FirstUpper }}</th>
             <td>
-            {{ range $key, $value := $taxonomy }}
-              {{ partial "term-link.html" (dict "name" $key "taxonomy" $taxonomyname) }}
+              <a 
+              class="taxonomy-name" 
+              href="{{ "/" | relLangURL }}{{ $taxonomyname }}">
+              {{ $taxonomyname | strings.FirstUpper }}
+            </a>
+          </td>
+          <td>
+            {{ range $term := sort $terms }}
+              {{ partial "term-link.html" (dict "name" $term "taxonomy" $taxonomyname) }}
             {{ end }}
           </td>
         </tr>
@@ -54,27 +48,37 @@
     </table>
   </section>
 
+  {{ if .Content }}
   <section>
     <h2>Description</h2>
     {{ .Content }}
   </section>
+  {{ end }}
   
   {{ with .Params.publications}}
-  <section>
+  <section id="publications">
     <h2>Publications</h2>
     <ul>
       {{ range $citation, $pub := site.Data.publications }}
       {{ range $pub }}
       {{ if in $.Params.publications .key }}
       <li>
-        {{ if .year }} <strong>{{ .year }}</strong>: {{ end }}
-        {{ if .title }} <em>{{ .title }}</em> {{ end }}
-        {{ if .author }} <br /> by {{ delimit .author " | " | html }} {{ end }}
-        {{ if .booktitle }} <br />Appears in <em>{{ .booktitle }}</em> {{ end }}
-        {{ if .journal }} <br />Appears in <em>{{ .journal }}</em> {{ end }}
-        {{ if .volume }} <strong>{{ .volume }}</strong> {{ end }}
+        {{ if .title }} <strong>{{ .title }}</strong> {{ end }}
+        {{ if .year }}
+        {{ if .month }}
+          ({{ .month }} {{.year }}) 
+        {{ else }}
+          ({{ .year }}) 
+        {{ end }}
+        {{ end }}
+        {{ if .author }} by {{ index .author 0 }}{{ if (gt (len .author) 1) }} et. al. {{ end }}{{ end }}
+        {{ if .booktitle }}  | Appears in <em>{{ .booktitle }}</em> {{ end }}
         {{ if .pages }} ({{ .pages }}) {{ end }}
-        {{ if .doi }} <br /><a href="https://doi.org/{{ . }}" target="_blank" rel="noopener">DOI: {{ .doi }}</a> {{ end }}
+        {{ if .journal }}  | Appears in <em>{{ .journal }}</em> {{ end }}
+        {{ if .volume }} | Volume {{ .volume }} {{ end }}
+        {{ if .publisher }}  | Published by {{ .publisher }} {{ end }}
+        {{ if .doi }}  | <a href="https://doi.org/{{ .doi }}" target="_blank" rel="noopener">{{ .doi }}</a> 
+        {{ else if .url }}  | <a href="{{ . }}" target="_blank" rel="noopener">{{ .url }}</a> {{ end }}
       </li>
       {{ end }}
       {{ end }}
@@ -83,4 +87,21 @@
   </section>
   {{ end }}
 
+  <div class="time" style="display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;">
+    <div class="footer-links" style="text-align: left;">
+      Help improve this page!<br/>
+      Submit an 
+      <a href="https://gitmoss.fyi/fmtools/content/issues/new?template=.gitea%2fissue_template%2ffix_tool.md&title=[FIX]%20{{ .Title | urlquery }}" target="_blank">issue</a> or 
+      <a href="https://gitmoss.fyi/fmtools/content/fork" target="_blank">pull request</a>.
+    </div>
+    {{ if .Date }}
+    <div class="footer-date" style="text-align: right;">
+      {{ $dateMachine := .Date | time.Format "2006-01-02T15:04:05-07:00" }}
+      {{ $dateHuman := .Date | time.Format "2 January 2006" }}
+      Updated <time datetime="{{ $dateMachine }}">{{ $dateHuman }}</time>
+    </div>
+    {{ end }}
+  </div>
+
+
 {{ end }}

layouts/tools/section.html

@@ -0,0 +1,120 @@
+{{ define "main" }}
+
+  {{ $allPages := slice }}
+  {{ $sections := slice }}
+  {{ range .Pages }}
+    {{ if .IsSection }}
+      {{ $sections = $sections | append . }}
+      {{ range .Pages }}
+        {{ $allPages = $allPages | append . }}
+      {{ end }}
+    {{ else }}
+      {{ $allPages = $allPages | append . }}
+    {{ end }}
+  {{ end }}
+  {{ $sortedSections := sort $sections "LinkTitle" }}
+  {{ $sortedPages := sort $allPages "LinkTitle" }}
+
+  <h1>{{ .Title }}</h1>
+  {{ .Content }}
+  <section id="tools-list">
+  {{ if gt (len $sortedSections) 0 }}
+    <!-- <h2>Sections</h2> -->
+    <!-- <p>This list shows all sections, sorted alphabetically.</p> -->
+    <div id="link-list" style="align-items: left; justify-content: left;">
+      <ul>
+        {{ range $sortedSections }}
+          <li><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></li>
+        {{ end }}
+      </ul>
+    </div>
+  {{ end }}
+
+  {{ if eq (len $sortedPages) 0 }}
+  <div style="display: flex; align-items: center; gap: 8px; margin: 1rem 0;">
+    <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(225, 82, 225);"></span>
+    <span style="color: rgb(225, 82, 225); font-size: 1rem;">No Tools Found</span>
+  </div>
+  {{ end }}
+
+  <table id="taxonomy-table">
+    <thead>
+      <tr>
+        <th>Tool</th>
+        <th>Applications</th>
+        <th>Licenses</th>
+        <!-- <th>Developers</th> -->
+        <!-- <th>Description</th> -->
+      </tr>
+    </thead>
+    <tbody>
+      {{ range $sortedPages }}
+        <tr onclick="window.location='{{ .RelPermalink }}'" style="cursor:pointer;">
+          <td>
+            {{ if .Params.maintenance }}
+              {{ if in .Params.maintenance "Not Maintained" }}
+                <div style="display: flex; align-items: center; gap: 8px;">
+                  <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
+                  <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(128, 28, 28);"></span>
+                </div>
+              {{ else }}
+                <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
+              {{ end }}
+              {{ else }}
+                <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
+              {{ end }}
+          </td>
+          <td>
+            {{ $sep := "" }}
+            {{ range $key, $vals := .Params }}
+              {{ if (in (slice "applications") $key) }}
+                {{ $sep }}
+                {{ range $i, $val := $vals }}
+                  {{ partial "term-link.html" (dict "name" $val "taxonomy" $key) }}
+                {{ end }}
+                {{ $sep = "; " }}
+              {{ end }}
+            {{ end }}
+          </td>
+          <td>
+            {{ $sep := "" }}
+            {{ range $key, $vals := .Params }}
+            {{ if (in (slice "licenses") $key) }}
+            {{ $sep }}
+            {{ range $i, $val := $vals }}
+            {{ partial "term-link.html" (dict "name" $val "taxonomy" $key) }}
+            {{ end }}
+            {{ $sep = "; " }}
+            {{ end }}
+            {{ end }}
+          </td>
+          <!-- <td>
+            {{ $sep := "" }}
+            {{ range $key, $vals := .Params }}
+            {{ if (in (slice "developers") $key) }}
+            {{ $sep }}
+            {{ range $i, $val := $vals }}
+            {{ partial "term-link.html" (dict "name" $val "taxonomy" $key) }}
+            {{ end }}
+            {{ $sep = "; " }}
+            {{ end }}
+            {{ end }}
+          </td> -->
+          <!-- <td class="description">{{ .Content | plainify | truncate 40 }}</td> -->
+        </tr>
+      {{ end }}
+
+    </tbody>
+  </table>
+
+  <div style="display: flex; align-items: center; gap: 8px; margin: 1rem 0 0 0;">
+    <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(128, 28, 28);"></span>
+    <span style="color: rgb(128, 28, 28); font-size: 1rem;">Red dot indicates tool has not been updated or maintained recently</span>
+  </div>
+  <!-- <div style="display: flex; align-items: center; gap: 8px; margin: 0;">
+    <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(143, 96, 15);"></span>
+    <span style="color: rgb(150, 150, 150); font-size: 1rem;">Orange dot indicates closed-source or restrictively licensed tool</span>
+  </div> -->
+
+{{ end }}
+

static/css/solid.css

@@ -0,0 +1,19 @@
+/*!
+ * Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ * Copyright 2024 Fonticons, Inc.
+ */
+:root, :host {
+  --fa-style-family-classic: 'Font Awesome 6 Free';
+  --fa-font-solid: normal 900 1em/1 'Font Awesome 6 Free'; }
+
+@font-face {
+  font-family: 'Font Awesome 6 Free';
+  font-style: normal;
+  font-weight: 900;
+  font-display: block;
+  src: url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.ttf") format("truetype"); }
+
+.fas,
+.fa-solid {
+  font-weight: 900; }

static/webfonts/LICENSE.txt

@@ -0,0 +1,165 @@
+Fonticons, Inc. (https://fontawesome.com)
+
+--------------------------------------------------------------------------------
+
+Font Awesome Free License
+
+Font Awesome Free is free, open source, and GPL friendly. You can use it for
+commercial projects, open source projects, or really almost whatever you want.
+Full Font Awesome Free license: https://fontawesome.com/license/free.
+
+--------------------------------------------------------------------------------
+
+# Icons: CC BY 4.0 License (https://creativecommons.org/licenses/by/4.0/)
+
+The Font Awesome Free download is licensed under a Creative Commons
+Attribution 4.0 International License and applies to all icons packaged
+as SVG and JS file types.
+
+--------------------------------------------------------------------------------
+
+# Fonts: SIL OFL 1.1 License
+
+In the Font Awesome Free download, the SIL OFL license applies to all icons
+packaged as web and desktop font files.
+
+Copyright (c) 2024 Fonticons, Inc. (https://fontawesome.com)
+with Reserved Font Name: "Font Awesome".
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+SIL OPEN FONT LICENSE
+Version 1.1 - 26 February 2007
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting — in part or in whole — any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
+
+--------------------------------------------------------------------------------
+
+# Code: MIT License (https://opensource.org/licenses/MIT)
+
+In the Font Awesome Free download, the MIT license applies to all non-font and
+non-icon files.
+
+Copyright 2024 Fonticons, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in the
+Software without restriction, including without limitation the rights to use, copy,
+modify, merge, publish, distribute, sublicense, and/or sell copies of the Software,
+and to permit persons to whom the Software is furnished to do so, subject to the
+following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
+INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
+PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
+SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+--------------------------------------------------------------------------------
+
+# Attribution
+
+Attribution is required by MIT, SIL OFL, and CC BY licenses. Downloaded Font
+Awesome Free files already contain embedded comments with sufficient
+attribution, so you shouldn't need to do anything additional when using these
+files normally.
+
+We've kept attribution comments terse, so we ask that you do not actively work
+to remove them from files, especially code. They're a great way for folks to
+learn about Font Awesome.
+
+--------------------------------------------------------------------------------
+
+# Brand Icons
+
+All brand icons are trademarks of their respective owners. The use of these
+trademarks does not indicate endorsement of the trademark holder by Font
+Awesome, nor vice versa. **Please do not use brand logos for any purpose except
+to represent the company, product, or service to which they refer.**