Ark/leporello-js
1
0
Fork 0
mirror of https://github.com/leporello-js/leporello-js synced 2026-01-13 13:04:30 -08:00
Code Issues Packages Projects Releases Wiki Activity

deploy: leporello-js/app@ec57fdc389

Browse Source
This commit is contained in:
dmitry-vsl
2025-11-17 02:23:28 +00:00
parent e9edd9ff6c
commit 4911549095
3 changed files with 261 additions and 240 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
docs/examples/todos-preact/index.js
View File

@@ -9,13 +9,6 @@ import * as React from "preact/compat"
// Global application state // Global application state
let state let state
// Preserve state (list of TODOs) when editing code
if (globalThis.leporello) {
// Retrieve initial state from Leporello storage
// See: https://github.com/leporello-js/leporello-js?tab=readme-ov-file#saving-state-between-page-reloads
state = globalThis.leporello.storage.get("state")
}
/* /*
Application logic is structured as pure functions with the signature `(state, ...args) => state`. Application logic is structured as pure functions with the signature `(state, ...args) => state`.
This helper function wraps such a function so that its result updates the global state This helper function wraps such a function so that its result updates the global state
@@ -25,10 +18,6 @@ const handler =
fn => fn =>
(...args) => { (...args) => {
state = fn(state, ...args) state = fn(state, ...args)
if (globalThis.leporello) {
// Persist state to Leporello storage to restore it after page reloads
globalThis.leporello.storage.set("state", state)
}
render() render()
} }

448
src/launch.js
View File

File diff suppressed because one or more lines are too long

42
styles.css
View File

@@ -291,6 +291,7 @@ dialog {
.files .file { .files .file {
margin-left: 1em; margin-left: 1em;
cursor: pointer;
} }
.files > .file { .files > .file {
@@ -533,8 +534,9 @@ dialog {
.open_app_window_button { .open_app_window_button {
position: relative; position: relative;
} }
.open_app_window_tooltip { .onboarding_tooltip {
padding: 1em; padding: 1em;
min-width: 10em;
position: absolute; position: absolute;
margin-bottom: 20px; margin-bottom: 20px;
bottom: 100%; bottom: 100%;
@@ -542,13 +544,14 @@ dialog {
font-size: 1.7em; font-size: 1.7em;
background-color: rgb(120 206 247); background-color: rgb(120 206 247);
border-radius: 21px; border-radius: 21px;
transform: scale(0); left: 50%;
transform: translate(-50%) scale(0);
transition: transform 0.3s; transition: transform 0.3s;
} }
.open_app_window_tooltip.on { .onboarding_tooltip.on {
transform: scale(1); transform: translate(-50%) scale(1);
} }
.open_app_window_tooltip:after { .onboarding_tooltip:after {
content: ''; content: '';
width: 0; width: 0;
height: 0; height: 0;
@@ -579,6 +582,35 @@ dialog {
color: linktext; color: linktext;
} }
.inspect_jsx {
position: relative;
cursor: pointer;
user-select: none;
display: flex;
align-self: stretch;
flex-direction: row;
flex: 0;
align-items: center;
padding: 0em 0.5em;
input {
display: none;
}
&:hover {
background-color: rgb(0, 0, 0, 0.1);
}
&:has(input:checked) {
background-color: #0000ee14;
color: linktext;
}
.onboarding_tooltip {
font-size: 1em;
}
}
.statusbar_button, .upload_button { .statusbar_button, .upload_button {
border: none; border: none;
color: white; color: white;