- note-page.js: click-lock (_lockedItem + notes-locked body class); DON auto-DOFFs prev donned; _setGreeting updates navbar; _donnedItem exposed for test API - NotePageSpec.js: 18 Jasmine specs covering lock/unlock, DON/DOFF state, auto-DOFF, greeting update, initial load; flushPromises helper for chained fetch .then() - _note.scss: DON/DOFF opacity:0 by default; hover + locked + donned states show them; body:not(.notes-locked) hover suppression - views.py: Super-Schizo/Super-Nomad card titles; recognition_title field (display_title) separate from card title; mark_safe descriptions w. card-ref spans - my_notes.html: |safe on description; recognition_title for Recognitions block - _navbar.html: id_greeting_prefix/id_greeting_name spans for JS greeting update - _base.scss: global .card-ref rule (--terUser, font-weight 600, !important) Code architected by Disco DeDisco <discodedisco@outlook.com> Git commit message Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
74 lines
3.4 KiB
HTML
74 lines
3.4 KiB
HTML
{% extends "core/base.html" %}
|
|
{% load static %}
|
|
|
|
{% block title_text %}Billnotes{% endblock title_text %}
|
|
{% block header_text %}<span>Bill</span>notes{% endblock header_text %}
|
|
|
|
{% block content %}
|
|
<div class="note-page">
|
|
<ul class="note-list">
|
|
{% for item in note_items %}
|
|
<li class="note-item" data-slug="{{ item.obj.slug }}"
|
|
data-set-palette-url="{% url 'billboard:note_set_palette' item.obj.slug %}"
|
|
data-don-url="{% url 'billboard:don_title' item.obj.slug %}"
|
|
data-doff-url="{% url 'billboard:doff_title' item.obj.slug %}"
|
|
data-title="{{ item.title }}">
|
|
|
|
<div class="note-don-doff">
|
|
<button type="button"
|
|
class="btn btn-equip note-don-btn{% if item.is_equipped %} btn-disabled{% endif %}"
|
|
>{% if item.is_equipped %}×{% else %}DON{% endif %}</button>
|
|
<button type="button"
|
|
class="btn btn-unequip note-doff-btn{% if not item.is_equipped %} btn-disabled{% endif %}"
|
|
>{% if not item.is_equipped %}×{% else %}DOFF{% endif %}</button>
|
|
</div>
|
|
|
|
<div class="note-item__body">
|
|
<p class="note-item__title">{{ item.title }}</p>
|
|
<p class="note-item__description">{{ item.description|safe }}</p>
|
|
<div class="note-recognitions">
|
|
<div class="note-recognitions__header">Recognitions</div>
|
|
<ul class="note-recognitions__list">
|
|
<li><span class="note-recognitions__dim">Title:</span> <strong>{{ item.recognition_title }}</strong></li>
|
|
{% if item.obj.palette %}
|
|
<li class="note-recognitions__palette-line"><span class="note-recognitions__dim">Palette:</span> <strong>{{ item.palette_label }}</strong></li>
|
|
{% endif %}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
{% if item.obj.palette %}
|
|
<div class="note-item__palette {{ item.obj.palette }}"></div>
|
|
{% elif item.swatch_label %}
|
|
<div class="note-item__image-box note-item__image-box--label">{{ item.swatch_label }}</div>
|
|
{% else %}
|
|
<div class="note-item__image-box">?</div>
|
|
{% endif %}
|
|
|
|
{% if not item.obj.palette and item.palette_options %}
|
|
<template class="note-palette-modal-tpl">
|
|
<div class="note-palette-modal">
|
|
{% for p in item.palette_options %}
|
|
<div class="{{ p.name }}" data-palette-label="{{ p.label }}">
|
|
<div class="note-swatch-body"></div>
|
|
<span class="note-swatch-label">{{ p.label }}</span>
|
|
</div>
|
|
{% endfor %}
|
|
<div class="note-palette-confirm">
|
|
<p>Lock in this palette?</p>
|
|
<button type="button" class="btn btn-confirm">OK</button>
|
|
<button type="button" class="btn btn-cancel">NVM</button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
{% endif %}
|
|
|
|
</li>
|
|
{% empty %}
|
|
<li class="note-item note-item--empty">No notes yet.</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
<script src="{% static 'apps/billboard/note-page.js' %}"></script>
|
|
{% endblock %}
|