Add date

Fix license bug
Homepage improvements
2025-06-13 15:13:04 -06:00 · 2025-06-13 15:05:19 -06:00 · 2025-06-13 14:50:10 -06:00 · 2025-06-13 14:27:32 -06:00 · 2025-06-13 13:08:43 -06:00
10 changed files with 171 additions and 33 deletions
--- a/assets/sass/_layout.sass
+++ b/assets/sass/_layout.sass
@@ -4,6 +4,7 @@
 $spacing-unit: 1.5rem
 $section-spacing: 2rem
 $border-radius: 8px
+$body-width: 1024px

 html
    background: darken($background, 3%)
@@ -15,7 +16,7 @@ body
    font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif
    width: 100%
    height: 100%
-    max-width: 1024px
+    max-width: $body-width
    margin: $spacing-unit auto
    padding: $spacing-unit
    box-sizing: border-box
@@ -127,12 +128,29 @@ section
    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: $spacing-unit
-    margin: $spacing-unit 0
-    position: relative
+    padding: 1rem 1.5rem
+    // margin: $spacing-unit 0
+    // position: relative
    transition: background 0.5s ease-in-out
    &:hover, &:focus
        background: $primary-dark
@@ -190,3 +208,57 @@ pre
    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
--- a/layouts/_markup/render-link.html
+++ b/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>
--- a/layouts/_partials/banner.html
+++ b/layouts/_partials/banner.html
@@ -0,0 +1,5 @@
+<div class="banner">
+    <span class="banner-text">{{ .Site.Params.bannerTitle }}
+    {{ .Site.Params.banner | markdownify }}
+    </span>
+</div>
--- a/layouts/_partials/footer.html
+++ b/layouts/_partials/footer.html
@@ -1,3 +1,4 @@
 <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>
--- a/layouts/_partials/styles.html
+++ b/layouts/_partials/styles.html
@@ -6,3 +6,21 @@
  <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">
--- a/layouts/baseof.html
+++ b/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>
--- a/layouts/home.html
+++ b/layouts/home.html
@@ -15,6 +15,7 @@
  <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>
@@ -23,9 +24,28 @@
            <span class="subtitle">{{ .Params.subtitle }}</span>
          {{ end }}
        </h3>
-        <p>{{ .Content | plainify | truncate 125 }}</p>
+        <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 }}
--- a/layouts/page.html
+++ b/layouts/page.html
@@ -23,10 +23,20 @@
  {{ .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 }}
-  {{ $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>
+  <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 }}
--- a/layouts/tools/page.html
+++ b/layouts/tools/page.html
@@ -37,7 +37,7 @@
            </a>
          </td>
          <td>
-            {{ range $term := $terms }}
+            {{ range $term := sort $terms }}
              {{ partial "term-link.html" (dict "name" $term "taxonomy" $taxonomyname) }}
            {{ end }}
          </td>
@@ -91,8 +91,8 @@
    <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 }}">issue</a> or 
-      <a href="https://gitmoss.fyi/fmtools/content/fork">pull request</a>.
+      <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;">
--- a/layouts/tools/section.html
+++ b/layouts/tools/section.html
@@ -42,8 +42,9 @@
      <tr>
        <th>Tool</th>
        <th>Applications</th>
-        <th>License</th>
+        <th>Licenses</th>
        <!-- <th>Developers</th> -->
+        <!-- <th>Description</th> -->
      </tr>
    </thead>
    <tbody>
@@ -54,12 +55,14 @@
              {{ 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(10,10,10); border: 1px solid rgb(80, 80, 80);"></span>
+                  <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 }}
-            {{ end }}
+              {{ else }}
+                <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
+              {{ end }}
          </td>
          <td>
            {{ $sep := "" }}
@@ -76,37 +79,42 @@
          <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 }}
+            {{ 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 }}
+            {{ 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: .5rem 0;">
-    <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(0,0,0); border: 1px solid rgb(80, 80, 80);"></span>
-    <span style="color: rgb(150, 150, 150); font-size: 1rem;">Black dot indicates tool has not been maintained recently</span>
+  <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 }}
Author	SHA1	Message	Date
Landon Taylor	8a862c65e6	Add date	2025-06-13 15:13:04 -06:00
Landon Taylor	fb9f237845	Fix license bug	2025-06-13 15:05:19 -06:00
Landon Taylor	0b36579a36	Homepage improvements	2025-06-13 14:50:10 -06:00
Landon Taylor	6067707b74	favicon	2025-06-13 14:27:32 -06:00
Landon Taylor	09a787272b	aesthetic updates and banner	2025-06-13 13:08:43 -06:00
				`@@ -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>`