Snackbar / Toast
-Snackbars are often used as a tooltips/popups to show a message at the bottom of the screen.
-Click on the button to show the snackbar. It will disappear after 3 seconds.
- - - -diff --git a/app/views/layouts/_notification.html.erb b/app/views/layouts/_notification.html.erb index af3e5f0..4edb1bb 100644 --- a/app/views/layouts/_notification.html.erb +++ b/app/views/layouts/_notification.html.erb @@ -9,8 +9,8 @@ offset: { y: '1em' }, close: true } - const notice={ className: 'toastify-notice text-black', ...common } - const alert={ className: 'text-black toastify-alert', ...common } + const notice={ className: 'toastify-notice', ...common } + const alert={ className: 'toastify-alert', ...common } <% if flash.notice%> Toastify({ text: '<%=flash.notice%>', ...notice}).showToast(); diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 15217e2..002dca7 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -19,7 +19,7 @@
- <%=render '/layouts/notification' %> + <%=render 'layouts/notification' %>Snackbars are often used as a tooltips/popups to show a message at the bottom of the screen.
-Click on the button to show the snackbar. It will disappear after 3 seconds.
- - - -