stilde

Stilde is the template for my personal static Startpage protected by encryption.

The startpage is a lightly modified version of the tilde project by cade.

I use it both locally (localhost) and self-hosted (https), that's why I wanted a way to protect the page that would still stay light, static and bypassable by an action-less URI.

Stilde includes staticrypt for that purpose and provides an authentification form to decrypt the page locally by password or by a secret decryption URI.

---

Features

• Original tilde features:
  • Redirect to a bookmarked website.
  • Run a search on a bookmarked website.
  • Get search suggestions from DuckDuckGo.
  • Redirect to a specific path or uri for a bookmarked website.
  • Access any other url.
  • Lauch a search on a customized DuckDuckGo session for anything outside the scope.
• New: toggle the input field by clicking on the logo (useful for mobile browsers).
• WebCrypto html encryption with password prompt page.
• Direct link decryption by secret hash URI.
• Deployment and re-deployment with a simple build script.
• New: custom logo on both form and startpage.

License

UNLICENCED : like the original tilde project.

Requirements

• npm@lts (I use v18.16.0 with nvm)
• Bash (for the build.sh script)

Installation

• Clone this repo in a parent directory outside of your webroot (the webroot is the destination of the build):

git clone --depth=1 https://git.tkapias.net/tkapias/stilde
cd stilde

Preparation (optional)

• Edit strings in french in build.sh (for the staticrypt form):

  85   │     --template-button "DECRYPTER" \
  86   │     --template-instructions "Crypté avec StatiCrypt." \
  87   │     --template-error "Mot de passe incorrect !" \
  88   │     --template-placeholder "Mot de passe" \
  89   │     --template-remember "Se souvenir de moi" \

• Edit graphical assets in assets/root/ (they will be copied to the destination with the encrypted html):

  • favicon.ico (convert icon-512.png -define icon:auto-resize="48,32,16" favicon.ico)
  • favicon.svg (square logo, width 192px)
  • icon-192.png (generated from favicon.svg)
  • icon-512.png (generated from favicon.svg)
  • logo.svg (trimmed favicon.svg, width 200px)

• Replace the svg logo in the startpage assets/source/index.html:

  • I exported mines from inkscape, cleaned it's code and renamed paths to use them in css and scripts.

 622   │ <div class="box-container">
 623   │ 
 624   │   <svg
 625   │      preserveAspectRatio=true
 656   |      ...

• There are also some css rules for the logo paths:

 607   │   #logo path#characters {
 608   │     fill-opacity: 0.5 !important;
 609   │     transition: fill 2s, fill-opacity 1s;
 610   │   }
 611   │   #logo path#characters:hover {
 612   │     fill: #ff4000 !important;
 613   │     fill-opacity: 0.8 !important;
 614   │     transition: fill 2s, fill-opacity 1s;
 615   │   }
 616   │   #logo path#shadows {
 617   │     fill: #808080;
 618   │     transition: fill 2s;
 619   │   }

• And some javascript too:

 339   │       const shadows = document.querySelector('#logo path#shadows');
 438   │       shadows.style.fill = '#808080'
 465   │       shadows.style.fill = '#ff4000'

Bookmarks & Commands

The real content of the Startpage and define the list of matching websites, search patterns, custom URIs and suggestions.

All of them are included inside the COMMANDS const after line 41 of assets/source/index.html.

I left enough examples to understand the syntax.

Build

Just execute build.sh with its help:

Generate static website with encrypted code by staticrypt.
The first pass requires -t, -d and -u options, re-run it with -c option only.

Syntax: ./build.sh [-h] [Options...]

options:
  -h                     Print this Help
  -c                     Fetch options from ".staticrypt.conf"
  -d "<path>"            Desination webroot path or directory
  -p "<password>"        Password for decryption >= 12 characters
  -s "<salt>"            Salt string = 32 hexadecimal characters
  -t "<string>"          Title for the staticrypt form page
  -u "<url>"             Https or localhost Url for the destination root

Example: ./build.sh -u https://start.domain.tld -d static -t "STILDE - StartPage"

Basic Usage

• Open a website:
  type the corresponding key and press return, or click on the link.

• Open a specific path on a website:
  type the path after the site’s key and press return.

• Run a search on a website:
  type a space after the website’s key followed by your query and press return.

• Perform a search with DuckDuckGo:
  input any string that doesn't match a key and press return.

• suggestions may be displayed under your input, they are specific to a key or construicted from DuckDuckGo background queries. Use press up/down/return or click to use them.

• On mobile devices you can open/close the input and you keyboard by a touch on the logo.

---