langfingaz/anki
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make #fields display correctly

Browse Source
This commit is contained in:
Henrik Giesel 2021-01-26 23:15:11 +01:00
parent e481452114
commit 520c4a3b4d
2 changed files with 29 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
qt/aqt/data/web/css/editor.scss
View File

@ -1,6 +1,12 @@
/* Copyright: Ankitects Pty Ltd and contributors
* License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
#fields {
display: flex;
flex-direction: column;
margin: 5px;
}
.field {
border: 1px solid var(--border);
background: var(--frame-bg);

33
qt/aqt/data/web/js/editor.ts
View File

@ -118,7 +118,14 @@ function nodeIsText(node: Node): node is Text {
}
function nodeIsInline(node: Node): boolean {
return nodeIsText(node) || nodeIsBRElement(node) || window.getComputedStyle(node as Element).getPropertyValue("display").startsWith("inline");
return (
nodeIsText(node) ||
nodeIsBRElement(node) ||
window
.getComputedStyle(node as Element)
.getPropertyValue("display")
.startsWith("inline")
);
}
function inListItem(): boolean {
@ -308,10 +315,11 @@ function saveField(type: "blur" | "key"): void {
return;
}
const fieldText = fieldIsInInlineMode(currentField) && currentField.innerHTML.endsWith("<br>")
// trim trailing <br>
? currentField.innerHTML.slice(0, -4)
: currentField.innerHTML
const fieldText =
fieldIsInInlineMode(currentField) && currentField.innerHTML.endsWith("<br>")
? // trim trailing <br>
currentField.innerHTML.slice(0, -4)
: currentField.innerHTML;
pycmd(`${type}:${currentFieldOrdinal()}:${currentNoteId}:${fieldText}`);
}
@ -387,7 +395,12 @@ function onCutOrCopy(): boolean {
return true;
}
function createField(index: number, label: string, color: string, content: string): [HTMLDivElement, HTMLDivElement] {
function createField(
index: number,
label: string,
color: string,
content: string
): [HTMLDivElement, HTMLDivElement] {
const name = document.createElement("div");
name.id = `name${index}`;
name.className = "fname";
@ -426,11 +439,11 @@ function setFields(fields: [string, string][]): void {
.getComputedStyle(document.documentElement)
.getPropertyValue("--text-fg");
const elements = fields.flatMap(
([name, fieldcontent], index: number) => createField(index, name, color, fieldcontent)
)
const elements = fields.flatMap(([name, fieldcontent], index: number) =>
createField(index, name, color, fieldcontent)
);
const fieldsContainer = document.getElementById("fields")
const fieldsContainer = document.getElementById("fields");
// can be replaced with ParentNode.replaceChildren in Chrome 86+
while (fieldsContainer.firstChild) {
fieldsContainer.removeChild(fieldsContainer.firstChild);