From 0964951354749ae5e628c27cd64a4d0a2c2d1548 Mon Sep 17 00:00:00 2001 From: Julien Calixte Date: Tue, 14 May 2024 18:45:18 +0200 Subject: [PATCH] Add tuto for query strings --- index.css | 17 +++++++++++++---- index.html | 24 +++++++++++++++++++++++- main.ts | 6 +----- 3 files changed, 37 insertions(+), 10 deletions(-) diff --git a/index.css b/index.css index 668ba76..c44fd89 100644 --- a/index.css +++ b/index.css @@ -131,14 +131,23 @@ li { } } -a { +main a { color: var(--color); text-decoration: none; } -a:visited, -a:focus, -a:focus-visible { +main a:visited, +main a:focus, +main a:focus-visible { color: var(--color); text-decoration: none; } + +details.hud { + font-size: 16px; + margin: 1rem; +} + +details.hud li { + text-align: left; +} diff --git a/index.html b/index.html index 38e60ed..de54284 100644 --- a/index.html +++ b/index.html @@ -16,7 +16,7 @@ -
+

Thinking People System

@@ -118,6 +118,28 @@
+
+ Enablers +

+ You can use the following options to interact with the TPS. It works + with the query string. Like so: + https://thinking-people-system.house?size=small. +

+
    +
  • + display: display without any HUD with the option + house-only +
    • +
  • size: can be small
    • +
  • + focus: focus only a part of the TPS. Can be multiple. +
    • +
  • text: hide text to only have the house
    • +
  • scroll: scroll to the end
    • +
+
diff --git a/main.ts b/main.ts index 90bf228..50709d0 100644 --- a/main.ts +++ b/main.ts @@ -1,13 +1,9 @@ -type TPSSearchParams = { - display?: 'house-only' | 'full' -} - const params = new URL(document.location.href).searchParams const display = params.get('display') if (display === 'house-only') { - document.querySelector('header')?.remove() + document.querySelectorAll('.hud')?.forEach((hud) => hud.remove()) } const size = params.get('size')