管理者ページへのナビゲーションリンク追加とUI改善

CLAUDE.md

@@ -12,6 +12,24 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
 
 `uniar` is a CLI tool and web server for managing UNI'S ON AIR scene card collections and database. It uses SQLite for data storage and is written in Go with Cobra for CLI commands and Gin for the web server.
 
+## Development Quality Assurance (CRITICAL)
+
+### Required Checks After Code Changes
+- **MANDATORY**: Execute the following after every Go code change:
+  1. `go fmt ./...` - Format code according to Go standards
+  2. `golangci-lint run` - Run linter (if installed)
+  3. `go test ./...` - Run all tests
+  4. `go test -race ./...` - Check for race conditions
+  5. Fix all errors and warnings before considering task complete
+
+### Pre-Commit Verification Checklist
+- `go mod tidy` - Clean up module dependencies
+- All tests must pass
+- Test coverage must not decrease (`go test -cover ./...`)
+- Build must succeed (`go build ./...`)
+
+**IMPORTANT**: These checks are mandatory for maintaining code quality and preventing regressions. Never skip these steps.
+
 ## Development Commands
 
 ### Build
@@ -287,4 +305,4 @@ gh release list --repo litencatt/uniar
 
 # View specific release
 gh release view v1.0.0 --repo litencatt/uniar
-```
+```

assets/css/styles.css

@@ -15,64 +15,86 @@ body {
 
 /* ヘッダー・ナビゲーション */
 .header {
-    background: rgba(255, 255, 255, 0.95);
-    backdrop-filter: blur(10px);
-    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
+    background: rgba(255, 255, 255, 0.98);
+    backdrop-filter: blur(15px);
+    box-shadow: 0 2px 20px rgba(102, 126, 234, 0.12);
     padding: 1rem 0;
     margin-bottom: 2rem;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    width: 100%;
+    z-index: 1000;
+    border-bottom: 1px solid rgba(102, 126, 234, 0.1);
 }
 
 .nav-container {
-    max-width: 1200px;
+    max-width: 1400px;
     margin: 0 auto;
-    padding: 0 1rem;
+    padding: 0 2rem;
     display: flex;
     justify-content: space-between;
     align-items: center;
-    flex-wrap: wrap;
-    gap: 1rem;
+    gap: 2rem;
 }
 
 .user-info {
-    color: #666;
-    font-weight: 500;
+    color: #4a5568;
+    font-weight: 600;
+    font-size: 0.9rem;
+    padding: 0.5rem 1rem;
+    background: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
+    border-radius: 25px;
+    border: 1px solid #e2e8f0;
+    white-space: nowrap;
 }
 
 .nav-links {
     display: flex;
-    gap: 1.5rem;
+    gap: 0.75rem;
     flex-wrap: wrap;
+    align-items: center;
 }
 
 .nav-links a {
     color: #4a5568;
     text-decoration: none;
     padding: 0.5rem 1rem;
-    border-radius: 6px;
-    transition: all 0.3s ease;
+    border-radius: 10px;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
     font-weight: 500;
+    font-size: 0.9rem;
+    background: rgba(255, 255, 255, 0.8);
+    border: 1px solid rgba(102, 126, 234, 0.15);
+    backdrop-filter: blur(5px);
 }
 
 .nav-links a:hover {
-    background: #667eea;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
     color: white;
-    transform: translateY(-2px);
+    transform: translateY(-1px);
+    box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3);
+    border-color: transparent;
 }
 
 .nav-links a.logout {
-    background: #e53e3e;
+    background: linear-gradient(135deg, #fc8181 0%, #e53e3e 100%);
     color: white;
+    border-color: transparent;
 }
 
 .nav-links a.logout:hover {
-    background: #c53030;
+    background: linear-gradient(135deg, #e53e3e 0%, #c53030 100%);
+    transform: translateY(-1px);
+    box-shadow: 0 8px 25px rgba(229, 62, 62, 0.4);
 }
 
 /* メインコンテナ */
 .main-container {
     max-width: 1400px;
     margin: 0 auto;
-    padding: 0 1rem;
+    padding: 5rem 1rem 0 1rem; /* 上部にヘッダー分のマージンを追加 */
 }
 
 /* カード型コンテナ */
@@ -165,18 +187,44 @@ body {
 }
 
 /* レスポンシブデザイン */
+@media (max-width: 1024px) {
+    .nav-container {
+        padding: 0 1.5rem;
+        gap: 1.5rem;
+    }
+}
+
 @media (max-width: 768px) {
+    .header {
+        padding: 0.75rem 0;
+    }
+
     .nav-container {
         flex-direction: column;
-        text-align: center;
+        gap: 1rem;
+        padding: 0 1rem;
+    }
+
+    .user-info {
+        font-size: 0.85rem;
+        padding: 0.4rem 0.8rem;
+        order: 1;
     }
 
     .nav-links {
+        gap: 0.5rem;
+        order: 2;
         justify-content: center;
     }
 
+    .nav-links a {
+        padding: 0.4rem 0.8rem;
+        font-size: 0.85rem;
+        border-radius: 8px;
+    }
+
     .main-container {
-        padding: 0 0.5rem;
+        padding: 6rem 0.5rem 0 0.5rem;
     }
 
     .card {
@@ -185,13 +233,35 @@ body {
 }
 
 @media (max-width: 480px) {
+    .header {
+        padding: 0.5rem 0;
+    }
+
+    .nav-container {
+        padding: 0 0.75rem;
+        gap: 0.75rem;
+    }
+
+    .user-info {
+        font-size: 0.8rem;
+        padding: 0.3rem 0.6rem;
+    }
+
     .nav-links {
         flex-direction: column;
-        gap: 0.5rem;
+        gap: 0.4rem;
         width: 100%;
     }
 
     .nav-links a {
         text-align: center;
+        padding: 0.4rem 0.6rem;
+        font-size: 0.8rem;
+        width: 100%;
+        box-sizing: border-box;
+    }
+
+    .main-container {
+        padding: 7rem 0.5rem 0 0.5rem;
     }
 }

docker-compose.yml → compose.yml

@@ -8,7 +8,7 @@ services:
       - .:/app
       - ~/.uniar:/root/.uniar
     environment:
-      - ADMIN_DEBUG=true
+      - ADMIN_DEBUG=false
   # db:
   #   image: mysql:8
   #   command: --default-authentication-plugin=mysql_native_password

handler/handler.go

@@ -225,5 +225,13 @@ func getUserSession(c *gin.Context) (*UserSession, error) {
 	if us == nil {
 		return nil, fmt.Errorf("getUserSession() user session not found")
 	}
-	return us.(*UserSession), nil
+
+	userSession := us.(*UserSession)
+
+	// ADMIN_DEBUG=trueの場合、IsAdminをtrueに設定
+	if os.Getenv("ADMIN_DEBUG") == "true" {
+		userSession.IsAdmin = true
+	}
+
+	return userSession, nil
 }