This commit is contained in:
2021-11-19 22:06:30 +03:00
parent d5d20afa59
commit 5daadad67f
5 changed files with 63 additions and 85 deletions
+59
View File
@@ -1,3 +1,62 @@
.toast {
width: 350px;
max-width: 100%;
font-size: 0.875rem;
pointer-events: auto;
background-color: rgba(255, 255, 255, 0.85);
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
border-radius: 0.25rem;
}
.toast.showing {
opacity: 0;
}
.toast:not(.show) {
display: none;
}
.toast-container {
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
max-width: 100%;
pointer-events: none;
}
.toast-container > :not(:last-child) {
margin-bottom: 0.75rem;
}
.toast-title {
margin-right: auto;
}
.toast-desc {}
.toast-icon {
margin-right: 0.5em;
max-width: 1.5em;
max-height: 1.5em;
}
.toast-header {
display: flex;
align-items: center;
padding: 0.5rem 0.75rem;
color: #6c757d;
background-color: rgba(255, 255, 255, 0.85);
background-clip: padding-box;
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
border-top-left-radius: calc(0.25rem - 1px);
border-top-right-radius: calc(0.25rem - 1px);
}
.toast-header .btn-close {
margin-right: -0.375rem;
margin-left: 0.75rem;
}
.toast-body {
padding: 0.75rem;
word-wrap: break-word;
}
.toast-container--default {
z-index: 10000;
+2 -2
View File
@@ -13,7 +13,7 @@ kit.PluginManager.register('bsToastService', function(module, exports, require,
delay: 4000,
};
this.closeTemplate = '<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Закрыть"/>';
this.iconTemplate = '<svg class="bd-placeholder-img rounded me-2" width="20" height="20" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" preserveAspectRatio="xMidYMid slice" focusable="false"><rect width="100%" height="100%" fill="#007aff"/></svg>';
this.iconTemplate = '<svg width="20" height="20" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" preserveAspectRatio="xMidYMid slice" focusable="false"><rect width="100%" height="100%" fill="#007aff"/></svg>';
/**
* @type {HTMLElement}
*/
@@ -45,7 +45,7 @@ kit.PluginManager.register('bsToastService', function(module, exports, require,
Service.prototype.getToastNode = function (title, message, desc = '') {
var closeTemplate = this.close?this.closeTemplate:'';
var toastTemplate = '<div class="toast fade hide" role="alert" aria-live="assertive" aria-atomic="true"><div class="toast-header"><div class="toast-icon">'+this.iconTemplate+'</div><strong class="toast-title">'+title+'</strong><small class="toast-desc">' + desc+ '</small>'+closeTemplate+'</div><div class="toast-body">'+message+'</div></div>';
var toastTemplate = '<div class="toast fade hide" role="alert" aria-live="assertive" aria-atomic="true"><div class="toast-header"><div class="kit-icon toast-icon">'+this.iconTemplate+'</div><strong class="toast-title">'+title+'</strong><small class="toast-desc">' + desc+ '</small>'+closeTemplate+'</div><div class="toast-body">'+message+'</div></div>';
return support.makeNode(toastTemplate);
};