1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
|
{% extends 'base.html' %}
{% block extrastyles %}
<link rel="stylesheet" href="/media/quill.snow.css" />
{% endblock %}
{% block content %}
<main>
<article class="note-container">
<form action="" method="post" id="note-edit-form">{% csrf_token %}
<header class="note-header">
<div class="note-header-left">
<div class="flex-wrapper">
<div class="notebook">
<a id="n-link" href="{% url 'notebooks:detail' object.slug %}"><span id="n-box" class="color-box" style="background-color: {{object.notebook.color_rgb}}"></span><span id="n-name">{{object.notebook}}</span></a>
<div id="notebook-edit" class="hide">
<span class="error">{{ form.notebook.errors }}</span>
{{form.notebook}}
</div>
</div>
<div class="tags">
<span class="label">tags:</span>
<div id="t-display" class="">{% for tag in object.tags.all %}
<a class="t-link" href="{% url 'notes:tags' tag.slug %}">
<span class="tag-wrapper" data-bg-color="#{{tag.color_color_rgb}};" >{{tag}}</span>
</a>{%endfor%}
</div>
<div id="tags-edit" class="hide">
<span class="error">{{ form.notebook.errors }}</span>
{{form.tags}}
</div>
</div>
</div>
</div>
<div class="hide">{{form.body_text}}</div>
<fieldset class="hide">{{form.title}}</fieldset>
<div class="note-header-right">
<h2 class="note-time">{{object.date_created|date:"M d, Y"}}</h2>
{% if object.url %}<h3 class="note-url"><a class="btn btn-small btn-subtle" href="{{object.url}}">Source</a><a class="btn btn-small btn-subtle right-padding-0 left-margin-2" href="object.cache">Archive</a></h3>{% endif %}
</div>
</header>
<div class="edit-btn-wrapper"><button class="hide btn btn-hollow" id="edit-toggle-btn">Edit</button></div>
<h1 id="note-title" class="note-title">{{object.title}}</h1>
<div id="q-container" class="inactive"><div id="note-body">{% if object.body_html %}{{object.body_html|safe}}{%else%}{{object.body_text}}{%endif%}</div></div>
<input id="btn-js-hide" type="submit" class="btn sm" value="Save" >
</form>
</article>
<aside class="note-list-container">
<div class="svg-wrapper"><svg class="svg-icon-arrow">
<svg viewBox="0 0 16 13" id="shape-double-arrow" width="100%" height="100%"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="square"><g id="Showing-post-info" transform="translate(-297.000000, -105.000000)" stroke="currentColor"><g transform="translate(305.000000, 111.500000) scale(-1, 1) rotate(-180.000000) translate(-305.000000, -111.500000) translate(297.000000, 105.000000)"><path d="M2.20710678,6.5 L6.85355339,1.85355339 L7.20710678,1.5 L6.5,0.792893219 L6.14644661,1.14644661 L1.14644661,6.14644661 L1.05805826,6.23483496 L0.792893219,6.5 L1.14644661,6.85355339 L6.14644661,11.8535534 L6.5,12.2071068 L7.20710678,11.5 L6.85355339,11.1464466 L2.20710678,6.5 Z" id="Combined-Shape"></path><path d="M10.2071068,6.5 L14.8535534,1.85355339 L15.2071068,1.5 L14.5,0.792893219 L14.1464466,1.14644661 L9.14644661,6.14644661 L9.05805826,6.23483496 L8.79289322,6.5 L9.14644661,6.85355339 L14.1464466,11.8535534 L14.5,12.2071068 L15.2071068,11.5 L14.8535534,11.1464466 L10.2071068,6.5 Z" id="Combined-Shape"></path></g></g></g></svg>
</svg></div>
<div class="">
<ul class="list-note-preview">{% for obj in notes_list %}
<li>
<a href="{% url 'notes:detail' obj.slug obj.pk %}">
<h4>{{obj.title}}</h4>
<div class="note-preview">{{obj.body_text|truncatewords:12}}</div>
</a>
</li>
{% endfor %}</ul>
</div>
</aside>
<div class="balance-container">
</div>
</main>
{% endblock %}
{% block jsinclude %}
<script src="/media/js/highlight.pack.js"></script>
<script src="/media/js/quill.min.js"></script>
<script>
document.addEventListener('readystatechange', event => {
if (event.target.readyState === "interactive") {
//initLoader();
}
else if (event.target.readyState === "complete") {
initQuill("#note-body");
}
});
</script>
{% endblock %}
{% block jsdomready %}
window.url = "{% url 'notes-api-detail' object.pk %}";
{%endblock%}
|