feat(doc): Expanded examples

content/_session/parts/formatting.md

@@ -11,6 +11,9 @@ Though `<h1>` is the largest, it is recommended that you should start with `<h2>
 These levels the fonts are **bolded**.
 Because of their smaller sizes, the bold type will make them stand out.
 
+###### Special `h6`
+Last header is special, `<h6>` has a dark theme.
+
 ----
 
 ### Quotations
@@ -46,26 +49,66 @@ Quotations begin with a `>`. To separate the lines put a space between lines pre
 
 ### Bullet and Number Lists
 
-- First major
-  - First minor
-    - First macro
-    - Second macro
-  - Second minor
-- Second major
-  > Outside quote
+###### Sample
+- Bullets begin either with a `-` or a `*`
+  - Child bullets are indented aligned to the character after the space
+    - Subsequent bullets are aligned the same way
+      - 4th level bullet
+  - You can mix numbered lists under a bullet
+    1. This line has a prefix `1.`
+       - This is a `-`
+       1. This is a `1.`
+       2. This is a `2.`
+
+1. Numbered list
+
+   To separate from above list, place an empty line in between.
+
+2. With child lists
+
+   Align blocks texts by indentation to the first character after the space.
+
+   - This line starts with a `-`
+
+   1. This line starts with a `1.`
+
+      Note that it changes to a lowered-case character
+
+      1. Greek alpha under numbered
+      2. Second alpha
+
+   2. Second enumerated alpha
+      > Quotation
+
+   - Back to bullet
 
-  1. Numbered list under bullet
-     1. Alpha under numbered
-     2. Second alpha
-        > Other quotes
+     ```
+     - code block
+     ```
 
-  2. Second number
-     > Quotations inside a list
+###### This Course Overview
 
-  - Back to bullet
+1. __Segment 1__: _Theme's Overview_
+   - Session 1: Syllabus & Course Overview
+   - Session 2: AskClass Course Theme Intro
+   - Assignment 1
+     - Due Oct 7
+     - Get AskClass Course Theme Running `part 1`
 
+2. __Segment 2__: _Diving Deeper_
+   - Session 3: Formatting Content (this page)
+   - Assigment 2
+     - <samp>Due Oct 16</samp>
+     - Hosting Your Page on GitHub `part 2`
+   - Quiz
+     - <samp>Due Oct 17</samp>
+     - Seek Knowledge & Gain Wisdom
 
----
+3. __Segment 3__: _Conversations_
+   1. Making Conversations
+   2. Continuing the Dialog
+
+<hr class='section' />
 
 <sub>Section 2</sub>
 ## Special Formatting
@@ -76,6 +119,31 @@ Below are special formatting for AskClass Course Theme only.
 
 Use `<samp>` to <samp>hide text</samp>.
 
+### Separator Lines
+
+We support `----` for separators but also have 2 additional special classes: `section` and `logo`.
+
+###### Section Separator
+
+```
+<hr class="section" />
+```
+
+Using the above code will create an ornate separator as you see between sections 1 & 2 above.
+
+###### Logo Separator
+
+```
+<hr class="logo" />
+```
+
+Similar to above separator but places your logo in the center.
+You can customize this image by modifying `_sass/init.scss`:
+
+```
+$icon-logo:             url('/assets/logo-icon.svg');
+```
+
 ----
 
 ### Poems
@@ -93,5 +161,7 @@ _Note:_ You need to make the screen narrower to see the hanging indentation.
   <dd>That makes calamity of so long life;</dd>
 </dl>
 
+<hr class='logo' />
+
 [Markdown Math]: https://acn.askclass.com/2022/06/20/markdown-math-support
 [GitHub Markdown]: https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github