voussoir/etiquette
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Use a similar hierarchy box style as the album page.

Browse source
This commit is contained in:
voussoir 2018-11-17 17:37:34 -08:00
parent e562658d42
commit 59fdda6c6b
1 changed files with 72 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
frontends/etiquette_flask/templates/tags.html
View file

@ -16,18 +16,41 @@
<script src="/static/js/editor.js"></script> <script src="/static/js/editor.js"></script>
<style> <style>
h2, h3
{
margin-top: 0;
}
#header #header
{ {
grid-area: header; grid-area: header;
} }
#left #left
{ {
word-break: break-word; margin-left: auto;
grid-area: left; margin-right: auto;
width: 95%;
} }
#tag_metadata #left > *
{ {
max-width: 800px; background-color: var(--color_site_transparency);
margin-top: 30px;
margin-bottom: 30px;
padding: 8px;
border-radius: 5px;
}
#tag_metadata h2 .editor_input
{
font-size: inherit;
font-weight: inherit;
}
#description_text
{
font-family: initial;
padding: 8px;
}
#tag_list
{
word-break: break-word;
} }
#right #right
{ {
@ -45,13 +68,6 @@
grid-area: message_area; grid-area: message_area;
margin: 8px; margin: 8px;
} }
#description_text
{
margin-right: 8px;
padding: 8px;
background-color: var(--color_site_transparency);
font-family: initial;
}
@media screen and (max-width: 800px) @media screen and (max-width: 800px)
{ {
#content_body #content_body
@ -84,16 +100,17 @@
<div id="content_body" class="sticky_side_right"> <div id="content_body" class="sticky_side_right">
<div id="left"> <div id="left">
{% if specific_tag %} {% if specific_tag %}
{% do tags.remove((specific_tag.name, specific_tag)) %}
<div id="hierarchy_self">
<div id="tag_metadata"> <div id="tag_metadata">
<h2> <h2><span
<span
id="name_text" id="name_text"
data-editor-id="name" data-editor-id="name"
data-editor-placeholder="name" data-editor-placeholder="name"
> >
{{-specific_tag.name-}} {{-specific_tag.name-}}
</span> </span></h2>
</h2>
<pre <pre
id="description_text" id="description_text"
data-editor-id="description" data-editor-id="description"
@ -103,22 +120,33 @@
{{-specific_tag.description-}} {{-specific_tag.description-}}
</pre> </pre>
</div> </div>
<button class="green_button editor_toolbox_placeholder">Edit</button>
</div>
{% set parents = specific_tag.get_parents() %} {% set parents = specific_tag.get_parents() %}
{% if parents %} {% if parents %}
<ul> <div id="hierarchy_parents">
<h3>Parents</h3>
<ul id="parent_list">
{% for ancestor in specific_tag.get_parents() %} {% for ancestor in specific_tag.get_parents() %}
<li> <li>
{{tag_object.tag_object(ancestor, innertext='(?)', link='info')}} {{tag_object.tag_object(ancestor, innertext='(?)', link='info')}}
{{tag_object.tag_object(ancestor, innertext=ancestor.name, link=none, with_alt_description=True)}} {{tag_object.tag_object(ancestor, innertext=ancestor.name, link=none, with_alt_description=True)}}
</li> </li>
{% endfor %} {% endfor %}
{% endif %}
</ul> </ul>
{% else %} </div>
<h2>Tags</h2>
{% endif %} {% endif %}
<ul>
{% set tag_list_header = "<h3>Children</h3>" %}
{% else %}
{% set tag_list_header = "<h2>Tags</h2>" %}
{% endif %}
{% if tags or not specific_tag %}
<div id="hierarchy_tags">
{{ tag_list_header | safe }}
<ul id="tag_list">
{% for (qualified_name, tag) in tags %} {% for (qualified_name, tag) in tags %}
{% if "." in qualified_name %} {% if "." in qualified_name %}
<li> <li>
@ -173,6 +201,8 @@
{% endfor %} {% endfor %}
</ul> </ul>
</div> </div>
{% endif %}
</div>
<div id="right"> <div id="right">
<div id="editor_area"> <div id="editor_area">
<input type="text" id="add_tag_textbox" autofocus> <input type="text" id="add_tag_textbox" autofocus>
@ -201,6 +231,11 @@ function easybake_form()
{ {
var box = document.getElementById('add_tag_textbox'); var box = document.getElementById('add_tag_textbox');
var easybake_string = box.value; var easybake_string = box.value;
if (easybake_string === "")
{
box.focus();
return;
}
api.tags.easybake(easybake_string, receive_callback); api.tags.easybake(easybake_string, receive_callback);
box.value = ""; box.value = "";
} }