dt illustrations 1

VODGroup · Apr 4, 2024 · 725e85e · 725e85e
1 parent ab88b12
commit 725e85e
Show file tree

Hide file tree

Showing 35 changed files with 409 additions and 2 deletions.
diff --git a/...bilityHandbook.docc/Pages/Adaption/Advanced/AccessibleAppearance/ColorsAndShapes.tutorial b/...bilityHandbook.docc/Pages/Adaption/Advanced/AccessibleAppearance/ColorsAndShapes.tutorial
@@ -16,7 +16,7 @@
     > Note: Accessibility Inspector has a built-in instrument
 
 
-    @Section(title: "<#text#>") {
+    @Section(title: "Accessible Appearance of Controls") {
         @ContentAndMedia {
             <#text#>
         }
@@ -27,4 +27,152 @@
             }
         }
     }
+
+    @Section(title: "Dark Mode Support") {
+        @ContentAndMedia {
+            <#text#>
+        }
+
+        @Steps {
+            @Step {
+                <#Work in progress#>
+            }
+        }
+    }
+
+    @Section(title: "Color Blindness") {
+        @ContentAndMedia {
+            <#text#>
+        }
+
+        @Steps {
+            @Step {
+                <#Work in progress#>
+            }
+        }
+    }
+
+    @Section(title: "Sufficient Contrast") {
+        @ContentAndMedia {
+            <#text#>
+        }
+
+        @Steps {
+            @Step {
+                <#Work in progress#>
+            }
+        }
+    }
+
+    @Section(title: "Dynamic Type") {
+        @ContentAndMedia {
+            <#text#>
+        }
+
+        @Steps {
+            @Step {
+                <#Work in progress#>
+            }
+        }
+    }
+
+    @Section(title: "What now") {
+        @ContentAndMedia {
+            Congratulations! 
+
+            What about a little `quiz` to revise the topic? 🔎
+
+            @Image(source: placeholder-image, alt: "")
+        }
+
+        @Steps {
+            @Step {
+                Text.
+                @Image(source: placeholder-image, alt: "")
+            }
+        }
+    }
+    @Assessments {
+        @MultipleChoice {
+            Question?
+
+            @Choice(isCorrect: false) {
+                Yes
+                @Justification(reaction: "Try again!") {
+                    text
+                }
+            }
+
+            @Choice(isCorrect: true) {
+                No
+                @Justification(reaction: "That's right!") {
+                    text
+                }
+            }
+
+            @Choice(isCorrect: false) {
+                Maybe
+                @Justification(reaction: "Try again!") {
+                    text
+                }
+            }
+        }
+
+        @MultipleChoice {
+            Question?
+
+            @Choice(isCorrect: false) {
+                Yes
+                @Justification(reaction: "Try again!") {
+                    text
+                }
+            }
+
+            @Choice(isCorrect: true) {
+                No
+                @Justification(reaction: "That's right!") {
+                    text
+                }
+            }
+
+            @Choice(isCorrect: false) {
+                Maybe
+                @Justification(reaction: "Try again!") {
+                    text
+                }
+            }
+        }
+
+        @MultipleChoice {
+            Question?
+
+            @Choice(isCorrect: false) {
+                Yes
+                @Justification(reaction: "Try again!") {
+                    text
+                }
+            }
+
+            @Choice(isCorrect: false) {
+                No
+                @Justification(reaction: "Try again!") {
+                    text
+                }
+            }
+
+            @Choice(isCorrect: true) {
+                All
+                @Justification(reaction: "That's right!") {
+                    text
+                }
+            }
+
+            @Choice(isCorrect: false) {
+                None
+                @Justification(reaction: "Try again!") {
+                    text
+                }
+            }
+        }
+    }
 }
diff --git a/...ilityHandbook.docc/Pages/Adaption/Advanced/AccessibleAppearance/ControlledMotion.tutorial b/...ilityHandbook.docc/Pages/Adaption/Advanced/AccessibleAppearance/ControlledMotion.tutorial
@@ -0,0 +1,87 @@
+@Tutorial(time: 15) {
+    @Intro(title: "<#text#>") {
+        <#text#>
+
+        @Image(source: <#file#>, alt: "<#accessible description#>")
+    }
+
+    @Section(title: "What Is Considered Motion in an Interface") {
+        @ContentAndMedia {
+            <#text#>
+
+            @Image(source: <#file#>, alt: "<#accessible description#>")
+        }
+
+        @Steps {
+            @Step {
+                <#text#>
+
+                @Image(source: <#file#>, alt: "<#accessible description#>")
+            }
+        }
+    }
+
+    @Section(title: "How Motion Sickness Functions") {
+        @ContentAndMedia {
+            <#text#>
+
+            @Image(source: <#file#>, alt: "<#accessible description#>")
+        }
+
+        @Steps {
+            @Step {
+                <#text#>
+
+                @Image(source: <#file#>, alt: "<#accessible description#>")
+            }
+        }
+    }
+
+    @Section(title: "Limit Amount of Moving Pictures") {
+        @ContentAndMedia {
+            <#text#>
+
+            @Image(source: <#file#>, alt: "<#accessible description#>")
+        }
+
+        @Steps {
+            @Step {
+                <#text#>
+
+                @Image(source: <#file#>, alt: "<#accessible description#>")
+            }
+        }
+    }
+
+    @Section(title: "Cross-fade Transition") {
+        @ContentAndMedia {
+            <#text#>
+
+            @Image(source: <#file#>, alt: "<#accessible description#>")
+        }
+
+        @Steps {
+            @Step {
+                <#text#>
+
+                @Image(source: <#file#>, alt: "<#accessible description#>")
+            }
+        }
+    }
+
+    @Section(title: "Gaming Without Motion Sickness") {
+        @ContentAndMedia {
+            <#text#>
+
+            @Image(source: <#file#>, alt: "<#accessible description#>")
+        }
+
+        @Steps {
+            @Step {
+                <#text#>
+
+                @Image(source: <#file#>, alt: "<#accessible description#>")
+            }
+        }
+    }
+}