Update project description and favicon

This commit is contained in:
thiloho
2023-05-18 23:09:41 +02:00
parent a1c12866ae
commit 651cc75c7f
4 changed files with 54 additions and 16 deletions

View File

@@ -1,3 +1,25 @@
# aurora # aurora
Minimal blog theme built with Astro, mainly focused on accessibility and usability. ## About
aurora is a minimal blog theme built with Astro, Svelte and plain CSS. It is focused on accessibility and usability.
All the interactiveness of the website is packed into three dropdowns that are located at the right of the top navigation bar. Every menu can be opened with a simple keyboard shortcut:
- Table of **c**ontents: **Shift + c**
- **S**earch for an article: **Shift + s**
- **T**heme toggle: **Shift + t**
The styles are simple, there are small improvements for some elements to keep everything consistent and responsive.
### Table of contents
Secondary headings (`<h2>`) are listed here, so each page is easy to navigate.
### Search
I wrote a simple algorithm for the search, and the matching works well. You can write the blog title words in any order, leave letters out, have multiple spaces between words, and more.
### Theme toggle
There are three websites themes: Light, Dark and System (inherits the theme of your browser or operating system).

View File

@@ -1,10 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 128 128"> <svg id="emoji" viewBox="0 0 72 72" xmlns="http://www.w3.org/2000/svg">
<path d="M50.4 78.5a75.1 75.1 0 0 0-28.5 6.9l24.2-65.7c.7-2 1.9-3.2 3.4-3.2h29c1.5 0 2.7 1.2 3.4 3.2l24.2 65.7s-11.6-7-28.5-7L67 45.5c-.4-1.7-1.6-2.8-2.9-2.8-1.3 0-2.5 1.1-2.9 2.7L50.4 78.5Zm-1.1 28.2Zm-4.2-20.2c-2 6.6-.6 15.8 4.2 20.2a17.5 17.5 0 0 1 .2-.7 5.5 5.5 0 0 1 5.7-4.5c2.8.1 4.3 1.5 4.7 4.7.2 1.1.2 2.3.2 3.5v.4c0 2.7.7 5.2 2.2 7.4a13 13 0 0 0 5.7 4.9v-.3l-.2-.3c-1.8-5.6-.5-9.5 4.4-12.8l1.5-1a73 73 0 0 0 3.2-2.2 16 16 0 0 0 6.8-11.4c.3-2 .1-4-.6-6l-.8.6-1.6 1a37 37 0 0 1-22.4 2.7c-5-.7-9.7-2-13.2-6.2Z" /> <g id="color">
<path fill="#92D3F5" d="M35.024 8.2613C35.6281 7.9129 36.3718 7.9129 36.9759 8.2613L59.5344 21.286C60.1385 21.6344 60.5103 22.2785 60.5103 22.9763V49.0237C60.5103 49.7215 60.1385 50.3656 59.5344 50.714L36.9759 63.7387C36.3718 64.0871 35.6281 64.0871 35.024 63.7387L12.4655 50.714C11.8615 50.3656 11.4896 49.7215 11.4896 49.0237V22.9763C11.4896 22.2785 11.8615 21.6344 12.4655 21.286L35.024 8.2613Z"/>
</g>
<g id="line">
<path fill="none" stroke="#000" stroke-width="2" d="M35.024 8.2613C35.6281 7.9129 36.3718 7.9129 36.9759 8.2613L59.5344 21.286C60.1385 21.6344 60.5103 22.2785 60.5103 22.9763V49.0237C60.5103 49.7215 60.1385 50.3656 59.5344 50.714L36.9759 63.7387C36.3718 64.0871 35.6281 64.0871 35.024 63.7387L12.4655 50.714C11.8615 50.3656 11.4896 49.7215 11.4896 49.0237V22.9763C11.4896 22.2785 11.8615 21.6344 12.4655 21.286L35.024 8.2613Z"/>
</g>
</svg> </svg>
<style>
path { fill: #000; }
@media (prefers-color-scheme: dark) {
path { fill: #FFF; }
}
</style>

Before

Width:  |  Height:  |  Size: 724 B

After

Width:  |  Height:  |  Size: 964 B

View File

@@ -5,7 +5,9 @@ import ThemeToggle from "../components/ThemeToggle.svelte";
<nav> <nav>
<div class="container"> <div class="container">
<a href="/"> Logo</a> <a href="/">
<img src="/favicon.svg" width="32" height="32" alt="Logo" />
</a>
<slot /> <slot />
<ArticleSearchWrapper /> <ArticleSearchWrapper />
<ThemeToggle client:only="svelte" /> <ThemeToggle client:only="svelte" />

View File

@@ -1,14 +1,30 @@
--- ---
title: "Home" title: "aurora"
description: "Welcome to my personal blog where I write about a wide variety of topics" description: "Minimalistic blog theme built with Astro, focused on accessibility and usability."
--- ---
## About ## About
May indulgence difficulty ham can put especially. Bringing remember for supplied her why was confined. Middleton principle did she procuring extensive believing add. Weather adapted prepare oh is calling. aurora is a minimal blog theme built with Astro, Svelte and plain CSS. It is focused on accessibility and usability.
These wrong of he which there smile to my front. He fruit oh enjoy it of whose table. Cultivated occasional old her unpleasing unpleasant. At as do be against pasture covered viewing started. Enjoyed me settled mr respect no spirits civilly. All the interactiveness of the website is packed into three dropdowns that are located at the right of the top navigation bar. Every menu can be opened with a simple keyboard shortcut:
Alteration literature to or an sympathize mr imprudence. Of is ferrars subject as enjoyed or tedious cottage. Procuring as in resembled by in agreeable. Next long no gave mr eyes. Admiration advantages no he celebrated so pianoforte unreserved. Not its herself forming charmed amiable. Him why feebly expect future now. - Table of **c**ontents: **Shift + c**
- **S**earch for an article: **Shift + s**
- **T**heme toggle: **Shift + t**
The styles are simple, there are small improvements for some elements to keep everything consistent and responsive.
### Table of contents
Secondary headings (`<h2>`) are listed here, so each page is easy to navigate.
### Search
I wrote a simple algorithm for the search, and the matching works well. You can write the blog title words in any order, leave letters out, have multiple spaces between words, and more.
### Theme toggle
There are three websites themes: Light, Dark and System (inherits the theme of your browser or operating system).
## Articles ## Articles