diff --git a/public/index.html b/public/index.html index 6353d8fb3..a261edf20 100644 --- a/public/index.html +++ b/public/index.html @@ -7,6 +7,7 @@ PrimeVUE +
diff --git a/src/AppMenu.vue b/src/AppMenu.vue index 61fa16d0f..161101f99 100644 --- a/src/AppMenu.vue +++ b/src/AppMenu.vue @@ -129,7 +129,8 @@
- ● Link + ● Message + ● Toast
diff --git a/src/assets/styles/primevue.css b/src/assets/styles/primevue.css index 8a176552c..30b8347ff 100644 --- a/src/assets/styles/primevue.css +++ b/src/assets/styles/primevue.css @@ -11,6 +11,7 @@ @import '../../components/inputtext/InputText.css'; @import '../../components/inputswitch/InputSwitch.css'; @import '../../components/listbox/Listbox.css'; +@import '../../components/message/Message.css'; @import '../../components/multiselect/MultiSelect.css'; @import '../../components/overlaypanel/OverlayPanel.css'; @import '../../components/panel/Panel.css'; diff --git a/src/components/message/Message.css b/src/components/message/Message.css new file mode 100644 index 000000000..d021ac8d6 --- /dev/null +++ b/src/components/message/Message.css @@ -0,0 +1,27 @@ +.p-messages-wrapper { + padding: 1em; + position: relative; +} + +.p-messages-icon-container, +.p-messages-close-container { + flex-basis: auto; + flex-grow: 0; + flex-shrink: 0; +} + +.p-messages-text { + display: inline-block; + vertical-align: middle; +} + +.p-messages-icon { + padding: 0; + margin-right: .25em; + vertical-align: middle; +} + +.p-messages .p-messages-summary { + font-weight: bold; + margin-right: .25em; +} \ No newline at end of file diff --git a/src/components/message/Message.vue b/src/components/message/Message.vue new file mode 100644 index 000000000..47154023b --- /dev/null +++ b/src/components/message/Message.vue @@ -0,0 +1,55 @@ + + + + + diff --git a/src/main.js b/src/main.js index d511948e2..d9325c52c 100644 --- a/src/main.js +++ b/src/main.js @@ -16,8 +16,9 @@ import FullCalendar from './components/fullcalendar/FullCalendar'; import InputSwitch from './components/inputswitch/InputSwitch'; import InputText from './components/inputtext/InputText'; import Fieldset from './components/fieldset/Fieldset'; -import MultiSelect from './components/multiselect/MultiSelect'; import Listbox from './components/listbox/Listbox'; +import Message from './components/message/Message'; +import MultiSelect from './components/multiselect/MultiSelect'; import OverlayPanel from './components/overlaypanel/OverlayPanel'; import Panel from './components/panel/Panel'; import Password from './components/password/Password'; @@ -57,6 +58,7 @@ Vue.component('InputSwitch', InputSwitch); Vue.component('InputText', InputText); Vue.component('Listbox', Listbox); Vue.component('Fieldset', Fieldset); +Vue.component('Message', Message); Vue.component('MultiSelect', MultiSelect); Vue.component('OverlayPanel', OverlayPanel); Vue.component('Panel', Panel); diff --git a/src/router.js b/src/router.js index c0257b330..6eb586a0f 100644 --- a/src/router.js +++ b/src/router.js @@ -131,6 +131,11 @@ export default new Router({ name: 'listbox', component: () => import('./views/listbox/ListboxDemo.vue') }, + { + path: '/message', + name: 'message', + component: () => import('./views/message/MessageDemo.vue') + }, { path: '/multiselect', name: 'multiselect', diff --git a/src/views/flexgrid/FlexGridDemo.vue b/src/views/flexgrid/FlexGridDemo.vue index bc300e98e..869075867 100644 --- a/src/views/flexgrid/FlexGridDemo.vue +++ b/src/views/flexgrid/FlexGridDemo.vue @@ -23,8 +23,8 @@

Dynamic

- - +