From a7d45015a19bd64b7ca0798d2c84fb9f28ac78b3 Mon Sep 17 00:00:00 2001 From: Gijs Date: Sun, 6 Jun 2021 13:48:47 +0200 Subject: [PATCH] Mobile styles --- templates/index.html | 41 ++++++++++++++++++++++++++++++++++++----- 1 file changed, 36 insertions(+), 5 deletions(-) diff --git a/templates/index.html b/templates/index.html index 4cdbc21..d85271a 100644 --- a/templates/index.html +++ b/templates/index.html @@ -9,24 +9,31 @@ body { display: grid; grid-template-columns: 1fr 1fr; + grid-template-rows: min-content 1fr min-content; margin: 0; padding: 0; height: 100vh; font-family: Arial, Helvetica, sans-serif; font-size: 12pt; line-height: 18pt; + padding: 16pt; + box-sizing: border-box; } main { grid-column: 1; overflow-y: auto; - padding: 32pt 32pt 32pt 16pt; + padding-right: 48pt; } aside { grid-column: 2; overflow-y: auto; - padding: 32pt 16pt; + } + + h1 { + grid-row: 1; + grid-column: 1 / 3; } [data-message] { @@ -41,15 +48,36 @@ display: block; } - button { + button, input { font: inherit; } + + footer { + grid-row: 3; + grid-column: 1 / 3; + font-size: 85%; + } + + @media screen and (max-width: 600px) { + body { + display: block; + } + + main { + padding-right: 16pt; + } + + footer { + margin-top: 32pt; + padding-bottom: 16pt; + } + } +

Grafted trees

-

Grafted trees

‘Grafted trees’ takes quotes about trees from existing works. Each graft is defined by its gardener, who is present with a short biography scraped from Wikipedia. The reader chooses the amount of seasons the graft will grow. A random noun is picked and defined as a 'bud' from which a new branch grows by replacing the word by its definition. The algorithm is inspired by Oulipo's constraint of 'Littérature définitionnelle', invented by Marcel Bénabou in 1966: in a given phrase, one replaces every significant element (noun, adjective, verb, adverb) by one of its definitions in a given dictionary; one reiterates the operation on the newly received phrase, and again.

@@ -57,7 +85,7 @@ +