RanchiMall/standard-ui
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UX improvement

Browse Source
This commit is contained in:
sairaj mote 2023-09-27 15:56:30 +05:30
parent 8df848271d
commit 97e823801d
2 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
components/dist/notifications.js vendored
View File

@ -125,6 +125,9 @@ smNotifications.innerHTML = `
cursor: pointer; cursor: pointer;
} }
@media screen and (max-width: 640px){ @media screen and (max-width: 640px){
.close{
display: none;
}
.notification-panel:not(:empty){ .notification-panel:not(:empty){
padding-bottom: 3rem; padding-bottom: 3rem;
} }
@ -220,17 +223,17 @@ customElements.define('sm-notifications', class extends HTMLElement {
${icon ? `<div class="icon-container">${icon}</div>` : ''} ${icon ? `<div class="icon-container">${icon}</div>` : ''}
<output>${message}</output> <output>${message}</output>
${action ? `<button class="action">${action.label}</button>` : ''} ${action ? `<button class="action">${action.label}</button>` : ''}
${pinned ? `<button class="close"> <button class="close">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z"/></svg> <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z"/></svg>
</button>` : ''} </button>
`; `;
if (action) { if (action) {
notification.querySelector('.action').addEventListener('click', action.callback) notification.querySelector('.action').addEventListener('click', action.callback)
} }
notification.querySelector('.close').addEventListener('click', () => {
this.removeNotification(notification);
});
if (pinned) { if (pinned) {
notification.querySelector('.close').addEventListener('click', () => {
this.removeNotification(notification);
});
} else { } else {
setTimeout(() => { setTimeout(() => {
this.removeNotification(notification, this.isBigViewport ? 'left' : 'top'); this.removeNotification(notification, this.isBigViewport ? 'left' : 'top');

2
components/dist/notifications.min.js vendored
View File

File diff suppressed because one or more lines are too long