Skip to content

[Feature] デザインのモダナイズ#197

Open
sakho13 wants to merge 7 commits intodevelopfrom
189-style/modernize
Open

[Feature] デザインのモダナイズ#197
sakho13 wants to merge 7 commits intodevelopfrom
189-style/modernize

Conversation

@sakho13
Copy link
Copy Markdown
Owner

@sakho13 sakho13 commented Oct 19, 2025

概要

関連タスク

チェック

影響範囲・懸念

備考

sakho13 and others added 7 commits September 27, 2025 12:40
- 新規Atomコンポーネント `SlimeButton.tsx` を追加
  - グーイーエフェクト付きの液体/スライム表現ボタン
  - カラーモード対応(primary, smart, ghost, outline, danger)
  - 浮遊する液滴アニメーション
  - アクセシビリティ対応(prefers-reduced-motion)
- ログイン画面のボタンを `ButtonBase` から `SlimeButton` に変更
  - ログインボタン: primary カラーモード + LogIn アイコン
  - ゲストログインボタン: ghost カラーモード + UserX アイコン
- SVGフィルター(goo エフェクト)とCSSアニメーションを追加

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
- SVGフィルター(goo エフェクト)を layout.tsx に移動
  - アプリケーション全体で SlimeButton が使用可能に
- CSSアニメーション(drop-drift-1, drop-drift-2)を globals.css に移動
  - prefers-reduced-motion 対応も含む
- ログインページから重複する SVG と style タグを削除
  - コードの重複を削減し、保守性を向上

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
- onClick の型を () => void から MouseEventHandler<HTMLButtonElement> に変更
- stopPropagation() などのイベントメソッドが使用可能に
- children の型を React.ReactNode から ReactNode に統一

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature] デザインのモダナイズ

1 participant