kogakure/website-astro-stefanimhoff.de
1
0
Fork 0
mirror of https://github.com/kogakure/website-astro-stefanimhoff.de.git synced 2026-02-03 20:15:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(a11y): accessibility issues

Browse Source
This commit is contained in:
Stefan Imhoff
2023-06-14 18:59:32 +02:00
parent 423829ceb0
commit e83d6ec974
20 changed files with 108 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/JournalList.astro
View File

@@ -51,7 +51,9 @@ const { entries } = Astro.props;
)}
</div>
<div class="absolute z-20 flex h-full w-full flex-col items-center justify-center p-10 text-center leading-tight text-white">
<Subsubheadline class="!m-0 leading-tight">{data.title}</Subsubheadline>
<Subsubheadline as="h3" class="!m-0 leading-tight">
{data.title}
</Subsubheadline>
</div>
</Link>
</li>

6
src/components/RSSLink.astro
View File

@@ -4,8 +4,8 @@ import { Sprite } from 'astro-icon';
import { Link, Subsubheadline } from '.';
---
<div class="grow mbe-5 sm:mbe-0">
<Subsubheadline>Stay up to date.</Subsubheadline>
<aside class="grow mbe-5 sm:mbe-0">
<Subsubheadline as="h2">Stay up to date.</Subsubheadline>
<p>
<Sprite name="ri:rss-fill" class="inline h-icon w-icon" />
<Link
@@ -16,4 +16,4 @@ import { Link, Subsubheadline } from '.';
Subscribe via RSS
</Link>
</p>
</div>
</aside>

2
src/components/Tag.tsx
View File

