| 1 |
{% include "wizards/partials/step_nav.html" %} |
| 2 |
|
| 3 |
<div class="wizard-step"> |
| 4 |
<h2 class="subtitle-h2">Sections</h2> |
| 5 |
<p class="step-description">Add tabbed content sections (e.g. Features, Installation, Specs). Sections are optional.</p> |
| 6 |
|
| 7 |
<div id="sections-list"> |
| 8 |
{% for section in sections %} |
| 9 |
<div class="section-row" data-id="{{ section.id }}"> |
| 10 |
<span class="section-row-title">{{ section.title }}</span> |
| 11 |
<span class="section-row-length">{{ section.body.chars().count() }} chars</span> |
| 12 |
<button type="button" class="btn-secondary section-delete-btn" data-id="{{ section.id }}">Delete</button> |
| 13 |
</div> |
| 14 |
{% endfor %} |
| 15 |
</div> |
| 16 |
|
| 17 |
<details class="section-add-details"> |
| 18 |
<summary>Add Section</summary> |
| 19 |
<div class="section-add-body"> |
| 20 |
<div class="form-group"> |
| 21 |
<label for="new-section-title">Title</label> |
| 22 |
<input type="text" id="new-section-title" placeholder="e.g. Features, Installation..." autocomplete="off"> |
| 23 |
</div> |
| 24 |
<div class="form-group"> |
| 25 |
<label for="new-section-body">Body (Markdown)</label> |
| 26 |
<textarea id="new-section-body" rows="6" placeholder="Section content..."></textarea> |
| 27 |
</div> |
| 28 |
<button type="button" class="btn-secondary" id="add-section-btn">Add Section</button> |
| 29 |
<span id="section-add-status" class="field-status ml-2"></span> |
| 30 |
</div> |
| 31 |
</details> |
| 32 |
|
| 33 |
<form hx-post="/dashboard/project/{{ project_slug }}/new-item/{{ item_id }}/step/sections" |
| 34 |
hx-target="#wizard-step" hx-swap="innerHTML" |
| 35 |
hx-push-url="/dashboard/project/{{ project_slug }}/new-item/{{ item_id }}/step/pricing"> |
| 36 |
<div class="wizard-actions"> |
| 37 |
<button type="button" class="btn-secondary" |
| 38 |
hx-get="/dashboard/project/{{ project_slug }}/new-item/{{ item_id }}/step/content" |
| 39 |
hx-target="#wizard-step" hx-swap="innerHTML" |
| 40 |
hx-push-url="/dashboard/project/{{ project_slug }}/new-item/{{ item_id }}/step/content">Back</button> |
| 41 |
<button type="submit" class="btn-primary">Continue</button> |
| 42 |
</div> |
| 43 |
</form> |
| 44 |
</div> |
| 45 |
|
| 46 |
<div id="wizard-item-sections-cfg" hidden data-item-id="{{ item_id }}"></div> |
| 47 |
<script src="/static/wizard-item-sections.js?v=0623"></script> |
| 48 |
|