This commit is contained in:
Vanessa 2023-03-24 10:01:48 +08:00
parent 7e5058690e
commit 8a73e08acd
5 changed files with 16 additions and 24 deletions

View file

@ -57,6 +57,10 @@
text-align: left; text-align: left;
display: inline-block; display: inline-block;
&--close {
padding-right: 27px;
}
a { a {
color: var(--b3-theme-on-primary); color: var(--b3-theme-on-primary);
text-decoration: underline; text-decoration: underline;
@ -70,18 +74,16 @@
&__close { &__close {
position: absolute; position: absolute;
cursor: pointer; cursor: pointer;
top: 10px; height: 16px;
right: 1px; width: 16px;
height: 8px; color: var(--b3-theme-on-primary);
width: 8px;
padding: 4px;
border-radius: 10px;
color: var(--b3-theme-background-light);
transition: var(--b3-transition); transition: var(--b3-transition);
opacity: .68;
right: 5px;
top: 10px;
&:hover { &:hover {
color: var(--b3-theme-on-background); opacity: 1;
background-color: var(--b3-theme-background-light);
} }
} }
} }

View file

@ -271,16 +271,6 @@
padding: 4px; padding: 4px;
height: 32px; height: 32px;
} }
&.keyboard__svg--close {
height: 12px;
background-color: var(--b3-theme-on-surface-light);
width: 12px;
padding: 4px;
border-radius: 10px;
margin: 10px;
color: var(--b3-theme-on-primary);
}
} }
} }
} }

View file

@ -32,7 +32,7 @@ export const showMessage = (message: string, timeout = 6000, type = "info", mess
const existElement = messagesElement.querySelector(`.b3-snackbar[data-id="${id}"]`); const existElement = messagesElement.querySelector(`.b3-snackbar[data-id="${id}"]`);
if (existElement) { if (existElement) {
window.clearTimeout(parseInt(existElement.getAttribute("data-timeoutid"))); window.clearTimeout(parseInt(existElement.getAttribute("data-timeoutid")));
existElement.innerHTML = `<div class="b3-snackbar__content">${message}</div>${timeout === 0 ? '<svg class="b3-snackbar__close"><use xlink:href="#iconClose"></use></svg>' : ""}`; existElement.innerHTML = `<div class="b3-snackbar__content${timeout === 0 ? " b3-snackbar__content--close" : ""}">${message}</div>${timeout === 0 ? '<svg class="b3-snackbar__close"><use xlink:href="#iconCloseRound"></use></svg>' : ""}`;
if (type === "error") { if (type === "error") {
existElement.classList.add("b3-snackbar--error"); existElement.classList.add("b3-snackbar--error");
} else { } else {
@ -46,9 +46,9 @@ export const showMessage = (message: string, timeout = 6000, type = "info", mess
} }
return; return;
} }
let messageHTML = `<div data-id="${id}" class="b3-snackbar--hide b3-snackbar${type === "error" ? " b3-snackbar--error" : ""}"><div class="b3-snackbar__content">${message}</div>`; let messageHTML = `<div data-id="${id}" class="b3-snackbar--hide b3-snackbar${type === "error" ? " b3-snackbar--error" : ""}"><div class="b3-snackbar__content${timeout === 0 ? " b3-snackbar__content--close" : ""}">${message}</div>`;
if (timeout === 0) { if (timeout === 0) {
messageHTML += '<svg class="b3-snackbar__close"><use xlink:href="#iconClose"></use></svg>'; messageHTML += '<svg class="b3-snackbar__close"><use xlink:href="#iconCloseRound"></use></svg>';
} else if (timeout !== -1) { // -1 时需等待请求完成后手动关闭 } else if (timeout !== -1) { // -1 时需等待请求完成后手动关闭
const timeoutId = window.setTimeout(() => { const timeoutId = window.setTimeout(() => {
hideMessage(id); hideMessage(id);

View file

@ -103,7 +103,7 @@ class App {
downloadProgress(data.data); downloadProgress(data.data);
break; break;
case "txerr": case "txerr":
transactionError(data); transactionError();
break; break;
case "syncing": case "syncing":
processSync(data); processSync(data);

View file

@ -192,7 +192,7 @@ export const initKeyboardToolbar = () => {
<button class="keyboard__action" data-type="tag"><svg><use xlink:href="#iconTags"></use></svg></button> <button class="keyboard__action" data-type="tag"><svg><use xlink:href="#iconTags"></use></svg></button>
<button class="keyboard__action" data-type="inline-math"><svg><use xlink:href="#iconMath"></use></svg></button> <button class="keyboard__action" data-type="inline-math"><svg><use xlink:href="#iconMath"></use></svg></button>
<button class="keyboard__action" data-type="inline-memo"><svg><use xlink:href="#iconM"></use></svg></button> <button class="keyboard__action" data-type="inline-memo"><svg><use xlink:href="#iconM"></use></svg></button>
<button class="keyboard__action" data-type="goback"><svg class="keyboard__svg--close"><use xlink:href="#iconClose"></use></svg></button> <button class="keyboard__action" data-type="goback"><svg><use xlink:href="#iconCloseRound"></use></svg></button>
</div> </div>
</div> </div>
<span class="keyboard__split"></span> <span class="keyboard__split"></span>