Improve notifications, fix styles not being added
All checks were successful
continuous-integration/drone/push Build is passing

Based on https://petr.codes/blog/rails/modern-rails-flash-messages/part-3/
This commit is contained in:
2022-02-21 11:03:43 -06:00
parent 8102fa1230
commit 7d66b75216
11 changed files with 214 additions and 58 deletions

View File

@@ -66,15 +66,15 @@
</div>
</nav>
<%= yield %>
</div>
<div id="wrapper">
<% flash.each do |type, msg| %>
<div class="flash-msg <%= type %>">
<p><%= msg %></p>
<div class="fixed inset-0 px-4 py-6 pointer-events-none sm:px-6 sm:py-4 sm:items-start sm:justify-end">
<div class="flex flex-col items-end justify-center">
<% flash.each do |type, data| %>
<%= render NotificationComponent.new(type: type, data: data) %>
<% end %>
</div>
<% end %>
</div>
<%= yield %>
</div>
</body>
</html>

View File

@@ -57,16 +57,14 @@
</div>
<div class="mt-3 px-2 space-y-1">
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-gray-400 hover:text-white hover:bg-gray-700">Your Profile</a>
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-gray-400 hover:text-white hover:bg-gray-700">Settings</a>
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-gray-400 hover:text-white hover:bg-gray-700">Sign out</a>
</div>
</div>
</div>
</nav>
<div class="fixed inset-0 px-4 py-6 pointer-events-none sm:p-6 sm:items-start sm:justify-end">
<div class="fixed inset-0 px-4 py-6 pointer-events-none sm:px-6 sm:py-4 sm:items-start sm:justify-end">
<div class="flex flex-col items-end justify-center">
<% flash.each do |type, data| %>
<%= render NotificationComponent.new(type: type, data: data) %>