优先兼容Mac深色模式，首页文章密度调整

components/DarkModeButton.js

@@ -3,13 +3,14 @@ import localStorage from 'localStorage'
 
 const DarkModeButton = () => {
   const { theme, changeTheme } = useTheme()
+  // 用户手动设置主题
   const handleChangeDarkMode = () => {
     const newTheme = (theme === 'light' ? 'dark' : 'light')
-    changeTheme(newTheme)
     localStorage.setItem('theme', newTheme)
+    changeTheme(newTheme)
   }
   return <div className='z-10 p-1 duration-200 mr-2 h-12 text-xl cursor-pointer dark:text-gray-300 '>
-    <i className={'fa p-2.5 hover:scale-125 transform duration-200 ' + (theme === 'dark' ? ' fa-sun-o' : ' fa-moon-o') } onClick={handleChangeDarkMode} />
+    <i className={'fa p-2.5 hover:scale-125 transform duration-200 ' + (theme === 'dark' ? 'fa-sun-o' : 'fa-moon-o') } onClick={handleChangeDarkMode} />
   </div>
 }
 export default DarkModeButton