diff options
Diffstat (limited to 'design/templates/notes/notebook_list.html')
| -rw-r--r-- | design/templates/notes/notebook_list.html | 63 |
1 files changed, 50 insertions, 13 deletions
diff --git a/design/templates/notes/notebook_list.html b/design/templates/notes/notebook_list.html index 6f25f62..5f1220f 100644 --- a/design/templates/notes/notebook_list.html +++ b/design/templates/notes/notebook_list.html @@ -6,32 +6,69 @@ {% endblock %} {% block content %} <main> - <article class="note-container"> - <h2 class="hed-small top-margin-0">Add a Notebook</h2> - {% include 'notes/partials/notebook_form.html' with form=form %} + <article id="nb-list-home" class="note-container"> + <div class="flex-wrapper"> <h1 class="hed-small">Notebooks</h1> - + <a class="circle plus small-circle modal-open push-top" href="/nb/" id="add_id_notebook" data-modal-hed-class="notebook" data-modal-hed="Add a New Notebook">New</a> + </div> + {% if messages %} + <ul class="messages"> + {% for message in messages %} + <li{% if message.tags %} class="{{ message.tags }}"{% endif %}> + {% if 'safe' in message.tags %}{{ message|safe }}{% else %}{{ message }}{% endif %} + </li> + {% endfor %} + </ul> + {% endif %} + <div id="notebook-wrapper"> + {% include 'notes/partials/notebook_form.html' with form=form url='' %} + </div> <ul class="nb-list">{% for form in notebook_form_list %} <li class="nb-list-item"> - <form action="{% url 'notebook-api-detail' form.instance.id %}" method="PUT">{% for field in form %}{% if field.name == 'color_rgb' %} - <fieldset class="color-picker-fieldset" id="color-picker-{{forloop.parentloop.counter0}}" {% if form.instance.color_rgb %}style="background-color: {{form.instance.color_rgb}}; border: none;"{%endif%}> - <input type="text" name="color_rgb" value="{{form.instance.color_rgb}}" maxlength="20" id="id_color_rgb"> + <form action="{% url 'notebooks:update' form.instance.slug %}" method="POST" name="create" data-method="POST" data-action="">{% csrf_token %} + {% for field in form %}{% if field.name == 'color_rgb' %} + <div class="flex-wrapper"> + <fieldset class="fe-color-picker color-picker-fieldset " id="color-picker-{{forloop.parentloop.counter0}}" {% if form.instance.color_rgb %}style="background-color: {{form.instance.color_rgb}}; border: none;"{%endif%}> + <input type="text" class="input-color-rgb" name="color_rgb" value="{{form.instance.color_rgb}}" maxlength="20" id="id_color_rgb-{{forloop.parentloop.counter0}}"> {% if field.errors %}{{field.errors}}{% endif %} </fieldset> - href="{% url 'notebooks:detail' form.instance.slug %}" - <h2>{{form.instance.name}}</h2> - {% else %} + <h2 class="nb-name"><a href="{% url 'notebooks:detail' form.instance.slug %}">{{form.instance.name}}</a></h2> + <button type="submit" value="trash" class="btn-hollow trash float-right" name="trash">Move to Trash</button> + </div> + {% elif field.name == 'name' %} <fieldset> + <label for="id_name-{{forloop.parentloop.counter0}}">Notebook Name:</label> + <input type="text" name="name" value="{{form.instance.name}}" maxlength="250" required id="id_name-{{forloop.parentloop.counter0}}"> + </fieldset> + {% else %} {% if field.field.widget.input_type != 'hidden' %}{{field.label_tag}}{% endif %} {{field}} {% if field.errors %}{{field.errors}}{% endif %} - </fieldset>{% endif %}{% endfor %} + {% endif %}{% endfor %} <input id="i-{{forloop.counter0}}" type="submit" class="btn sm" value="Save" > + + <div class="row-wrapper"> + <p>{{form.instance.note_count}} notes{% if form.instance.note_count > 5 %}, most recent:{%endif%}</p> + {% if form.instance.note_count > 0 %}<ul id="n-list-{{forloop.counter0}}" class="n-list{% if form.instance.note_count > 5 %} slideup{%endif%}">{% for note in form.instance.note_set.all %} + <li><a href="{{note.get_absolute_url}}">{{note.title}}</a></li> + {%endfor%} + {% if form.instance.note_count > 5 %}<li class="more"><button type="button" class="btn btn-small btn-more button" id="more-button-{{forloop.counter0}}">More</button></li>{%endif%} + </ul>{%endif%} + {% if form.instance.tag_list %}<div class="tags">Common tags: <ul class="inline">{% for tag in form.instance.tag_list %} + <li class="inline"><a href="{% url 'notes:tags' tag.slug %}"> + <span class="tag-wrapper" data-bg-color="#{{tag.color_hex}};" >{{tag|title}}</span> + </a></li> + {%endfor%}</div>{%endif%} + <div class="edit-btn-wrapper"><a class="btn btn-hollow btn-nb-edit float-right" id="edit-toggle-btn-{{forloop.counter0}}">Edit</a></div> + </div> </form> - <div class="edit-btn-wrapper"><a class="btn btn-hollow btn-nb-edit" id="edit-toggle-btn-{{forloop.counter0}}">Edit</a></div> - <div class="edit-btn-wrapper"><a class="btn btn-hollow btn-nb-trash" id="trash-btn-{{forloop.counter0}}">Trash</a></div> </li> {%endfor%}</ul> + + + + + {% comment %} <ul class="nb-list">{% for object in notebook_list %} <li class="nb-list-item"> |