diff options
Diffstat (limited to 'day9/task5_vue/src/components/PopupMessage.vue')
| -rw-r--r-- | day9/task5_vue/src/components/PopupMessage.vue | 20 |
1 files changed, 16 insertions, 4 deletions
diff --git a/day9/task5_vue/src/components/PopupMessage.vue b/day9/task5_vue/src/components/PopupMessage.vue index a905b4d..90e28da 100644 --- a/day9/task5_vue/src/components/PopupMessage.vue +++ b/day9/task5_vue/src/components/PopupMessage.vue @@ -1,19 +1,23 @@ <template> - <div ref="container" class="popupContainer"> - {{ message }} + <div + ref="container" class="popupContainer" + v-bind:class="{ + 'type-success': data.type === 'success', + 'type-failure': data.type === 'failure' + }"> + {{ data.msg }} </div> </template> <script> export default { name: "PopupMessage", - props: ['message'], + props: ['message', 'data'], } </script> <style scoped> .popupContainer { - background-color: #00ff5e; padding: 30px; font-size: 30px; @@ -25,4 +29,12 @@ left: 0; right: 0; } + + .type-success { + background-color: #00ff5e; + } + + .type-failure { + background-color: #ff002d; + } </style>
\ No newline at end of file |