feat(ui): add navigation layout and basic styling

Implement foundational UI components including navigation bar, CSS styling, and improved rankings page. Changes: - Add navigation bar with links to Rankings, Profile, Schedule, Admin - Add comprehensive CSS styling for tables, forms, buttons, alerts - Improve rankings page with profile links - Support conditional navigation based on authentication status
2026-03-27 12:24:59 -07:00
parent 5bb3bc4e5f
commit f88c1f5a7f
3 changed files with 546 additions and 3 deletions
@@ -3,12 +3,38 @@
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Euchre camp</title>
+    <title>EuchreCamp</title>
    <%= favicon_tag %>
    <%= stylesheet_tag "app" %>
  </head>
  <body>
-    <%= yield %>
+    <nav class="main-nav">
+      <div class="nav-brand">
+        <a href="/">EuchreCamp</a>
+      </div>
+      <div class="nav-links">
+        <a href="/rankings">Rankings</a>
+        <% if defined?(current_player) && current_player %>
+          <a href="/players/<%= current_player.id %>/profile">My Profile</a>
+          <a href="/players/<%= current_player.id %>/schedule">My Schedule</a>
+          <% if current_player.respond_to?(:admin?) && current_player.admin? %>
+            <a href="/admin">Admin</a>
+          <% end %>
+        <% end %>
+      </div>
+      <div class="nav-user">
+        <% if defined?(current_player) && current_player %>
+          <span><%= current_player.name %></span>
+          <a href="/logout">Logout</a>
+        <% else %>
+          <a href="/login">Login</a>
+          <a href="/register">Register</a>
+        <% end %>
+      </div>
+    </nav>
+    <main class="main-content">
+      <%= yield %>
+    </main>
    <%= javascript_tag "app" %>
  </body>
 </html>
@@ -8,6 +8,7 @@
        <th>Player</th>
        <th>Elo Rating</th>
        <th>Original Rating</th>
+        <th>Actions</th>
      </tr>
    </thead>
    <tbody>
@@ -17,6 +18,9 @@
          <td><%= player.name %></td>
          <td><strong><%= player.current_elo %></strong></td>
          <td><%= player.rating %></td>
+          <td>
+            <a href="/players/<%= player.id %>/profile">Profile</a>
+          </td>
        </tr>
      <% end %>
    </tbody>