Adiciona parte visual estatica do card, navbar e sidebar. Corrige erros no test

app/assets/tailwind/application.css

@@ -1,5 +1,5 @@
-@import "tailwindcss";
 @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
+@import "tailwindcss";
 
 @theme {
   --font-roboto: "Roboto", sans-serif;

app/controllers/pages_controller.rb

@@ -0,0 +1,5 @@
+class PagesController < ApplicationController
+  layout "application"
+  def index
+  end
+end

app/controllers/sessions_controller.rb

@@ -1,4 +1,5 @@
 class SessionsController < ApplicationController
+  layout "login"
   allow_unauthenticated_access only: %i[ new create ]
   rate_limit to: 10, within: 3.minutes, only: :create, with: -> { redirect_to new_session_url, alert: "Try again later." }
 

app/javascript/controllers/sidebar_controller.js

@@ -4,6 +4,10 @@ export default class extends Controller {
   static targets = ["view"]
 
   toggle() {
-    this.viewTarget.classList.toggle("hidden")
+    // this.viewTarget.classList.toggle("-translate-x-full")
+
+    // this.contentTarget.classList.toggle("ml-[257px]")
+    this.viewTarget.classList.toggle("w-[257px]")
+    this.viewTarget.classList.toggle("w-0")
   }
 }

app/views/components/_card.html.erb

@@ -0,0 +1,23 @@
+<div class= "bg-white h-[130px] w-[278px] font-roboto rounded-sm">
+    <div class="flex justify-between p-4">
+        <div class="flex flex-col">
+            <h1 class="font-bold">Nome da matéria</h1>
+            <h2>semestre</h2>
+            <h1 class="mt-4 font-bold">Professor</h1>
+        </div>
+
+        <div class="flex space-x-4 items-start">
+            <button class="text-black hover:text-blue-600 transition-colors duration-200 cursor-pointer">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
+                </svg>
+            </button>
+
+            <button class="text-black text-bold hover:text-red-600 transition-colors duration-200 cursor-pointer">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
+                </svg>
+            </button>
+        </div>
+    </div>
+</div>

app/views/components/_frameRoxoMenuLateral.html.erb

@@ -11,5 +11,5 @@
         cursor-pointer 
         gap-[10px] opacity-100"
 >
-    Gerenciamento
+    Avaliações
 </button>

app/views/components/_header.html.erb

@@ -1,6 +1,6 @@
 
 <!-- Main Navbar Container -->
-<header class="fixed top-0 left-0 right-0 w-full h-[60px] bg-white border-b border-gray-200 flex items-center justify-between px-4 z-50">
+<header class="relative top-0 left-0 right-0 w-full h-[60px] bg-white border-b border-gray-200 flex items-center justify-between px-4 z-50">
 
   <!-- Left Section: Menu Button + Page Title -->
   <div class="flex items-center space-x-4">
@@ -17,7 +17,7 @@
 
     <!-- Tab / Page Title -->
     <h1 class="font-roboto text-xl font-normal text-gray-900 truncate">
-      Tab name
+      Avaliações
     </h1>
   </div>
 
@@ -68,18 +68,13 @@
       <div 
         data-dropdown-target="menu"
         class="hidden absolute right-0 mt-2 w-38 bg-white rounded-md shadow-lg py-1 z-50">
-
-        <%= button_to session_path, method: :delete, class: "block w-full text-left px-4 py-2 text-sm font-roboto text-black hover:bg-gray-100" do %>
+        <%= Current.user.email_address%>
+        <%= button_to session_path, method: :delete, class: "block w-full text-left px-4 py-2 text-sm font-roboto text-black hover:bg-gray-100 cursor-pointer" do %>
           Logout
         <% end %>
-
-
       </div>
     </div>
 
-
-
-
   </div>
 </header>
 

app/views/components/_sidebar.html.erb

@@ -1,33 +1,9 @@
-<aside data-sidebar-target="view" class="hidden w-[257px] h-[772px] fixed top-[60px] left-[0px] bg-white flex flex-col shadow-lg">
-  <nav class="flex-1 flex flex-col">
-             <button
-        class=" 
-              w-full h-[46px]
-              bg-white
-              text-black 
-              font-roboto 
-              py-[11px] px-[50px]
-              border-b border-transparent
-              shadow-lg 
-              rounded 
-              cursor-pointer 
-              gap-[10px] opacity-100">
-          Other tab
-      </button> 
-
-      <button
-        class=" 
-              w-full h-[46px]
-              bg-project-purple
-              text-white
-              font-roboto 
-              py-[11px] px-[50px]
-              border-b border-transparent
-              shadow-lg 
-              rounded 
-              cursor-pointer 
-              gap-[10px] opacity-100">
-          Tab name
-      </button>
+<aside 
+  data-sidebar-target="view" 
+  class="w-[257px] bg-white h-full flex flex-col shadow-lg overflow-hidden flex-shrink-0 relative z-10 transition-[width] duration-300 ease-in-out border-r border-gray-200">
+
+  <nav class="flex-1 flex flex-col overflow-y-auto">
+    <%= render "components/frameRoxoMenuLateral"%>
   </nav>
+
 </aside>

app/views/layouts/application.html.erb

@@ -19,15 +19,19 @@
     <%= javascript_importmap_tags %>
   </head>
 
-  <body>
-    <%# Remover o comentário para verificar o funcionamento do tailwind
-    Remover essa parte quando alguma tela for implementada %>
-    <%# <div class="bg-blue-600 text-white text-center p-4 font-bold text-xl">
-      Tailwind funcionando
-    </div> %>
-
-    <main class="container mx-auto mt-10 px-5">
-      <%= yield %>
-    </main>
+  <body data-controller="sidebar" 
+    class="bg-project-background-gray m-0 p-0 h-screen w-screen flex flex-col overflow-hidden">
+    <%= render "components/header"%>
+    <div class="flex flex-1 w-full h-full overflow-hidden relative">
+
+      <%= render "components/sidebar" %>
+
+      <main class="flex-1 h-full overflow-y-auto p-4">
+        <%= render "components/card" %>
+        <%= yield %>
+      </main>
+
+    </div>
+
   </body>
 </html>

app/views/layouts/login.html.erb

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title><%= content_for(:title) || "Login" %></title>
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="mobile-web-app-capable" content="yes">
+    <%= csrf_meta_tags %>
+    <%= csp_meta_tag %>
+
+    <%= yield :head %>
+
+    <link rel="icon" href="/icon.png" type="image/png">
+    <link rel="icon" href="/icon.svg" type="image/svg+xml">
+    <link rel="apple-touch-icon" href="/icon.png">
+
+    <%= stylesheet_link_tag "tailwind", "data-turbo-track": "reload" %>
+
+    <%= javascript_importmap_tags %>
+  </head>
+
+  <body>
+    <%# Remover o comentário para verificar o funcionamento do tailwind
+    Remover essa parte quando alguma tela for implementada %>
+    <%# <div class="bg-blue-600 text-white text-center p-4 font-bold text-xl">
+      Tailwind funcionando
+    </div> %>
+
+    <main class="container mx-auto mt-10 px-5">
+      <%= yield %>
+    </main>
+  </body>
+</html>

config/routes.rb

@@ -30,7 +30,7 @@
   # -----------------------------------------
 
   # Defines the root path route ("/")
-  root "application#index"
+  root "pages#index"
 
   get "home" => "home#index"
 end

test/controllers/home_controller_test.rb

@@ -2,6 +2,10 @@
 
 class HomeControllerTest < ActionDispatch::IntegrationTest
   test "should get index" do
+
+    user = users(:one)
+    post session_url, params: { email_address: user.email_address, password: "password" }
+
     get home_index_url
     assert_response :success
   end

test/mailers/application_mailer_test.rb

@@ -1,6 +1,6 @@
 require "test_helper"
 
-class application_mailerTest < ActiveSupport::TestCase
+class ApplicationMailerTest < ActiveSupport::TestCase
   # test "the truth" do
   #   assert true
   # end

test/mailers/user_mailer_test.rb

@@ -1,6 +1,6 @@
 require "test_helper"
 
-class user_mailerTest < ActiveSupport::TestCase
+class UserMailerTest < ActiveSupport::TestCase
   # test "the truth" do
   #   assert true
   # end

test/models/turma_test.rb

@@ -1,6 +1,6 @@
 require "test_helper"
 
-class turmaTest < ActiveSupport::TestCase
+class TurmaTest < ActiveSupport::TestCase
   # test "the truth" do
   #   assert true
   # end