From 31bbee51ea14d8784f08554657fabfa25201f23b Mon Sep 17 00:00:00 2001
From: sthag <sthag@interaktionsweise.de>
Date: Sun, 31 Mar 2024 00:21:47 +0100
Subject: [PATCH] feat: modify intro page and new todos

- Add hgroup element to intro
- Correct some spelling
- New todos
---
 TODO.md                       | 136 ++++++++++++++++++++++++++++++++--
 source/screens/demo/intro.njk |  10 ++-
 2 files changed, 135 insertions(+), 11 deletions(-)

diff --git a/TODO.md b/TODO.md
index 2f9122f..00cf677 100644
--- a/TODO.md
+++ b/TODO.md
@@ -1,8 +1,130 @@
-- remove gulp and legacy files
-- add dynamic content to robots.txt during build process
-- add dynamic content to sitemap.xml
-- add build process for normalize.css from github.com/necolas/normalize.css
-- add build process for bourbon from https://github.com/thoughtbot/bourbon
-- better README with more info for the content section
+# General
+
+- Remove gulp and legacy files
+- Add dynamic content to robots.txt during build process
+- Add dynamic content to sitemap.xml
+- Add build process for normalize.css from github.com/necolas/normalize.css
+- Add build process for bourbon from https://github.com/thoughtbot/bourbon
+- Better README with more info for the content section
 - Complete CHANGELOG
-- Automatic versioning for package.json and CHANGELOG
\ No newline at end of file
+- Automatic versioning for package.json and CHANGELOG
+
+# Content
+
+- Complete *Intro* with description for all basic elements, according to [HTML Standard - The elements of HTML](https://html.spec.whatwg.org/multipage/semantics.html#semantics)
+	- Documents metadata
+		- [ ] head
+	- Sections
+		- [x] body
+		- [x] article
+		- [x] section
+		- [x] nav
+		- [x] aside
+		- [x] h1-h6
+		- [x] hgroup
+		- [x] header
+		- [x] footer
+		- [x] address (put to grouping content)
+	- Grouping content
+		- [x] p
+		- [x] hr
+		- [x] pre
+		- [x] blockquote
+		- [x] ol
+		- [x] ul
+		- [ ] menu (new)
+		- [x] li
+		- [x] dl
+		- [x] dt
+		- [x] dd
+		- [x] figure
+		- [x] figcaption
+		- [x] main
+		- [ ] search (new)
+		- [x] div
+	- Text-level semantics
+		- [x] a
+		- [x] em
+		- [x] strong
+		- [x] small
+		- [x] s
+		- [x] cite
+		- [x] q
+		- [x] dfn
+		- [x] abbr
+		- [x] ruby
+		- [x] rb (deprecated)
+		- [x] rt
+		- [x] rtc (deprecated)
+		- [x] rp
+		- [x] data
+		- [x] time
+		- [x] code
+		- [x] var
+		- [x] samp
+		- [x] kbd
+		- [x] sub
+		- [x] sup
+		- [x] i
+		- [x] b
+		- [x] u
+		- [x] mark
+		- [x] bdi
+		- [x] bdo
+		- [x] span
+		- [x] br (mentioned in grouping content)
+		- [x] wbr
+	- Edits
+		- [x] ins
+		- [x] del
+	- Embedded content
+		- [x] picture
+		- [x] source
+		- [x] img
+		- [ ] iframe
+		- [ ] embed
+		- [ ] object
+		- [ ] param (deprecated)
+		- [ ] video
+		- [ ] audio
+		- [ ] track
+		- [ ] map
+		- [ ] area
+	- Tabular data
+		- [ ] table
+		- [ ] caption
+		- [ ] colgroup
+		- [ ] col
+		- [ ] tbody
+		- [ ] thead
+		- [ ] tfoot
+		- [ ] tr
+		- [ ] td
+		- [ ] th
+	- Forms
+		- [x] form
+		- [x] label
+		- [x] input
+		- [x] button
+		- [ ] select
+		- [ ] datalist
+		- [ ] optgroup
+		- [ ] option
+		- [ ] textarea
+		- [ ] output
+		- [ ] progress
+		- [ ] meter (new)
+		- [x] fieldset
+		- [x] legend
+	- Interactive elements
+		- [ ] details
+		- [ ] summary
+		- [ ] dialog
+	- Scripting
+		- [ ] script
+		- [ ] noscript
+		- [ ] template
+		- [ ] slot
+		- [ ] canvas
+- Check style for every basic element
+- Uniform spelling of classes and identifiers
\ No newline at end of file
diff --git a/source/screens/demo/intro.njk b/source/screens/demo/intro.njk
index 67d7c86..61c5f7d 100644
--- a/source/screens/demo/intro.njk
+++ b/source/screens/demo/intro.njk
@@ -13,7 +13,7 @@
   {% include "hippie/partials/_body_nav.njk" %}
 
   <div id="begin" class="demo__intro">
-    Dies ist einfach nur Text.<br>Weniger wäre Nichts, denn dieser Text ist nicht durch ein spezifisches Element umschlossen.<br>Dies ist normalerweise nicht vorgesehen und wird hier nur zur Einführung und Anschauung verwendet.<br><br>
+    Dies ist einfach nur Text.<br>Weniger wäre Nichts, denn dieser Text ist nicht durch ein spezifisches Element umschlossen.<br>Das ist normalerweise nicht vorgesehen und wird hier nur zur Einführung und Anschauung verwendet.<br><br>
     <article>
       <p>Es wirken nur die Eigenschaften des
         <code>&lt;body&gt;</code>
@@ -66,8 +66,10 @@
       <h3>Überschrift 3 ist in Großbuchstaben gesetzt</h3>
       <h4>Überschrift 4 verwendet normale Buchstaben und gleicht ansonsten Überschrift 3</h4>
       <h5>Überschrift 5 ist Überschrift 5</h5>
-      <h6>Überschrift 6</h6>
-      <p>Schließlich eine Überschrift in der Größe des Fließtextes. Allerdings in fett.</p>
+      <hgroup>
+        <h6>Überschrift 6</h6>
+        <p>Überschriften können mit dem Element <code>&lt;hgroup&gt;</code> mit Absätzen gruppiert werden um beispielsweise Untertitel abzubilden.</p>
+      </hgroup>
     </article>
     <article>
       <h1 id="grouping">Gruppierung</h1>
@@ -493,7 +495,7 @@
       </aside>
       <p>Der Inhalt wird dann mit
         <code>&lt;ins&gt;</code>
-        ausgezeichnet. Wird Text entfernt, kommt das
+        ausgezeichnet. Wird Text entfernt, kommt 
         <code>&lt;del&gt;</code>
         zum Einsatz.</p>
       <h6>Zu Tun</h6>