Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-18 03:00:41 +01:00
Code Issues Packages Projects Releases Activity

feat(toast): improve layout for toasts without title

Browse Source
This commit is contained in:
Elian Doran
2025-09-24 22:40:03 +03:00
parent 120324c3f0
commit 15f344fe4a
3 changed files with 63 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
apps/client/src/services/toast.ts
View File

@@ -4,7 +4,7 @@ import utils from "./utils.js";
export interface ToastOptions {
id?: string;
icon: string;
title: string;
title?: string;
message: string;
delay?: number;
autohide?: boolean;
@@ -12,20 +12,32 @@ export interface ToastOptions {
}
function toast(options: ToastOptions) {
const $toast = $(
`<div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<strong class="me-auto">
const $toast = $(options.title
? `\
<div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<strong class="me-auto">
<span class="bx bx-${options.icon}"></span>
<span class="toast-title"></span>
</strong>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body"></div>
</div>`
: `
<div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-icon">
<span class="bx bx-${options.icon}"></span>
<span class="toast-title"></span>
</strong>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body"></div>
</div>`
</div>
<div class="toast-body"></div>
<div class="toast-header">
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
</div>`
);
$toast.find(".toast-title").text(options.title);
$toast.toggleClass("no-title", !options.title);
$toast.find(".toast-title").text(options.title ?? "");
$toast.find(".toast-body").html(options.message);
if (options.id) {