Fix #4747: BUR layout partly broken on iOS.

Move the BUR help text from the <textarea> placeholder attribute to a
<details> tag that embeds the [[help:bur_notice]] wiki page.

Also update some CSS for the <details> tag that was meant to only apply
to the user upgrades page and didn't look good here.
This commit is contained in:
evazion
2021-03-05 19:53:42 -06:00
parent be162a8ae9
commit bb0540e1a1
8 changed files with 36 additions and 43 deletions

View File

@@ -1,19 +0,0 @@
module BulkUpdateRequestsHelper
def bur_script_example
<<~BUR
create alias bunny -> rabbit
remove alias bunny -> rabbit
create implication bunny -> animal
remove implication bunny -> animal
rename bunny -> rabbit
update bunny_focus -> animal_focus bunny
nuke bunny
category touhou -> copyright
BUR
end
end

View File

@@ -112,13 +112,10 @@ table tfoot {
} }
details { details {
border-bottom: 1px solid var(--details-border-color);
summary { summary {
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
outline: none; outline: none;
line-height: 2em;
} }
} }

View File

@@ -255,7 +255,7 @@ html {
--login-link-color: var(--red-5); --login-link-color: var(--red-5);
--footer-border-color: var(--grey-1); --footer-border-color: var(--grey-1);
--details-border-color: var(--grey-2); --divider-border-color: var(--grey-2);
--jquery-ui-widget-content-background: var(--body-background-color); --jquery-ui-widget-content-background: var(--body-background-color);
--jquery-ui-widget-content-text-color: var(--text-color); --jquery-ui-widget-content-text-color: var(--text-color);
@@ -446,7 +446,7 @@ body[data-current-user-theme="dark"] {
--login-link-color: var(--red-4); --login-link-color: var(--red-4);
--footer-border-color: var(--grey-7); --footer-border-color: var(--grey-7);
--details-border-color: var(--grey-7); --divider-border-color: var(--grey-7);
--jquery-ui-widget-content-text-color: var(--text-color); --jquery-ui-widget-content-text-color: var(--text-color);
--jquery-ui-widget-content-background: var(--grey-8); --jquery-ui-widget-content-background: var(--grey-8);

View File

@@ -131,6 +131,14 @@ div.prose {
.spoiler { .spoiler {
background: var(--dtext-spoiler-background-color); background: var(--dtext-spoiler-background-color);
} }
details {
margin-bottom: 1em;
summary {
margin-bottom: 1em;
}
}
} }
// avoid empty gaps beneath dtext blocks in table rows. // avoid empty gaps beneath dtext blocks in table rows.

View File

@@ -42,6 +42,8 @@ $spacer: 0.25rem; /* 4px */
.space-x-4 > * + * { margin-left: 4 * $spacer; } .space-x-4 > * + * { margin-left: 4 * $spacer; }
.space-y-4 > * + * { margin-top: 4 * $spacer; } .space-y-4 > * + * { margin-top: 4 * $spacer; }
.divide-y-1 > * + * { border-top: 1px solid var(--divider-border-color); }
.align-top { vertical-align: top; } .align-top { vertical-align: top; }
.flex-auto { flex: 1 1 auto; } .flex-auto { flex: 1 1 auto; }

View File

@@ -1,5 +1,9 @@
div#c-user-upgrades { div#c-user-upgrades {
div#a-new { div#a-new {
summary {
padding: 1rem 0;
}
table#feature-comparison { table#feature-comparison {
colgroup#basic { colgroup#basic {
background-color: var(--user-upgrade-basic-background-color); background-color: var(--user-upgrade-basic-background-color);

View File

@@ -1,25 +1,26 @@
<%= edit_form_for(@bulk_update_request) do |f| %> <%= edit_form_for(@bulk_update_request) do |f| %>
<p> <div class="prose">
Request aliases or implications using the format shown below. An <b>alias</b> makes the first tag a <details>
synonym for the second tag. An <b>implication</b> makes the first tag automatically add the second tag. <summary>Help: How to make a bulk update request</summary>
A <b>rename</b> replaces the first tag with the second tag without making it a permanent alias.
An <b>update</b> moves multiple tags and pools at once.
</p>
<p> <%= embed_wiki "help:bur_notice" %>
<% if @bulk_update_request.new_record? && @bulk_update_request.forum_topic.present? %> </details>
This request will be attached to
<%= link_to "topic ##{@bulk_update_request.forum_topic_id}: #{@bulk_update_request.forum_topic.title}", @bulk_update_request.forum_topic %>.
<%= f.input :forum_topic_id, as: :hidden, input_html: { value: params.dig(:bulk_update_request, :forum_topic_id) } %>
<% elsif @bulk_update_request.new_record? && @bulk_update_request.forum_topic.blank? %>
This request will create a new forum topic. To attach this request to an existing topic, find
the forum topic and click "Request alias/implication" at the top of the page.
<%= f.input :title, label: "Forum Title", as: :string %> <p>
<% end %> <% if @bulk_update_request.new_record? && @bulk_update_request.forum_topic.present? %>
</p> This request will be attached to
<%= link_to "topic ##{@bulk_update_request.forum_topic_id}: #{@bulk_update_request.forum_topic.title}", @bulk_update_request.forum_topic %>.
<%= f.input :forum_topic_id, as: :hidden, input_html: { value: params.dig(:bulk_update_request, :forum_topic_id) } %>
<% elsif @bulk_update_request.new_record? && @bulk_update_request.forum_topic.blank? %>
This request will create a new forum topic. To attach this request to an existing topic, find
the forum topic and click "Request alias/implication" at the top of the page.
<%= f.input :script, label: "Request", as: :text, placeholder: bur_script_example %> <%= f.input :title, label: "Forum Title", as: :string %>
<% end %>
</p>
</div>
<%= f.input :script, label: "Request", as: :text %>
<% if @bulk_update_request.new_record? %> <% if @bulk_update_request.new_record? %>
<div class="input"> <div class="input">

View File

@@ -119,7 +119,7 @@
<h2 class="mb-4">Frequently Asked Questions</h2> <h2 class="mb-4">Frequently Asked Questions</h2>
<div id="frequently-asked-questions"> <div id="frequently-asked-questions" class="divide-y-1">
<details> <details>
<summary>What are the benefits of <%= Danbooru.config.canonical_app_name %> Gold?</summary> <summary>What are the benefits of <%= Danbooru.config.canonical_app_name %> Gold?</summary>