Javascript button for reply form

This commit is contained in:
Mouse Reeve 2021-01-17 10:38:34 -08:00
parent 47d5b907ac
commit ff743ed9d6
4 changed files with 13 additions and 16 deletions

View file

@ -18,7 +18,7 @@
background-color: hsl(171, 100%, 41%); background-color: hsl(171, 100%, 41%);
color: white; color: white;
} }
.hide-active[aria-pressed=true], .hide-active { .hide-active[aria-pressed=true], .hide-inactive[aria-pressed=false] {
display: none; display: none;
} }

View file

@ -34,14 +34,14 @@
<textarea name="quote" class="textarea" id="id_quote_{{ book.id }}_{{ type }}" placeholder="{{ placeholder }}" required></textarea> <textarea name="quote" class="textarea" id="id_quote_{{ book.id }}_{{ type }}" placeholder="{{ placeholder }}" required></textarea>
{% else %} {% else %}
{% include 'snippets/content_warning_field.html' with parent_status=status %} {% include 'snippets/content_warning_field.html' with parent_status=status %}
<textarea name="content" class="textarea" id="id_content_{{ book.id }}{{reply_parent.id}}{{ uuid }}_{{ type }}" placeholder="{{ placeholder }}" {% if type == 'reply' %} aria-label="Reply"{% endif %} required></textarea> <textarea name="content" class="textarea" id="id_content_{{ type }}-{{ book.id }}{{reply_parent.id}}" placeholder="{{ placeholder }}" {% if type == 'reply' %} aria-label="Reply"{% endif %} required></textarea>
{% endif %} {% endif %}
</div> </div>
{% if type == 'quotation' %} {% if type == 'quotation' %}
<div class="control"> <div class="control">
<label class="label" for="id_content_{{ book.id }}_quote">Comment:</label> <label class="label" for="id_content_quote-{{ book.id }}">Comment:</label>
{% include 'snippets/content_warning_field.html' with parent_status=status %} {% include 'snippets/content_warning_field.html' with parent_status=status %}
<textarea name="content" class="textarea is-small" id="id_content_{{ book.id }}_quote"></textarea> <textarea name="content" class="textarea is-small" id="id_content_quote-{{ book.id }}"></textarea>
</div> </div>
{% endif %} {% endif %}
<input type="checkbox" class="hidden" name="sensitive" id="id_show_spoilers-{{ uuid }}" {% if status.content_warning %}checked{% endif %} aria-hidden="true"> <input type="checkbox" class="hidden" name="sensitive" id="id_show_spoilers-{{ uuid }}" {% if status.content_warning %}checked{% endif %} aria-hidden="true">
@ -56,7 +56,7 @@
</div> </div>
</div> </div>
<div class="column is-narrow"> <div class="column is-narrow">
<button class="button is-link" type="submit">post</button> <button class="button is-link" type="submit">Post</button>
</div> </div>
</div> </div>
</form> </form>

View file

@ -18,7 +18,7 @@
{% block card-footer %} {% block card-footer %}
<div class="card-footer-item"> <div class="card-footer-item">
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
{% include 'snippets/toggle/toggle_button.html' with controls_text="show-comment" controls_uid=status.id text="Reply" icon='comment' small=True %} {% include 'snippets/toggle/toggle_button.html' with controls_text="show-comment" controls_uid=status.id text="Reply" icon="comment" class="is-small" focus="id_content_reply" %}
{% include 'snippets/boost_button.html' with status=status %} {% include 'snippets/boost_button.html' with status=status %}
{% include 'snippets/fav_button.html' with status=status %} {% include 'snippets/fav_button.html' with status=status %}
@ -57,8 +57,7 @@
{% block card-bonus %} {% block card-bonus %}
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
{% with status.id|uuid as uuid %} {% with status.id|uuid as uuid %}
<input class="toggle-control" type="checkbox" name="show-comment-{{ status.id }}" id="show-comment-{{ status.id }}" data-focus-target="id_content_{{ status.id }}{{ uuid }}_reply"> <section class="hidden" id="show-comment-{{ status.id }}">
<section class="toggle-content hidden">
<div class="card-footer"> <div class="card-footer">
<div class="card-footer-item"> <div class="card-footer-item">
{% include 'snippets/create_status_form.html' with reply_parent=status type="reply" %} {% include 'snippets/create_status_form.html' with reply_parent=status type="reply" %}

View file

@ -4,16 +4,14 @@
{% with full|truncatewords_html:60 as trimmed %} {% with full|truncatewords_html:60 as trimmed %}
{% if trimmed != full %} {% if trimmed != full %}
<div> <div id="hide-full-{{ uuid }}">
<input type="radio" name="show-hide-{{ uuid }}" id="show-{{ uuid }}" class="toggle-control" checked> <blockquote class="content" id="trimmed-{{ uuid }}"><span dir="auto">{{ trimmed | to_markdown | safe }}</span>
<blockquote class="content toggle-content hidden"><span dir="auto">{{ trimmed | to_markdown | safe }}</span> {% include 'snippets/toggle/open_button.html' with text="show more" controls_text="full" controls_uid=uuid class="is-small" %}
{% include 'snippets/toggle/toggle_button.html' with text="show more" controls_text="hide" controls_uid=uuid class="has-text-link is-clickable" %}
</blockquote> </blockquote>
</div> </div>
<div> <div id="full-{{ uuid }}" class="hidden">
<input type="radio" name="show-hide-{{ uuid }}" id="hide-{{ uuid }}" class="toggle-control"> <blockquote class="content"><span dir="auto">{{ full | to_markdown | safe }}</span>
<blockquote class="content toggle-content hidden"><span dir="auto">{{ full | to_markdown | safe }}</span> {% include 'snippets/toggle/close_button.html' with text="show less" controls_text="full" controls_uid=uuid class="is-small" %}
{% include 'snippets/toggle/toggle_button.html' with text="show less" controls_text="show" controls_uid=uuid class="has-text-link is-clickable" %}
</blockquote> </blockquote>
</div> </div>
{% else %} {% else %}