reordoring

app/views/notification/index.html.erb

@@ -1,8 +1,26 @@
 <div>
-  <h1 class="font-bold text-4xl">Try out our Toaster Flash rendering</h1>
+  <h1 class="font-bold text-4xl">Try out our Rails 8 Flash rendering</h1>
 </div>
 
-<div>
+<section>
+  <h2 class="text-bold text-2xl">By using <span class="italic">stimulus</span></h2>
+  <ul class="flex flex-row list bg-base-100 rounded-box shadow-md">
+    <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
+      <%= link_to 'Notice', "javascript: window.dispatchEvent(new CustomEvent('popup-toast', {detail: {
+        type: 'notice',
+        message: 'this is a message from Stimulus'
+      }}))", class: 'btn btn-primary'%>
+    </li>
+    <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
+      <%= link_to 'Alert', "javascript: window.dispatchEvent(new CustomEvent('popup-toast', {detail: {
+        type: 'alert',
+        message: 'this is an alert'
+      }}))", class: 'btn btn-secondary'%>
+    </li>
+  </ul>
+</section>
+
+<section>
   <h2 class="text-bold text-2xl">By using <span class="italic">redirect_to</span></h2>
   <ul class="flex flex-row list bg-base-100 rounded-box shadow-md">
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
@@ -18,25 +36,7 @@
       <%= link_to 'Alert ++', notification_show_alert_path({multiple: true}), class: 'btn btn-secondary'%>
     </li>
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Nothing', notification_index_path, class: 'btn btn-accent btn-outline'%>
-    </li>
-  </ul>
-</div>
-
-<div>
-  <h2 class="text-bold text-2xl">By using <span class="italic">stimulus</span></h2>
-  <ul class="flex flex-row list bg-base-100 rounded-box shadow-md">
-    <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Notice', "javascript: window.dispatchEvent(new CustomEvent('popup-toast', {detail: {
-        type: 'notice',
-        message: 'this is a message from Stimulus'
-      }}))", class: 'btn btn-primary'%>
-    </li>
-    <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Alert', "javascript: window.dispatchEvent(new CustomEvent('popup-toast', {detail: {
-        type: 'alert',
-        message: 'this is an alert'
-      }}))", class: 'btn btn-secondary'%>
+      <%= link_to 'None', notification_index_path, class: 'btn btn-accent btn-outline'%>
     </li>
   </ul>
-</div>
+</section>