diff --git a/.eslintrc.js b/.eslintrc.js
index bab5ea27..9836da77 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -26,6 +26,7 @@ module.exports = {
     }
   },
   rules: {
+    semi: 0,
     'react/no-unknown-property': 'off', // <style jsx>
     'react/prop-types': 'off',
     'space-before-function-paren': 0,
diff --git a/themes/next/components/ArticleDetail.js b/themes/next/components/ArticleDetail.js
index a4f575ec..f26b6691 100644
--- a/themes/next/components/ArticleDetail.js
+++ b/themes/next/components/ArticleDetail.js
@@ -34,7 +34,7 @@ export default function ArticleDetail(props) {
                 data-aos-duration="300"
                 data-aos-once="true"
                 data-aos-anchor-placement="top-bottom"
-                className="subpixel-antialiased overflow-y-hidden py-10 px-5 lg:pt-24 md:px-24  dark:border-gray-700 bg-white dark:bg-hexo-black-gray"
+                className="subpixel-antialiased overflow-y-hidden py-10 px-5 lg:pt-24 md:px-24  dark:border-gray-700 bg-white dark:bg-hexo-black-gray article-padding"
             >
 
                 {showArticleInfo && <header>
@@ -78,7 +78,7 @@ export default function ArticleDetail(props) {
                 </header>}
 
                 {/* Notion内容主体 */}
-                <article className='px-1 max-w-3xl mx-auto'>
+                <article className='mx-auto'>
                     {post && (<NotionPage post={post} />)}
                 </article>
 
diff --git a/themes/next/components/BlogPostCard.js b/themes/next/components/BlogPostCard.js
index 050b33c2..90224ecd 100644
--- a/themes/next/components/BlogPostCard.js
+++ b/themes/next/components/BlogPostCard.js
@@ -28,10 +28,10 @@ const BlogPostCard = ({ post, showSummary }) => {
             data-aos-duration="500"
             data-aos-once="true"
             data-aos-anchor-placement="top-bottom"
-            className={`cursor-pointer hover:underline text-3xl ${showPreview ? 'text-center' : ''
+            className={`cursor-pointer text-3xl ${showPreview ? 'text-center' : ''
               } leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
 
-            <NotionIcon icon={post.pageIcon} /> {post.title}
+            <NotionIcon icon={post.pageIcon} /> <span className='menu-link'>{post.title}</span>
 
           </Link>
 
@@ -48,10 +48,10 @@ const BlogPostCard = ({ post, showSummary }) => {
                   <Link
                     href={`/category/${post.category}`}
                     passHref
-                    className="hover:text-blue-500 dark:hover:text-blue-400 cursor-pointer font-light text-sm hover:underline transform">
+                    className="hover:text-blue-500 dark:hover:text-blue-400 cursor-pointer font-light text-sm transform">
 
                     <i className="mr-1 fas fa-folder" />
-                    {post.category}
+                    <span className='menu-link'>{post.category}</span>
 
                   </Link>
                   <span className="mx-2">|</span>
@@ -60,8 +60,8 @@ const BlogPostCard = ({ post, showSummary }) => {
                 <Link
                     href={`/archive#${formatDateFmt(post?.publishDate, 'yyyy-MM')}`}
                     passHref
-                    className="hover:text-blue-500 dark:hover:text-blue-400 font-light hover:underline cursor-pointer text-sm leading-4 mr-3">
-                    {post.date?.start_date}
+                    className="hover:text-blue-500 dark:hover:text-blue-400 font-light cursor-pointer text-sm leading-4 mr-3">
+                    <span className='menu-link'>{post.date?.start_date}</span>
                 </Link>
             </div>
             <TwikooCommentCount post={post} className='hover:text-blue-500 dark:hover:text-blue-400 hover:underline text-sm'/>
diff --git a/themes/next/components/SideAreaRight.js b/themes/next/components/SideAreaRight.js
index e23759c4..ee694d35 100644
--- a/themes/next/components/SideAreaRight.js
+++ b/themes/next/components/SideAreaRight.js
@@ -62,7 +62,7 @@ const SideAreaRight = (props) => {
                             passHref
                             className='text-gray-400 hover:text-black dark:text-gray-400 dark:hover:text-white hover:underline cursor-pointer'>
 
-                            {locale.COMMON.MORE} <i className='fas fa-angle-right' />
+                            {locale.COMMON.MORE} <i className='fas fa-angle-double-right' />
 
                         </Link>
                     </div>
diff --git a/themes/next/style.js b/themes/next/style.js
index d01b13b3..daf6af46 100644
--- a/themes/next/style.js
+++ b/themes/next/style.js
@@ -15,6 +15,24 @@ const Style = () => {
         background-color: black;
     }
 
+    .article-padding {
+      padding: 40px;
+    }
+
+    // 菜单下划线动画
+    #theme-next .menu-link {
+      text-decoration: none;
+      background-image: linear-gradient(#4e80ee, #4e80ee);
+      background-repeat: no-repeat;
+      background-position: bottom center;
+      background-size: 0 2px;
+      transition: background-size 100ms ease-in-out;
+    }
+    #theme-next .menu-link:hover {
+      background-size: 100% 2px;
+      color: #4e80ee;
+    }
+
   `}</style>
 }