From c32f46a7f183347ca784ada242ecbde6b8491361 Mon Sep 17 00:00:00 2001 From: Quantum Date: Mon, 10 Feb 2025 12:17:47 -0500 Subject: [PATCH] Add donation and footer --- index.html | 55 ++++++++++++++++++++++++++++++++++++++++++++++++-- src/index.scss | 35 +++++++++++++++++++++++--------- vite.config.ts | 10 +++++++++ 3 files changed, 88 insertions(+), 12 deletions(-) diff --git a/index.html b/index.html index e3f92fa..cc85e95 100644 --- a/index.html +++ b/index.html @@ -20,7 +20,10 @@ What is this?
  • - About + How to use? +
    • +
  • + Support me
    • @@ -53,7 +56,9 @@

    What this tool can't do:

    @@ -71,10 +76,56 @@

    The generated codes are displayed in chronological order. The current code is shown in large text. The codes above are past codes, and the codes below are future codes.

    +

    The settings are stored in the URL hash. You can bookmark the page or copy the link to go + directly to a certain configuration.

    + + +
    +
    +

    How do I use this tool?

    +

    To start, simply type or paste in the TOTP secret key. This should be in the standard base32 + format. This will generate 6-digit TOTP codes that update every 30 seconds using the SHA-1 algorithm that's used + by default in all major authenticator apps. +

    +

    You can press "show advanced settings" to adjust the TOTP parameters to use non-default + values. +

    +

    The generated codes are displayed in chronological order. The current code is shown in large + text. The codes above are past codes, and the codes below are future codes.

    +

    The settings are stored in the URL hash. You can bookmark the page or copy the link to go + directly to a certain configuration.

    +
    +
    +
    +
    +

    I like this website. How can I support you?

    +

    + For security reasons, this website will NEVER serve ads. Unfortunately, servers and domains are not free, + though I try to be as economical as I can. I would rather lose money running this public service than serve + ads or shut it down, but if you would like to help me offset the costs, feel free to send some money my way + on: +

    +
    + + diff --git a/src/index.scss b/src/index.scss index b7f2dcd..d3c6d12 100644 --- a/src/index.scss +++ b/src/index.scss @@ -20,23 +20,25 @@ @import 'bootstrap/scss/_popover.scss'; @import 'bootstrap/scss/_card.scss'; -nav { +body { + padding-top: $spacer * 4; +} + +nav.navbar { + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 10; background-color: $body-tertiary-bg; } .jumbotron { - margin: 1em 0; - border-radius: 1em; - padding: 1em; + border-radius: $border-radius; + padding: $spacer; background-color: $body-secondary-bg; } -@include media-breakpoint-up(lg) { - .jumbotron { - padding: 1.5em; - } -} - .totp-settings { margin-bottom: 0.5em; } @@ -119,3 +121,16 @@ nav { } } } + +.footer { + margin-top: $spacer; + background: $body-tertiary-bg; + min-height: $spacer * 4; + padding: ($spacer * 4 - $font-size-base) / 2 0; + + .container { + width: 100%; + margin: 0 auto; + padding: 0 1em; + } +} diff --git a/vite.config.ts b/vite.config.ts index f08997c..9bc39e3 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -3,11 +3,21 @@ import react from '@vitejs/plugin-react'; import {nodePolyfills} from 'vite-plugin-node-polyfills'; import svgr from 'vite-plugin-svgr'; +function yearPlugin() { + return { + name: 'year', + transformIndexHtml(html: string): string { + return html.replace('__YEAR__', new Date().getFullYear().toString()); + }, + } as const; +} + // https://vitejs.dev/config/ export default defineConfig({ plugins: [ svgr(), react(), + yearPlugin(), nodePolyfills({ include: ['buffer'], globals: {Buffer: true},