feat: AppHeaderコンポーネントを追加

kufu · Feb 8, 2025 · 5ecce55 · 5ecce55
2 parents 5b51efa + b079464
commit 5ecce55
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 6 deletions.
diff --git a/app/views/components/_app_header.html.erb b/app/views/components/_app_header.html.erb
@@ -0,0 +1,19 @@
+<header class="w-full h-16 px-4 bg-gradient-to-b from-[#FFEB0C] from-0% via-transparent via-20% to-[#FCFCFD] to-20%">
+  <div class="h-full flex justify-between items-center">
+    <div class="flex flex-col gap-2 pt-2">
+      <%= link_to root_path do %>
+        <h1 class="font-medium text-[#5E626E]">Schedule.select</h1>
+      <% end %>
+      <a href="<%= event_path %>">
+        <img class="h-3" src="<%= asset_path("#{@event.name}/rubykaigi_logo.svg") %>" alt="RubyKaigi 2024">
+      </a>
+    </div>
+
+    <%# TODO: プロフィール画像を表示する %>
+    <img
+      src="https://placehold.jp/150x150.png"
+      alt="Profile"
+      class="w-10 h-10 rounded-full"
+    >
+  </div>
+</header>
diff --git a/app/views/components/_footer.html.erb b/app/views/components/_footer.html.erb
@@ -0,0 +1,9 @@
+<footer class="flex flex-col items-center pt-4">
+  <div class="mb-4">
+    <img src="/icons/github-mark.svg" alt="GitHub" class="h-8 w-8">
+  </div>
+  <div class="mb-4">
+    <img src="/smarthr-logo.svg" alt="SmartHR" class="h-6">
+  </div>
+  <div class="w-full h-8 bg-gradient-to-t from-[#00C4CC] to-transparent"></div>
+</footer>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -27,7 +27,6 @@
     <% if Rails.env.test? %>
       <%= tag :meta, name: :rails_env, content: Rails.env %>
     <% end %>
-
     <meta property="og:title" content="RubyKaigi Schedule.select">
     <meta property="og:site_name" content="RubyKaigi Schedule.select powerd by SmartHR">
     <% unless Rails.env.test? %>
@@ -39,16 +38,12 @@
     <% end %>
     <meta property="og:type" content="website">
     <meta name="twitter:card" content="summary_large_image"/>
-
     <%= yield(:head) %>
-
     <%= javascript_include_tag "application", "data-turbo-track": "reload", defer: true %>
   </head>
 
   <body class="bg-[#f8f7f6] leading-4" style="font-family: 'Roboto', 'Noto Sans JP', sans-serif;">
-    <header>
-      <%= render 'layouts/header' %>
-    </header>
+    <%= render 'components/app_header' %>
     <div class="p-4 sm:p-8">
       <%= yield %>
     </div>

diff --git a/public/smarthr-logo.svg b/public/smarthr-logo.svg