1
1
mirror of https://github.com/Fabio286/antares.git synced 2025-06-05 21:59:22 +02:00

refactor: changed material design icon pack

This commit is contained in:
2020-08-12 10:48:18 +02:00
parent 7651d05b37
commit 5473858323
25 changed files with 119 additions and 125 deletions

View File

@ -1,14 +1,15 @@
<template>
<div class="toast mt-2" :class="notificationStatus.className">
<span class="p-vcentered text-left" :class="{'expanded': isExpanded}">
<i class="material-icons mr-1">{{ notificationStatus.iconName }}</i>
<i class="mdi mdi-24px mr-2" :class="notificationStatus.iconName" />
<span class="notification-message">{{ message }}</span>
</span>
<i
v-if="isExpandable"
class="material-icons c-hand"
class="mdi mdi-24px c-hand expand-btn"
:class="isExpanded ? 'mdi-chevron-up' : 'mdi-chevron-down'"
@click="toggleExpand"
>{{ isExpanded ? 'expand_less' : 'expand_more' }}</i>
/>
<button class="btn btn-clear ml-2" @click="hideToast" />
</div>
</template>
@ -38,19 +39,19 @@ export default {
switch (this.status) {
case 'success':
className = 'toast-success';
iconName = 'done';
iconName = 'mdi-check';
break;
case 'error':
className = 'toast-error';
iconName = 'error';
iconName = 'mdi-alert-rhombus';
break;
case 'warning':
className = 'toast-warning';
iconName = 'warning';
iconName = 'mdi-alert';
break;
case 'primary':
className = 'toast-primary';
iconName = 'info_outline';
iconName = 'mdi-information-outline';
break;
}
@ -88,6 +89,10 @@ export default {
max-width: 30rem;
}
.expand-btn {
align-items: initial;
}
.expanded .notification-message {
white-space: initial;
}