@@ -21,7 +21,7 @@ export const Tag: FunctionalComponent<Props> = ({
const classes = cx(
'capitalize border-3 relative inline-flex items-center justify-center rounded-25 border-2 border-shibui-350 bg-shibui-200 px-3 py-1 text-1 font-normal leading-none text-black mie-1 pbs-3 dark:border-shibui-750 dark:bg-shibui-950 dark:text-white min-w-[50px] print:hidden',
{
'!bg-shibui-500 !text-white hover:!bg-shibui-700 focus:!bg-shibui-700 dark:!border-shibui-500 dark:!bg-shibui-700 hover:dark:!bg-shibui-400 focus:dark:!bg-shibui-400':
'!bg-shibui-550 !text-white hover:!bg-shibui-650 focus:!bg-shibui-650 dark:!border-shibui-500 dark:!bg-shibui-700 dark:hover:!bg-shibui-600 dark:focus:!bg-shibui-600':
href,
'active [&.active]:!border-black/25 !text-white [&.active]:!bg-accent': active,
},

2
src/content/journal/2007/gtd.mdx
View File

@@ -14,7 +14,7 @@ For one and a half years I use now the principles of _GTD_ (<em>Getting Things D
In his book _<AffiliateLink asin="0143126563" text="Getting Things Done: The Art of Stress-Free Productivity" />_, David Allen introduces an interesting system that allows you to do your tasks efficiently.
<Bookshelf>
<AmazonBook asin="0143126563" />
<AmazonBook asin="0143126563" alt="Getting Things Done: The Art of Stress-Free Productivity" />
</Bookshelf>
In any case, I think that one _gets_ the everyday madness governed by Allen’s system.

4
src/content/journal/2007/japanese-colors.mdx
View File

@@ -12,8 +12,8 @@ During a visit to the art exhibition _Japan and the West_ in the [Art Museum Wol
In the museum shop, I bought the book _<AffiliateLink asin="4894445786" text="The Traditional Colors of Japan" />_ which is in Japanese. In addition to a full-color palette of 250 colors, it contains an exact indication of RGB, CMYK, and other information.
<Bookshelf>
<AmazonBook asin="4894445786" />
<AmazonBook asin="475624114X" />
<AmazonBook asin="4894445786" alt="The Traditional Colors of Japan" />
<AmazonBook asin="475624114X" alt="Traditional Japanese Color Palette" />
</Bookshelf>
Each page of the book shows three colors that are always juxtaposed with one or more stunning photos. The photos show the traditional use of colors in kimonos, samurai armor, monk clothing, or nature.

7
src/content/journal/2007/koi-design.mdx
View File

@@ -21,8 +21,11 @@ These works of art are painful (dozens of bamboo needles are [stung several time
One of the best living artists of the Irezumi is Horiyoshi III, whose works can be seen in many illustrated books: <AffiliateLink asin="9074822452" text="Tattoos from the Floating World: Ukiyo-e Motif’s in Japanese Tattoo" /> and <AffiliateLink asin="0764312014" text="Bushido: Legacies of the Japanese Tattoo" />.
<Bookshelf>
<AmazonBook asin="9074822452" />
<AmazonBook asin="0764312014" />
<AmazonBook
asin="9074822452"
alt="Tattoos from the Floating World: Ukiyo-e Motifs in the Japanese Tattoo"
/>
<AmazonBook asin="0764312014" alt="Bushido" />
</Bookshelf>
Irezumi does not at random tattoo things on the body, the images have a profound meaning to the wearer and require expertise in religion, history, and myths from China and Japan. That is the reason bad copies and pseudo-Japanese tattoos are offered in Western tattoo studios. These tattooists lack this background knowledge.

7
src/content/journal/2010/rework.mdx
View File

@@ -15,8 +15,11 @@ Today, I recommend a book that I finished recently and read a second time: _Rewo
I have long been a great believer in the philosophy of simplicity which is cultivated by 37signals successfully. Their first (free) book [Getting Real](https://basecamp.com/books/getting-real) (as <AffiliateLink asin="0578012812" text="paperback version" />) I read with great interest.
<Bookshelf>
<AmazonBook asin="0307463745" />
<AmazonBook asin="0578012812" />
<AmazonBook asin="0307463745" alt="Rework" />
<AmazonBook
asin="0578012812"
alt="Getting Real: The smarter, faster, easier way to build a successful web application"
/>
</Bookshelf>
But with _Rework_ they have achieved a true masterpiece. Not without reason, it is a bestseller in the US and the UK. Critics and CEOs praise the book in the highest terms (Seth Godin, John Maeda, Chris Anderson, and others).

2
src/content/journal/2011/decodeunicode.mdx
View File

@@ -33,5 +33,5 @@ On the [official website](http://www.decodeunicode.org/) you can find a digital
- **Price**: €68.00
<Bookshelf>
<AmazonBook asin="3874398137" />
<AmazonBook asin="3874398137" alt="Decodeunicode: Die Schriftzeichen der Welt" />
</Bookshelf>

19
src/content/journal/2014/john-seymour-books.mdx
View File

@@ -14,9 +14,24 @@ My earliest memories of books are that I lie on my parents’ soft carpet on my
Born in England in 1914, he went to boarding school in Switzerland and later began studying agricultural sciences. He went to Africa at the age of 20 to work as a farmer. After serving in World War II in North Africa and Asia, he returned to England and moved to an old remote farm with his family in 1957 and started living solely on home-grown produce. After moving to a farm in Wales in the 1970s, he wrote his world-famous books <cite>The Complete Book of Self-Sufficiency</cite> (<cite lang="de"><AffiliateLink asin="3831015775" text="Das große Buch vom Leben auf dem Lande" /></cite>) and <cite>The Self-Sufficient Gardener</cite> (<cite lang="de"><AffiliateLink asin="3783161452" text="Selbstversorgung aus dem Garten" /></cite>).
### English
<Bookshelf>
<AmazonBook asin="3831015775" />
<AmazonBook asin="3783161452" />
<AmazonBook
asin="0241352460"
alt="The The New Complete Book of Self-Sufficiency: The Classic Guide for Realists and Dreamers"
/>
<AmazonBook asin="1409346781" alt="New Self-Sufficient Gardener" />
</Bookshelf>
### German
<Bookshelf>
<AmazonBook asin="3831015775" alt="Das neue Buch vom Leben auf dem Lande" />
<AmazonBook
asin="3783161452"
alt="Selbstversorgung aus dem Garten: Wie man seinen Garten natürlich bestellt und gesunde Nahrung erntet"
/>
</Bookshelf>
## The Books

2
src/content/journal/2014/website-typography.mdx
View File

@@ -18,7 +18,7 @@ The right choice of font, font size, weight, layout, sentence width, lead, lette
I’ve always found typography fascinating, but after reading the book <cite><AffiliateLink asin="0881792128" text="The Elements of Typographic Style" /></cite> by _Robert Bringhurst_ I studied the matter more deeply. There is a Web-adapted version of his book on the website [The Elements _of_ Typographic Style Applied _to the_ Web](http://webtypography.net/).
<Bookshelf>
<AmazonBook asin="0881792128" />
<AmazonBook asin="0881792128" alt="The Elements of Typographic Style" />
</Bookshelf>
## Typography

6
src/content/journal/2017/minimalism.mdx
View File

@@ -45,7 +45,7 @@ Minimalism is sometimes defined as _Simple Living_. Simplicity will inevitably b
As Kenya Hara writes in <cite><AffiliateLink asin="0714866962" text="Wa: The Essence of Japanese Design" /></cite>, the origin of Simplicity can be found in the European _modernism_ as a result of the society getting free of sole rulers (who were defined by objects of decoration and excess of material objects). Rationality was the basis of this concept, resulting in _Bauhaus_ in 1909 and the founding of _Domus_ in 1928.
<Bookshelf>
<AmazonBook asin="0714866962" />
<AmazonBook asin="0714866962" alt="WA: The Essence of Japanese Design" />
</Bookshelf>
The Japanese Simplicity is described as _Emptiness_ by Kenya Hara and has a complex background: Japan was positioned at the end of many routes of cultural influence. From Rome along the Silk Road to Central Asia, China, Korea, and south from Turkey over India, South Asia, and north along with Russia. But after a civil war from 1467-1477 (_ōnin no ran_), which destroyed countless objects of art (temples, statues, paintings, and kimonos), may be out of necessity, a new form of simple and quiet design emerged.
@@ -63,7 +63,7 @@ That’s why I think extreme forms of Minimalism can result in less freedom. If
I was always a Minimalist, even when the term didn’t exist. My first contact with the idea was in high school, where we had to read <cite><AffiliateLink asin="178093680X" text="To Have or to Be?" /></cite> by Erich Fromm.
<Bookshelf>
<AmazonBook asin="178093680X" />
<AmazonBook asin="178093680X" alt="To Have or To Be?" />
</Bookshelf>
The next thing which influenced me was the book and movie [Fight Club](http://www.imdb.com/title/tt0137523/). It’s filled with quotes against consumerism, capitalism, and property. It has countless Anarchist ideas, which is the main reason it was rated PG18.
@@ -77,7 +77,7 @@ The next thing which influenced me was the book and movie [Fight Club](http://ww
The next step was reading David Allen's book <cite><AffiliateLink asin="0143126563" text="Getting Things Done (GTD)" /></cite>, which is a productivity system, but at the beginning of the process is the inventory of your things.
<Bookshelf>
<AmazonBook asin="0143126563" />
<AmazonBook asin="0143126563" alt="Getting Things Done: The Art of Stress-Free Productivity" />
</Bookshelf>
This way I got rid of many things for the first time.

5
src/content/journal/2018/morning-routine.mdx
View File

@@ -56,7 +56,10 @@ I have a [Traveler’s Notebook Passport Size](https://www.travelers-company.com
I start by reading the daily chapter of the fantastic book <cite><AffiliateLink asin="1781257655" text="The Daily Stoic" /></cite>. The Stoic practice is the best start to a day you can have. Thereafter, I read 1-2 books, not novels, but harder topics (philosophy, science, or psychology). If I want to remember a quote or part of a book, I mark it and extract it later into my Commonplace book or write it down in my pocket-size notebook.
<Bookshelf>
<AmazonBook asin="1781257655" />
<AmazonBook
asin="1781257655"
alt="The Daily Stoic: 366 Meditations on Wisdom, Perseverance, and the Art of Living: Featuring new translations of Seneca, Epictetus, and Marcus Aurelius"
/>
</Bookshelf>
### Get Up

60
src/content/journal/2021/how-to-prepare-for-the-worst-case.mdx
View File

@@ -199,17 +199,23 @@ My favorite books on the topic of self-sufficiency are the books of John Seymour
### English
<Bookshelf>
<AmazonBook asin="0241352460" />
<AmazonBook asin="1409346781" />
<AmazonBook asin="0751327824" />
<AmazonBook
asin="0241352460"
alt="The The New Complete Book of Self-Sufficiency: The Classic Guide for Realists and Dreamers"
/>
<AmazonBook asin="1409346781" alt="New Self-Sufficient Gardener" />
<AmazonBook asin="0751327824" alt="Forgotten Arts & Crafts" />
</Bookshelf>
### German
<Bookshelf>
<AmazonBook asin="3831015775" />
<AmazonBook asin="3783161452" />
<AmazonBook asin="3783162033" />
<AmazonBook asin="3831015775" alt="Das neue Buch vom Leben auf dem Lande" />
<AmazonBook
asin="3783161452"
alt="Selbstversorgung aus dem Garten: Wie man seinen Garten natürlich bestellt und gesunde Nahrung erntet"
/>
<AmazonBook asin="3783162033" alt="Vergessene Künste: Bilder vom alten Handwerk" />
</Bookshelf>
Another fantastic book is [The Book](https://www.indiegogo.com/projects/the-book--28/x/26186498/), a project I supported on Indiegogo. It’s a 400-page illustrated guide on how to rebuild civilization.
@@ -221,20 +227,44 @@ The Bushcraft series is a series of useful books about survival: <AffiliateLink
### English
<Bookshelf>
<AmazonBook asin="B00MIMHPII" />
<AmazonBook asin="B01N4SB7FE" />
<AmazonBook asin="1440598525" />
<AmazonBook asin="B0108VCQV6" />
<AmazonBook asin="1507209029" />
<AmazonBook
asin="B00MIMHPII"
alt="Bushcraft 101: A Field Guide to the Art of Wilderness Survival"
/>
<AmazonBook
asin="B01N4SB7FE"
alt="Bushcraft First Aid: A Field Guide to Wilderness Emergency Care"
/>
<AmazonBook
asin="1440598525"
alt="The Bushcraft Field Guide to Trapping, Gathering, and Cooking in the Wild"
/>
<AmazonBook
asin="B0108VCQV6"
alt="Advanced Bushcraft: An Expert Field Guide to the Art of Wilderness Survival"
/>
<AmazonBook asin="1507209029" alt="Bushcraft Illustrated: A Visual Guide" />
</Bookshelf>
### German
<Bookshelf>
<AmazonBook asin="3730604406" />
<AmazonBook asin="3730608851" />
<AmazonBook asin="3730608231" />
<AmazonBook asin="3730605046" />
<AmazonBook
asin="3730604406"
alt="Bushcraft 101 - Überleben in der Wildnis / Der ultimative Survival Praxisführer: Überlebenstechniken, Extremsituationen, Outdoor"
/>
<AmazonBook
asin="3730608851"
alt="Bushcraft Erste Hilfe. Notfallversorgung in der Wildnis - schnell und einfach: Der ultimative Praxisführer - Überlebenstechniken, Survival, Outdoor"
/>
<AmazonBook
asin="3730608231"
alt="Bushcraft. Jagen, Sammeln, Kochen in der Wildnis: Der ultimative Praxisführer - Überlebenstechniken, Survival, Outdoor"
/>
<AmazonBook
asin="3730605046"
alt="Advanced Bushcraft. Überleben in der Wildnis: Der ultimative Praxisführer für Fortgeschrittene: Survival, Outdoor, Extremsituationen meistern"
/>
</Bookshelf>
## Conclusion

2
src/content/journal/2021/learning-poems.mdx
View File

@@ -14,7 +14,7 @@ The poem is an echo from 100 years ago. Full of wisdom and a mirror held up to o
And then I started learning the poem. First for fun, and I wasn’t sure I would be able to remember it because it’s long (10 stanzas with four lines). I was surprised and impressed when I was able to remember it after two weeks in its entirety.
<Bookshelf>
<AmazonBook asin="0307267113" />
<AmazonBook asin="0307267113" alt="Kipling: Poems: Edited by Peter Washington" />
</Bookshelf>
I used a simple spaced-repetition method to remember it. There are countless apps like [Anki](https://apps.ankiweb.net/) that use this method. I used an app called [NeuraCache](https://neuracache.com/) which can import the cards from Markdown. And recently, I found a [Flashcard-Based and Note-Based Spaced Repetition Plugin](https://github.com/st3v3nmw/obsidian-spaced-repetition) for [Obsidian](https://obsidian.md/), the note-taking app of my choice.

5
src/content/journal/2021/processing-information-into-notes.mdx
View File

@@ -102,7 +102,10 @@ One browser extension I use to write notes on exciting videos is [YiNote](https:
The most important part of note-taking is connecting ideas. Sönke Ahrens, the author of <AffiliateLink asin="1542866502" text="How to Take Smart Notes" />, explains the science of why this method works. I recommend reading this fantastic book; it is useful for anybody who wants to write notes.
<Bookshelf>
<AmazonBook asin="1542866502" />
<AmazonBook
asin="1542866502"
alt="How to Take Smart Notes: One Simple Technique to Boost Writing, Learning and Thinking – for Students, Academics and Nonfiction Book Writers"
/>
</Bookshelf>
There is an [interesting interview with him on YouTube](https://youtu.be/kXnR7qX3BDc) if you wish to avoid investing the time and money for the book.

7
src/content/journal/2023/shokunin.mdx
View File

@@ -150,8 +150,11 @@ Since I first saw Japanese tattoos in a Yakuza movie, I've been obsessed with th
One of the most renowned tattoo artists is Horiyoshi III, Japans undisputed tattoo master. The tattoo motives are not random, but symbolize religious or mythic stories and have a long history. The art form was submitted over many generations of tattoo masters.
<Bookshelf>
<AmazonBook asin="9074822452" />
<AmazonBook asin="0764312014" />
<AmazonBook
asin="9074822452"
alt="Tattoos from the Floating World: Ukiyo-e Motifs in the Japanese Tattoo"
/>
<AmazonBook asin="0764312014" alt="Bushido" />
</Bookshelf>
### The Reluctant Master

1
src/pages/[...slug].astro
View File

@@ -96,6 +96,7 @@ const schema = JSON.stringify({
breakpoints={[500, 1000, 1500]}
class="col-span-full aspect-video h-auto !mbe-0 print:hidden xl:col-start-1 xl:col-end-14 3xl:col-end-13 [&_img]:!w-full [&_img]:!max-w-none [&_picture]:!w-full [&_picture]:!max-w-none"
format={['avif']}
loading="eager"
src={entry.data.cover}
/>
)