mirrors/PairDrop
1
0
Fork 0
mirror of https://github.com/schlagmichdoch/PairDrop.git synced 2025-04-21 23:36:17 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #212 from MontelAle/add-expanding-textarea

Browse source 
Resolves #202
This commit is contained in:
RobinLinus 2020-12-28 02:35:59 +01:00 • committed by GitHub
commit 516b4a0705
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/index.html
View file

@ -94,7 +94,7 @@
<x-background class="full center"> <x-background class="full center">
<x-paper shadow="2"> <x-paper shadow="2">
<h3>Send a Message</h3> <h3>Send a Message</h3>
<textarea id="textInput" placeholder="Send a message" autocomplete="off" autofocus></textarea> <div id="textInput" class="textareaElement" role="textbox" placeholder="Send a message" autocomplete="off" autofocus contenteditable></div>
<div class="row-reverse"> <div class="row-reverse">
<button class="button" type="submit" close>Send</button> <button class="button" type="submit" close>Send</button>
<a class="button" close>Cancel</a> <a class="button" close>Cancel</a>

13
client/scripts/ui.js
View file

@ -315,12 +315,19 @@ class SendTextDialog extends Dialog {
this._recipient = recipient; this._recipient = recipient;
this._handleShareTargetText(); this._handleShareTargetText();
this.show(); this.show();
this.$text.setSelectionRange(0, this.$text.value.length)
const range = document.createRange();
const sel = window.getSelection();
range.selectNodeContents(this.$text);
sel.removeAllRanges();
sel.addRange(range);
} }
_handleShareTargetText() { _handleShareTargetText() {
if (!window.shareTargetText) return; if (!window.shareTargetText) return;
this.$text.value = window.shareTargetText; this.$text.textContent = window.shareTargetText;
window.shareTargetText = ''; window.shareTargetText = '';
} }
@ -328,7 +335,7 @@ class SendTextDialog extends Dialog {
e.preventDefault(); e.preventDefault();
Events.fire('send-text', { Events.fire('send-text', {
to: this._recipient, to: this._recipient,
text: this.$text.value text: this.$text.textContent
}); });
} }
} }

13
client/styles.css
View file

@ -479,19 +479,22 @@ button::-moz-focus-inner {
/* Text Input */ /* Text Input */
textarea { .textareaElement {
width: 100%;
box-sizing: border-box; box-sizing: border-box;
border: none; border: none;
outline: none; outline: none;
padding: 16px 24px; padding: 16px 24px;
border-radius: 16px; border-radius: 16px;
margin: 8px 0; margin: 8px 0;
line-height: 16px;
font-size: 14px; font-size: 14px;
font-family: inherit; font-family: inherit;
resize: none;
background: #f1f3f4; background: #f1f3f4;
display: block;
overflow: auto;
resize: none;
min-height: 40px;
line-height: 16px;
max-height: 300px;
} }
@ -709,7 +712,7 @@ x-dialog x-paper {
background-color: var(--bg-color); background-color: var(--bg-color);
} }
textarea { .textareaElement {
color: var(--text-color); color: var(--text-color);
background-color: var(--bg-color-secondary); background-color: var(--bg-color-secondary);
} }