| 1 |
{% extends "base.html" %} |
| 2 |
{% import "_sheet.html" as sheet %} |
| 3 |
|
| 4 |
{% block title %}New Item - Makenotwork{% endblock %} |
| 5 |
{% block body_attrs %} class="padded-page"{% endblock %} |
| 6 |
|
| 7 |
{% block head %} |
| 8 |
{% call sheet::sheet("wizard.css") %}{% endcall %} |
| 9 |
{% endblock %} |
| 10 |
|
| 11 |
{% block content %} |
| 12 |
{% include "partials/site_header.html" %} |
| 13 |
|
| 14 |
<div class="wizard-layout"> |
| 15 |
<aside class="wizard-sidebar"> |
| 16 |
<h2 class="subtitle-h2">New Item</h2> |
| 17 |
{% include "wizards/partials/step_nav.html" %} |
| 18 |
</aside> |
| 19 |
|
| 20 |
<div class="wizard-content" id="wizard-step"> |
| 21 |
<div class="wizard-step"> |
| 22 |
<h2 class="subtitle-h2">Choose Type</h2> |
| 23 |
<p class="step-description">What kind of content are you creating?</p> |
| 24 |
|
| 25 |
<form hx-post="/dashboard/project/{{ project_slug }}/new-item/step/type" |
| 26 |
hx-target="#wizard-step" hx-swap="innerHTML"> |
| 27 |
<div class="type-grid type-grid-large"> |
| 28 |
{% for (value, label, desc) in item_type_cards %} |
| 29 |
<label class="card--selectable"> |
| 30 |
<input type="radio" name="item_type" value="{{ value }}" |
| 31 |
{% if loop.first %}checked{% endif %}> |
| 32 |
<span class="card--selectable-inner"> |
| 33 |
<span class="card--selectable-label">{{ label }}</span> |
| 34 |
<span class="card--selectable-desc">{{ desc }}</span> |
| 35 |
</span> |
| 36 |
</label> |
| 37 |
{% endfor %} |
| 38 |
</div> |
| 39 |
|
| 40 |
<div class="wizard-actions"> |
| 41 |
<a href="/dashboard/project/{{ project_slug }}" class="btn-secondary">Cancel</a> |
| 42 |
<button type="submit" class="btn-primary">Continue</button> |
| 43 |
</div> |
| 44 |
</form> |
| 45 |
</div> |
| 46 |
</div> |
| 47 |
</div> |
| 48 |
{% endblock %} |
| 49 |
|
| 50 |
{% block scripts %} |
| 51 |
<script src="/static/wizard.js"></script> |
| 52 |
{% endblock %} |
| 53 |
|