112 lines
5.7 KiB
Plaintext
112 lines
5.7 KiB
Plaintext
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title><%= content_for(:title) || "Dip Front" %></title>
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<meta name="application-name" content="Dip Front">
|
|
<meta name="mobile-web-app-capable" content="yes">
|
|
<%= csrf_meta_tags %>
|
|
<%= csp_meta_tag %>
|
|
<%= action_cable_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">
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&family=Lato:wght@400;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
|
|
<%= stylesheet_link_tag "tailwind", "data-turbo-track": "reload" %>
|
|
<%= javascript_importmap_tags %>
|
|
<style>
|
|
body {
|
|
font-family: 'Lato', sans-serif;
|
|
background-image: url('<%= asset_path("background.png") %>');
|
|
background-repeat: repeat;
|
|
background-attachment: fixed;
|
|
background-size: 1920px; /* Adjust as needed */
|
|
}
|
|
h1, h2, h3, h4, h5, h6, .font-cinzel {
|
|
font-family: 'Cinzel', serif;
|
|
}
|
|
.diplomacy-card {
|
|
background-color: rgba(255, 255, 255, 0.9);
|
|
border: 1px solid #d4c5a9;
|
|
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
|
}
|
|
.diplomacy-text-gold {
|
|
color: #c5a059;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body class="text-gray-900 leading-normal tracking-normal">
|
|
<nav class="bg-green-900/95 backdrop-blur-sm border-b border-[#c5a059] fixed w-full z-30 top-0 shadow-lg">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="flex justify-between h-16">
|
|
<div class="flex">
|
|
<div class="flex-shrink-0 flex items-center">
|
|
</div>
|
|
<div class="hidden sm:-my-px sm:ml-6 sm:flex sm:space-x-8">
|
|
<%= link_to root_path, class: "border-transparent text-green-100 hover:text-[#c5a059] hover:border-[#c5a059] inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium transition-colors duration-200" do %>
|
|
<i class="fa-solid fa-house mr-2"></i> トップ
|
|
<% end %>
|
|
<%= link_to new_game_path, class: "border-transparent text-green-100 hover:text-[#c5a059] hover:border-[#c5a059] inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium transition-colors duration-200" do %>
|
|
<i class="fa-solid fa-plus-circle mr-2"></i> New Game
|
|
<% end %>
|
|
<% if logged_in? && current_user.admin? %>
|
|
<%= link_to users_path, class: "border-transparent text-green-100 hover:text-[#c5a059] hover:border-[#c5a059] inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium transition-colors duration-200" do %>
|
|
<i class="fa-solid fa-users-cog mr-2"></i> ユーザー管理
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<div class="hidden sm:ml-6 sm:flex sm:items-center space-x-4">
|
|
<% if logged_in? %>
|
|
<%= link_to user_path(current_user), class: "text-sm text-green-100 hover:text-[#c5a059] transition-colors duration-200 flex items-center" do %>
|
|
<i class="fa-solid fa-user-shield mr-2"></i>
|
|
<%= current_user.username %>さん
|
|
<% if current_user.admin? %>
|
|
<span class="ml-1 px-2 py-0.5 text-[10px] font-bold text-green-900 bg-[#c5a059] rounded border border-yellow-600">ADMIN</span>
|
|
<% end %>
|
|
<% end %>
|
|
<%= button_to logout_path, method: :delete, class: "inline-flex items-center px-3 py-1.5 border border-[#c5a059] shadow-sm text-sm font-medium rounded text-[#c5a059] bg-green-900 hover:bg-green-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[#c5a059] transition-colors duration-200" do %>
|
|
<i class="fa-solid fa-right-from-bracket mr-2"></i> ログアウト
|
|
<% end %>
|
|
<% else %>
|
|
<%= link_to "ログイン", login_path, class: "inline-flex items-center px-3 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500" %>
|
|
<%= link_to "新規登録", signup_path, class: "inline-flex items-center px-3 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500" %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="pt-24 pb-12 min-h-screen">
|
|
<%= yield :top_content %>
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 bg-white/85 backdrop-blur-sm rounded-xl shadow-xl border border-white/20 py-8">
|
|
<% if notice %>
|
|
<div class="bg-green-100/90 border border-green-400 text-green-800 px-4 py-3 rounded relative mb-6" role="alert">
|
|
<span class="block sm:inline"><%= notice %></span>
|
|
</div>
|
|
<% end %>
|
|
|
|
<% if alert %>
|
|
<div class="bg-red-100/90 border border-red-400 text-red-800 px-4 py-3 rounded relative mb-6" role="alert">
|
|
<span class="block sm:inline"><%= alert %></span>
|
|
</div>
|
|
<% end %>
|
|
|
|
<main>
|
|
<%= yield %>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|