Tabs on table page

app/assets/stylesheets/tables.css

@@ -0,0 +1,30 @@
+#table-content{
+  padding: 1em;
+  background-color: var(--inset-bg-color);
+  border: 1px solid #000;
+  z-index: 1;
+}
+
+.table-tabs {
+  ul {
+    margin: 0;
+  }
+  li {
+    list-style-type: none;
+    display: inline;
+    a:link, a:visited {
+      color: inherit;
+      text-decoration: none;
+      background-color: var(--inset-bg-color);
+      padding: .5em 1em;
+      border: 1px solid black;
+      position: relative;
+      top: 1px;
+    }
+    a:link.active, a:visited.active {
+      display: inline-block;
+  z-index: 1000;
+      border-bottom: none;
+    }
+  }
+}

app/views/layouts/table.html.erb

@@ -1,12 +1,13 @@
 <% content_for :submenu do %>
   <h2><%= @table.name %></h2>
-  <nav>
+  <nav class="table-tabs">
     <ul>
-      <li><%= link_to t(".overview"), @table %></li>
+      <li><%= link_to t(".overview"), @table, class: class_names(active: params[:controller] == "tables") %></li>
       <% @characters.each do |character| %>
-        <li><%= link_to character.name, table_character_character_sheet_sections_path(@table, character) %></li>
+        <li><%= link_to character.name, table_character_character_sheet_sections_path(@table, character),
+                class: class_names(active: params[:controller] == "character_sheet_sections") %></li>
       <% end %>
-      <li><%= link_to t(".events"), table_events_path(@table) %></li>
+      <li><%= link_to t(".events"), table_events_path(@table), class: class_names(active: params[:controller] == "events") %></li>
     </ul>
   </nav>
 <% end %>