From 8e948adbeb96fa64b254f1230266110c010f068f Mon Sep 17 00:00:00 2001
From: Roo Code <roomote@roocode.com>
Date: Tue, 6 Jan 2026 17:36:55 +0000
Subject: [PATCH] feat: add hover animation to navbar logo

---
 src/theme/Navbar/Logo/index.tsx         |  5 +++--
 src/theme/Navbar/Logo/styles.module.css | 17 +++++++++++++++++
 2 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 src/theme/Navbar/Logo/styles.module.css

diff --git a/src/theme/Navbar/Logo/index.tsx b/src/theme/Navbar/Logo/index.tsx
index 72d320a0..623d962b 100644
--- a/src/theme/Navbar/Logo/index.tsx
+++ b/src/theme/Navbar/Logo/index.tsx
@@ -1,11 +1,12 @@
 import React, {type ReactNode} from 'react';
 import Logo from '@theme/Logo';
+import styles from './styles.module.css';
 
 export default function NavbarLogo(): ReactNode {
   return (
     <Logo
-      className="navbar__brand"
-      imageClassName="navbar__logo"
+      className={`navbar__brand ${styles.logoLink}`}
+      imageClassName={`navbar__logo ${styles.logoImage}`}
       titleClassName="navbar__title text--truncate"
     />
   );
diff --git a/src/theme/Navbar/Logo/styles.module.css b/src/theme/Navbar/Logo/styles.module.css
new file mode 100644
index 00000000..decb2ca7
--- /dev/null
+++ b/src/theme/Navbar/Logo/styles.module.css
@@ -0,0 +1,17 @@
+.logoLink {
+  display: inline-flex;
+  align-items: center;
+  transition: transform 0.2s ease-in-out;
+}
+
+.logoLink:hover {
+  transform: scale(1.05);
+}
+
+.logoImage {
+  transition: opacity 0.2s ease-in-out;
+}
+
+.logoLink:hover .logoImage {
+  opacity: 0.9;
+}