another patch for textarea misalignment bug

This commit is contained in:
Ro 2022-01-13 15:43:38 -08:00
parent 10081c4323
commit f1a8ef67bc
5 changed files with 8359 additions and 11 deletions

View file

@ -32,7 +32,7 @@
{% endblock %} {% endblock %}
{% block stylesheets %} {% block stylesheets %}
<link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=cvbn"> <link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=cvbupoyn">
{% endblock %} {% endblock %}
{% block mainContent %} {% block mainContent %}

View file

@ -3194,16 +3194,12 @@ select {
width: 100%; width: 100%;
max-width: 900px; max-width: 900px;
border-radius: 5px; border-radius: 5px;
margin: 10px 0 50px 0;
position: relative; position: relative;
} }
#post-edit-index #post-edit-index-wrapper #edit-post #edit-post-wrapper textarea:focus { #post-edit-index #post-edit-index-wrapper #edit-post #edit-post-wrapper textarea:focus {
outline: none; outline: none;
border-color: #fc6399; border-color: #fc6399;
} }
#post-edit-index #post-edit-index-wrapper #edit-post #edit-post-wrapper #edit {
overflow: hidden !important;
}
#post-edit-index #post-edit-index-wrapper #edit-post #edit-post-wrapper #edit, #post-edit-index #post-edit-index-wrapper #edit-post #edit-post-wrapper #highlight { #post-edit-index #post-edit-index-wrapper #edit-post #edit-post-wrapper #edit, #post-edit-index #post-edit-index-wrapper #edit-post #edit-post-wrapper #highlight {
/* Both elements need the same text and space styling so they are directly on top of each other */ /* Both elements need the same text and space styling so they are directly on top of each other */
border: 0; border: 0;

File diff suppressed because one or more lines are too long

View file

@ -19,6 +19,7 @@ class TextEditor extends EventEmitter {
document.getElementById("edit").addEventListener("input", (e) => { document.getElementById("edit").addEventListener("input", (e) => {
let result_element = document.querySelector("#highlight-content"); let result_element = document.querySelector("#highlight-content");
this.textEditor = textEditor; this.textEditor = textEditor;
// Update code // Update code
let text = e.target.value; let text = e.target.value;
result_element.innerHTML = text result_element.innerHTML = text
@ -27,7 +28,7 @@ class TextEditor extends EventEmitter {
let editorHeight = document.getElementById("highlight").offsetHeight; let editorHeight = document.getElementById("highlight").offsetHeight;
document.getElementById("edit-post-wrapper").style.height = document.getElementById("edit-post-wrapper").style.height =
editorHeight + "px"; editorHeight + "px";
e.target.style.height = editorHeight + "px"; e.target.style.height = editorHeight + 30 + "px"; //TODO: yeah, it's ugly but it works for now, fix soon
// Syntax Highlight // Syntax Highlight
Prism.highlightElement(result_element); Prism.highlightElement(result_element);
}); });
@ -92,7 +93,7 @@ class TextEditor extends EventEmitter {
let len = this.textEditor.value.length; let len = this.textEditor.value.length;
let start = this.textEditor.selectionStart; let start = this.textEditor.selectionStart;
let end = this.textEditor.selectionEnd; let end = this.textEditor.selectionEnd;
let insert = "![image alt text](" + data + " 'image title')"; let insert = "![image alt text](" + data + ")";
this.textEditor.value = this.textEditor.value =
this.textEditor.value.substring(0, start) + this.textEditor.value.substring(0, start) +

View file

@ -304,7 +304,7 @@
max-width: 900px max-width: 900px
border-radius: 5px border-radius: 5px
//background $primary - 10% //background $primary - 10%
margin: 10px 0 50px 0 //margin: 10px 0 50px 0
position: relative position: relative
//editor sometimes scrolls throwing it all out of wack //editor sometimes scrolls throwing it all out of wack
//turning of scrolling keeps it aligned //turning of scrolling keeps it aligned
@ -313,7 +313,7 @@
border-color: $highlight border-color: $highlight
#edit #edit
overflow: hidden !important // overflow: hidden !important
#edit, #highlight #edit, #highlight
/* Both elements need the same text and space styling so they are directly on top of each other */ /* Both elements need the same text and space styling so they are directly on top of each other */
//margin: 10px //margin: 10px