Apply Bootstrap cards to the Transaction Details pages

apps/explorer_web/lib/explorer_web/templates/transaction/overview.html.eex

@@ -1,7 +1,10 @@
-<h1><%= gettext "Transaction Details" %></h1>
-<p data-test="transaction_detail_hash"><%= @transaction %></p>
-<div class="panels container__subsection">
-  <div class="panels__container row">
+<section>
+  <h1><%= gettext "Transaction Details" %></h1>
+  <p data-test="transaction_detail_hash"><%= @transaction %></p>
+
+  <div class="card mb-3">
+    <div class="card-body">
+      <div class="row">
         <div class="col-md-6">
           <table class="table table-font table-responsive-sm table-horizontal">
             <tbody>
@@ -157,4 +160,6 @@
           </table>
         </div>
       </div>
-</div>
+    </div>
+  </div>
+</section>

apps/explorer_web/lib/explorer_web/templates/transaction_internal_transaction/index.html.eex

@@ -1,6 +1,8 @@
-<section class="container__section">
+<section class="container-fluid">
+
   <%= render ExplorerWeb.TransactionView, "overview.html", assigns %>
-  <div>
+
+  <section>
     <ul class="nav nav-tabs">
       <li class="nav-item">
         <%= link(
@@ -18,9 +20,8 @@
             ) %>
       </li>
     </ul>
-  </div>
-  <div class="panels container__subsection">
-    <div class="panels__container">
+    <div class="card">
+      <div class="card-body">
         <%= if length(@internal_transactions.entries) > 0 do %>
           <table class="table table-responsive-sm table-font">
             <thead>
@@ -51,4 +52,5 @@
         <% end %>
       </div>
     </div>
+  </section>
 </section>

apps/explorer_web/lib/explorer_web/templates/transaction_log/index.html.eex

@@ -1,6 +1,8 @@
-<section class="container__section">
+<section class="container-fluid">
+
   <%= render ExplorerWeb.TransactionView, "overview.html", assigns %>
-  <div>
+
+  <section>
     <ul class="nav nav-tabs">
       <li class="nav-item">
         <%= link(
@@ -17,9 +19,8 @@
             ) %>
       </li>
     </ul>
-  </div>
-  <div class="panels container__subsection">
-    <div class="panels__container">
+    <div class="card">
+      <div class="card-body">
         <%= if length(@logs.entries) > 0 do %>
           <table class="table table-responsive-sm table-font">
             <thead>
@@ -65,4 +66,5 @@
         <% end %>
       </div>
     </div>
+  </section>
 </section>