diff options
| -rw-r--r-- | locale/en_GB.json | 1 | ||||
| -rw-r--r-- | static/form.css | 32 | ||||
| -rw-r--r-- | templates/reply_form.php | 51 |
3 files changed, 45 insertions, 39 deletions
diff --git a/locale/en_GB.json b/locale/en_GB.json index ddb3a19..78fe221 100644 --- a/locale/en_GB.json +++ b/locale/en_GB.json @@ -85,6 +85,7 @@ "writeNote.attachments.remove.action": "Remove", "writeNote.attachments.altText.label": "Image description", "writeReply.label": "Write a reply", + "writeReply.placeholder": "What do you think about this?", "writeReply.action": "Reply", "followRequests.pageTitle": "Pending follow requests", "followRequests.accept.action": "Accept", diff --git a/static/form.css b/static/form.css index 8bcefde..b2435aa 100644 --- a/static/form.css +++ b/static/form.css @@ -60,8 +60,22 @@ form:not(.nopanel) { } } + &.noteReplyForm, &#writeNoteForm { - max-width: 100%; + details { + summary { + border: none; + border-radius: var(--border-radius); + margin: 0 0 var(--spacing-single) 0; + padding: var(--spacing-single) var(--spacing-double); + background-color: var(--clr-secondary); + font-weight: bold; + cursor: pointer; + } + &[open] summary { + margin-bottom: var(--spacing-single); + } + } .summaryAndContent { input:has(+ textarea) { @@ -76,20 +90,10 @@ form:not(.nopanel) { } } } + } - details { - summary { - border-radius: var(--border-radius); - margin-bottom: var(--spacing-single); - padding: var(--spacing-single) var(--spacing-double); - background-color: var(--clr-secondary); - font-weight: bold; - cursor: pointer; - } - &[open] summary { - margin-bottom: var(--spacing-single); - } - } + &#writeNoteForm { + max-width: 100%; .miniProfile { display: grid; diff --git a/templates/reply_form.php b/templates/reply_form.php index 1b9961e..6bc35dd 100644 --- a/templates/reply_form.php +++ b/templates/reply_form.php @@ -24,34 +24,35 @@ $selectedScope = $note->privacy->scope->value; <form class="noteReplyForm" id="replyForm-<?= $note->id ?>" _="on submit send toggle to previous <button.reply/> then wait 1s then trigger update on #liveTimelineUpdater on toggle or submit toggle @hidden" hidden hx-post="/fragment/note/<?= $note->id ?>/reply" hx-disabled-elt="find button" hx-swap="outerHTML"> - <div class="row"> + <div class="row summaryAndContent"> <label for="replyContent-<?= $note->id ?>"><?= __('writeReply.label') ?></label> - <textarea id="replyContent-<?= $note->id ?>" name="content" required autocomplete="off"></textarea> - </div> - <div class="row"> - <label for="replySummary-<?= $note->id ?>"><?= __('writeNote.summary.label') ?></label> <input type="text" id="replySummary-<?= $note->id ?>" name="summary" autocomplete="off" - value="<?= $summaryText ?>"> - </div> - <div class="row"> - <label class="standalone"><?= __('writeNote.mentions.label') ?></label> - <?php foreach (array_merge($note->mentions, [$note->author]) as $m) { - if ($m != $user?->actor) { - call_template('user_mention_pill', ['type' => 'user', 'actor' => $m]); - } - } ?> - <?php call_template('user_mention_pill'); ?> - </div> - <div class="row"> - <label for="replyScope-<?= $note->id ?>"><?= __('writeNote.scope.label') ?></label> - <select name="scope" id="replyScope-<?= $note->id ?>" required autocomplete="off"> - <?php foreach ($scopeOptions as $s): ?> - <option value="<?= $s ?>" <?= $selectedScope == $s ? 'selected' : '' ?>> - <?= __("note.privacy.scope.$s") ?> - </option> - <?php endforeach; ?> - </select> + value="<?= $summaryText ?>" placeholder="<?= __('writeNote.summary.label') ?>"> + <textarea id="replyContent-<?= $note->id ?>" name="content" required autocomplete="off" + placeholder="<?= __('writeReply.placeholder') ?>"></textarea> </div> + <details> + <summary><?= __('writeNote.moreOptions') ?></summary> + <div class="row"> + <label class="standalone"><?= __('writeNote.mentions.label') ?></label> + <?php foreach (array_merge($note->mentions, [$note->author]) as $m) { + if ($m != $user?->actor) { + call_template('user_mention_pill', ['type' => 'user', 'actor' => $m]); + } + } ?> + <?php call_template('user_mention_pill'); ?> + </div> + <div class="row"> + <label for="replyScope-<?= $note->id ?>"><?= __('writeNote.scope.label') ?></label> + <select name="scope" id="replyScope-<?= $note->id ?>" required autocomplete="off"> + <?php foreach ($scopeOptions as $s): ?> + <option value="<?= $s ?>" <?= $selectedScope == $s ? 'selected' : '' ?>> + <?= __("note.privacy.scope.$s") ?> + </option> + <?php endforeach; ?> + </select> + </div> + </details> <div class="row"> <button class="primary"><?= __('writeReply.action') ?></button> </div> |