individual page renders example sentence and partially-formatted table

src/app.css

@@ -32,4 +32,28 @@ h2 {
 
 footer {
     border-color: var(--stroke);
+}
+
+.pronoun-list-title span {
+    break-after: always;
+}
+
+.pronoun-list-title span:not(:last-child):after {
+    content: "/";
+}
+
+.table-header {
+    background-color: var(--callout);
+}
+
+.pronoun-example-table > div:not(:last-child) .table-header {
+    @apply border-b;
+    border-color: var(--stroke);
+}
+
+@media (min-width: 1024px) {
+    .pronoun-example-table > div .table-header {
+        @apply border-b;
+        border-color: var(--stroke);
+    }
 }

src/views/individual.handlebars

@@ -1 +1,6 @@
-<h1 class="text-5xl lg:text-6xl">{{nominative}}/&#8203;{{accusative}}/&#8203;{{pronominalPossessive}}/&#8203;{{predicativePossessive}}/&#8203;{{reflexive}}</h1>
+<h1 class="pronoun-list-title text-5xl lg:text-6xl flex flex-wrap">
+    {{#each lexicon}}<span>{{this.value}}</span>{{/each}}
+</h1>
+
+{{> exampleSentences lexicon=lexicon}}
+{{> exampleTable lexicon=lexicon}}

src/views/partials/exampleSentences.handlebars

@@ -0,0 +1,7 @@
+<ul class="text-xl my-10 lg:my-16">
+    <li><strong class="capitalize">{{{lexicon.nominative.value}}}</strong> went to the park.</li>
+    <li>I went with <strong>{{{lexicon.accusative.value}}}</strong>.</li>
+    <li><strong class="capitalize">{{{lexicon.nominative.value}}}</strong> brought <strong>{{{lexicon.accusative.value}}}</strong> frisbee.</li>
+    <li>At least I think it was <strong>{{{lexicon.predicativePossessive.value}}}</strong>.</li>
+    <li><strong class="capitalize">{{{lexicon.nominative.value}}}</strong> threw the frisbee to <strong>{{{lexicon.reflexive.value}}}</strong>.</li>
+</ul>

src/views/partials/exampleTable.handlebars

@@ -0,0 +1,8 @@
+<div class="pronoun-example-table flex flex-col overflow-hidden border rounded-t-3xl rounded-b-lg lg:flex-row">
+    {{#each lexicon}}
+        <div class="flex flex-row lg:flex-col lg:w-1/5">
+            <div class="table-header font-bold text-sm p-5 w-52 lg:w-full">{{this.name}}</div>
+            <div>{{this.value}}</div>
+        </div>
+    {{/each}}
+</div>