[{"data":1,"prerenderedAt":14},["ShallowReactive",2],{"clay-page:\u002Fde\u002Fwriting\u002Fcomponents\u002Fsteps":3},{"html":4,"toc":5,"description":10,"hero":11,"list":12,"socialImage":13},"\u003Ch1 id=\"schritte\">Schritte\u003C\u002Fh1>\n\u003Cp>Schritte machen aus einer nummerierten Liste eine Anleitung zum Mitmachen: Jeder Schritt bekommt einen nummerierten Kreis, und eine Linie führt von einem Schritt zum nächsten.\u003C\u002Fp>\n\u003Cdiv class=\"code-block\">\u003Cpre class=\"shiki shiki-themes light-plus dark-plus\" style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4;--shiki-light-bg:#FFFFFF;--shiki-dark-bg:#1E1E1E\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">::: steps\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#0451A5;--shiki-dark:#6796E6\">1.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000080;--shiki-light-font-weight:bold;--shiki-dark:#569CD6;--shiki-dark-font-weight:bold\"> **Installiere Clay**\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> in deinem Projekt:\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">   ```bash\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">   npm install --save-dev clay-doc\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">   ```\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#0451A5;--shiki-dark:#6796E6\">2.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000080;--shiki-light-font-weight:bold;--shiki-dark:#569CD6;--shiki-dark-font-weight:bold\"> **Schreib eine Seite.**\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> Lege \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#CE9178\">`docs\u002Findex.md`\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> mit einer Überschrift an.\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#0451A5;--shiki-dark:#6796E6\">3.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000080;--shiki-light-font-weight:bold;--shiki-dark:#569CD6;--shiki-dark-font-weight:bold\"> **Starte den Entwicklungsserver**\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> mit \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#CE9178\">`npx clay dev`\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> und öffne die Adresse, die er zeigt.\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">:::\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003Cdiv class=\"clay-steps\">\u003Col>\n\u003Cli>\u003Cp>\u003Cstrong>Installiere Clay\u003C\u002Fstrong> in deinem Projekt:\u003C\u002Fp>\n\u003Cdiv class=\"code-block is-terminal has-bar\">\u003Cdiv class=\"code-terminal\" aria-hidden=\"true\">\u003Cspan>\u003C\u002Fspan>\u003Cspan>\u003C\u002Fspan>\u003Cspan>\u003C\u002Fspan>\u003C\u002Fdiv>\u003Cpre class=\"shiki shiki-themes light-plus dark-plus\" style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4;--shiki-light-bg:#FFFFFF;--shiki-dark-bg:#1E1E1E\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line command\">\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">npm\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> install\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\"> --save-dev\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> clay-doc\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>\u003Cstrong>Schreib eine Seite.\u003C\u002Fstrong> Lege \u003Ccode>docs\u002Findex.md\u003C\u002Fcode> mit einer Überschrift an.\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>\u003Cstrong>Starte den Entwicklungsserver\u003C\u002Fstrong> mit \u003Ccode>npx clay dev\u003C\u002Fcode> und öffne die Adresse, die er zeigt.\u003C\u002Fp>\n\u003C\u002Fli>\n\u003C\u002Fol>\n\u003C\u002Fdiv>\n\u003Ch2 id=\"schritte-schreiben\">\u003Ca class=\"heading-anchor\" href=\"#schritte-schreiben\" aria-label=\"Link zu diesem Abschnitt\" data-route=\"#schritte-schreiben\">#\u003C\u002Fa>Schritte schreiben\u003C\u002Fh2>\n\u003Cul>\n\u003Cli>\u003Cstrong>Schreib eine nummerierte Liste\u003C\u002Fstrong> in \u003Ccode>::: steps\u003C\u002Fcode>. Schritte zählen immer ab 1.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Ein Schritt kann mehr als eine Zeile enthalten:\u003C\u002Fstrong> Codeblöcke, Bilder, Hinweise. Rücke sie bis zum Text des Schritts ein (drei Leerzeichen nach \u003Ccode>1. \u003C\u002Fcode>), damit sie dazugehören.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Beginne jeden Schritt mit dem, was zu tun ist\u003C\u002Fstrong>, fett, und erkläre darunter. Wer überfliegt, sieht die ganze Anleitung auf einen Blick.\u003C\u002Fli>\n\u003Cli>Text vor oder nach der Liste im Container erscheint wie gewohnt.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cdiv class=\"markdown-alert markdown-alert-tip\">\n\u003Cp class=\"markdown-alert-title text-primary\">\u003Ci class=\"fa-solid fa-lightbulb mr-2\">\u003C\u002Fi>Tipp\u003C\u002Fp>\n\u003Cp>Schritte sind für Dinge, die nacheinander passieren. Für eine Liste von Optionen oder Funktionen liest sich eine normale Liste besser.\u003C\u002Fp>\n\u003C\u002Fdiv>\n",[6],{"id":7,"text":8,"level":9},"schritte-schreiben","Schritte schreiben",2,"Eine nummerierte Liste als Anleitung, mit einem nummerierten Kreis je Schritt und einer Linie zum nächsten.",null,false,"\u002F_clay\u002Fsocial\u002Fde\u002Fwriting\u002Fcomponents\u002Fsteps.png",1792666371996]