diff --git a/styles/globals.css b/styles/globals.css index 65057e3e..2b8f568f 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -76,9 +76,13 @@ nav { } .shadow-card { - box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, - rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, - rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px; + box-shadow: + rgba(0, 0, 0, 0.07) 0px 1px 2px, + rgba(0, 0, 0, 0.07) 0px 2px 4px, + rgba(0, 0, 0, 0.07) 0px 4px 8px, + rgba(0, 0, 0, 0.07) 0px 8px 16px, + rgba(0, 0, 0, 0.07) 0px 16px 32px, + rgba(0, 0, 0, 0.07) 0px 32px 64px; } .gt-meta { @@ -106,7 +110,6 @@ nav { backdrop-filter: blur(10px); } - .medium-zoom-overlay { background: none !important; /* background: rgba(0, 0, 0, 0.01) none repeat scroll 0% 0% !important; */ @@ -157,7 +160,7 @@ nav { /* twikoo 评论区超链接样式 */ .tk-main a { - @apply text-blue-700 + @apply text-blue-700; } /* twikoo 内置的 element-ui 加载样式 */ @@ -167,7 +170,7 @@ nav { /* Webmention style */ .webmention-block { - background: rgba(0, 116, 222, .2); + background: rgba(0, 116, 222, 0.2); padding: 1rem 2rem; border-radius: 5px; } @@ -176,11 +179,11 @@ nav { font-style: italic; font-weight: 700; font-size: 16px; - margin-bottom: .5rem; + margin-bottom: 0.5rem; } .webmention-block-intro a { - color: #0000EE; + color: #0000ee; text-decoration: underline; } @@ -197,14 +200,14 @@ nav { .webmention-counts .count { font-weight: bold; - margin-right: .2rem; + margin-right: 0.2rem; } /* .webmention-counts .counts > span { margin-right: .8rem; } */ -.webmention-counts .counts>span:not(:last-child):after { - content: " • "; +.webmention-counts .counts > span:not(:last-child):after { + content: ' • '; } a.avatar-wrapper { @@ -221,7 +224,7 @@ a.avatar-wrapper { .avatar { border-radius: 50%; margin: 0; - border: 3px solid rgba(0, 116, 222, .5); + border: 3px solid rgba(0, 116, 222, 0.5); } .replies { @@ -235,7 +238,7 @@ a.avatar-wrapper { position: relative; padding: 0; align-items: flex-start; - margin-top: .6rem; + margin-top: 0.6rem; } .reply p { @@ -255,4 +258,9 @@ a.avatar-wrapper { user-select: none; -webkit-user-select: none; -ms-user-select: none; -} \ No newline at end of file +} + +.writing-vertical { + writing-mode: vertical-rl; /* 竖向排列从右向左 */ + text-orientation: upright; /* 文字方向正常 */ +} diff --git a/themes/game/components/ArticleFooter.js b/themes/game/components/ArticleFooter.js deleted file mode 100644 index 628dd05d..00000000 --- a/themes/game/components/ArticleFooter.js +++ /dev/null @@ -1,33 +0,0 @@ -import { useRouter } from 'next/router' -import { useGlobal } from '@/lib/global' - -/** - * 加密文章校验组件 - * @param {password, validPassword} props - * @param password 正确的密码 - * @param validPassword(bool) 回调函数，校验正确回调入参为true - * @returns - */ -export const ArticleFooter = props => { - const router = useRouter() - const { locale } = useGlobal() - - return
- - - - - - -
-} diff --git a/themes/game/components/ArticleInfo.js b/themes/game/components/ArticleInfo.js deleted file mode 100644 index b916d8cc..00000000 --- a/themes/game/components/ArticleInfo.js +++ /dev/null @@ -1,56 +0,0 @@ - -import Image from 'next/image' -import TagItem from './TagItem' -import md5 from 'js-md5' -import { siteConfig } from '@/lib/config' -import NotionIcon from '@/components/NotionIcon' - -export const ArticleInfo = (props) => { - const { post } = props - - const emailHash = md5(siteConfig('CONTACT_EMAIL', '#')) - - return
-
- -

- {post?.title} -

- - {post?.type !== 'Page' && <> - - } - -
- -
-} diff --git a/themes/game/components/BlogListPage.js b/themes/game/components/BlogListPage.js index 2f59bada..cf53e13c 100644 --- a/themes/game/components/BlogListPage.js +++ b/themes/game/components/BlogListPage.js @@ -1,51 +1,13 @@ -import { siteConfig } from '@/lib/config' -import { useGlobal } from '@/lib/global' -import Link from 'next/link' -import { useRouter } from 'next/router' import { GameListIndexCombine } from './GameListIndexCombine' export const BlogListPage = props => { - const { page = 1, posts, postCount } = props - const { locale } = useGlobal() - const router = useRouter() - const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE'))) - const currentPage = +page - - const showPrev = currentPage > 1 - const showNext = currentPage < totalPage && posts?.length > 0 - const pagePrefix = router.asPath - .split('?')[0] - .replace(/\/page\/[1-9]\d*/, '') - .replace(/\/$/, '') - return ( -
-
+ <> +
-
- - - - - - -
-
+ {/* 这里不显示分页组件，首页只展示部分即可 */} + ) } diff --git a/themes/game/components/BlogListScroll.js b/themes/game/components/BlogListScroll.js index 42a1f440..77d4d761 100644 --- a/themes/game/components/BlogListScroll.js +++ b/themes/game/components/BlogListScroll.js @@ -1,9 +1,9 @@ -import { useGlobal } from '@/lib/global' -import Link from 'next/link' -import throttle from 'lodash.throttle' -import { deepClone } from '@/lib/utils' import { siteConfig } from '@/lib/config' +import { useGlobal } from '@/lib/global' +import { deepClone } from '@/lib/utils' +import throttle from 'lodash.throttle' import { useCallback, useEffect, useRef, useState } from 'react' +import { GameListIndexCombine } from './GameListIndexCombine' export const BlogListScroll = props => { const { posts } = props @@ -12,9 +12,8 @@ export const BlogListScroll = props => { const [page, updatePage] = useState(1) let hasMore = false - const postsToShow = posts && Array.isArray(posts) - ? deepClone(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page) - : [] + const postsToShow = + posts && Array.isArray(posts) ? deepClone(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page) : [] if (posts) { const totalCount = posts.length @@ -28,56 +27,33 @@ export const BlogListScroll = props => { const targetRef = useRef(null) // 监听滚动自动分页加载 - const scrollTrigger = useCallback(throttle(() => { - const scrollS = window.scrollY + window.outerHeight - const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0 - if (scrollS > clientHeight + 100) { - handleGetMore() - } - }, 500)) + const scrollTrigger = useCallback( + throttle(() => { + const scrollS = window.scrollY + window.outerHeight + const clientHeight = targetRef ? (targetRef.current ? targetRef.current.clientHeight : 0) : 0 + if (scrollS > clientHeight + 100) { + handleGetMore() + } + }, 500) + ) useEffect(() => { window.addEventListener('scroll', scrollTrigger) - return () => { window.removeEventListener('scroll', scrollTrigger) } }) return ( -
- {postsToShow.map(p => ( - - ))} - -
- {' '} - {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '} -
- -
+
+ {' '} + {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '} +
+ ) } diff --git a/themes/game/components/DarkModeButton.js b/themes/game/components/DarkModeButton.js new file mode 100644 index 00000000..57361452 --- /dev/null +++ b/themes/game/components/DarkModeButton.js @@ -0,0 +1,31 @@ +import { useGlobal } from '@/lib/global' +import { useImperativeHandle } from 'react' + +/** + * 深色模式按钮 + */ +const DarkModeButton = props => { + const { cRef, className } = props + const { isDarkMode, toggleDarkMode } = useGlobal() + + /** + * 对外暴露方法 + */ + useImperativeHandle(cRef, () => { + return { + handleChangeDarkMode: () => { + toggleDarkMode() + } + } + }) + + return ( +
+ + {isDarkMode ? 'Dark Mode' : 'Light Mode'}{' '} +
+ ) +} +export default DarkModeButton diff --git a/themes/game/components/Footer.js b/themes/game/components/Footer.js index 36e68d23..3f90a843 100644 --- a/themes/game/components/Footer.js +++ b/themes/game/components/Footer.js @@ -1,34 +1,32 @@ -import DarkModeButton from '@/components/DarkModeButton' import { siteConfig } from '@/lib/config' export const Footer = props => { const d = new Date() const currentYear = d.getFullYear() - const { post } = props - const fullWidth = post?.fullWidth ?? false const since = siteConfig('SINCE') - const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear + const copyrightDate = + parseInt(since) < currentYear ? since + '-' + currentYear : currentYear return ( ) diff --git a/themes/game/components/GameListIndexCombine.js b/themes/game/components/GameListIndexCombine.js index dd1d4f23..2de16df6 100644 --- a/themes/game/components/GameListIndexCombine.js +++ b/themes/game/components/GameListIndexCombine.js @@ -24,6 +24,7 @@ export const GameListIndexCombine = ({ posts }) => { if (recommend) { // 4合一卡组 let groupItems = [] + while (gamesClone?.length > 0) { index++ @@ -38,16 +39,18 @@ export const GameListIndexCombine = ({ posts }) => { const item = gamesClone.shift() if (item.tags?.some(t => t === siteConfig('GAME_RECOMMEND_TAG', 'Recommend', CONFIG))) { components.push() - break + continue } else { groupItems.push(item) } } - if (groupItems.length === 4 || (gamesClone.length === 0 && groupItems.length > 4)) { + if (groupItems.length === 4) { components.push() + // 清空4合一卡片 groupItems = [] } else { + // 剩余的4合一不满4个的给他放大卡 while (groupItems.length > 0) { const item = groupItems.shift() components.push() diff --git a/themes/game/components/GameListNormal.js b/themes/game/components/GameListNormal.js index 902debde..b9bc9603 100644 --- a/themes/game/components/GameListNormal.js +++ b/themes/game/components/GameListNormal.js @@ -40,7 +40,8 @@ export const GameListNormal = ({ games, maxCount = 18 }) => { * @returns */ const GameItem = ({ item }) => { - const { title, img } = item + const { title } = item + const img = item.pageCoverThumbnail const [showType, setShowType] = useState('img') // img or video const url = checkContainHttp(item.slug) ? sliceUrlFromHttp(item.slug) : `${siteConfig('SUB_PATH', '')}/${item.slug}` const video = item?.ext?.video diff --git a/themes/game/components/GameListRecent.js b/themes/game/components/GameListRecent.js index 63fc8f92..f390adc2 100644 --- a/themes/game/components/GameListRecent.js +++ b/themes/game/components/GameListRecent.js @@ -1,15 +1,15 @@ /* eslint-disable @next/next/no-img-element */ import { siteConfig } from '@/lib/config' -import { useGlobal } from '@/lib/global' import { checkContainHttp, deepClone, sliceUrlFromHttp } from '@/lib/utils' import { useState } from 'react' +import { useGameGlobal } from '..' /** * 游戏列表- 最近游戏 * @returns */ export const GameListRecent = ({ maxCount = 14 }) => { - const { recentGames } = useGlobal() + const { recentGames } = useGameGlobal() const gamesClone = deepClone(recentGames) // 构造一个List const components = [] @@ -31,8 +31,7 @@ export const GameListRecent = ({ maxCount = 14 }) => { return ( <> -
Recent Played
-
+
{components?.map((ItemComponent, index) => { return ItemComponent @@ -67,6 +66,9 @@ const GameItem = ({ item }) => { title={title} className={`card-single h-28 w-28 relative shadow rounded-md overflow-hidden flex justify-center items-center group hover:border-purple-400`}> +
+ +
{title}
diff --git a/themes/game/components/GroupCategory.js b/themes/game/components/GroupCategory.js new file mode 100644 index 00000000..095755a1 --- /dev/null +++ b/themes/game/components/GroupCategory.js @@ -0,0 +1,41 @@ +import Link from 'next/link' + +function GroupCategory({ currentCategory, categoryOptions }) { + if (!categoryOptions) { + return <> + } + + return ( + <> + + + +
+ {categoryOptions.map(category => { + const selected = currentCategory === category.name + return ( + + {/* */} + {category.name} + {/* + {category.count} + */} + + ) + })} +
+ + ) +} + +export default GroupCategory diff --git a/themes/game/components/GroupTag.js b/themes/game/components/GroupTag.js new file mode 100644 index 00000000..383705b2 --- /dev/null +++ b/themes/game/components/GroupTag.js @@ -0,0 +1,28 @@ +import Link from 'next/link' +import TagItemMini from './TagItemMini' + +/** + * 标签组 + * @param tags + * @param currentTag + * @returns {JSX.Element} + * @constructor + */ +function GroupTag({ tagOptions, currentTag }) { + if (!tagOptions) return <> + return ( + <> + + + +
+ {tagOptions?.slice(0, 20)?.map(tag => { + const selected = tag.name === currentTag + return + })} +
+ + ) +} + +export default GroupTag diff --git a/themes/game/components/Header.js b/themes/game/components/Header.js index 8cb6c907..02873cb0 100644 --- a/themes/game/components/Header.js +++ b/themes/game/components/Header.js @@ -1,5 +1,4 @@ -import { useGlobal } from '@/lib/global' -import Image from 'next/image' +import { useGameGlobal } from '..' import Logo from './Logo' /** @@ -7,10 +6,10 @@ import Logo from './Logo' * @returns */ export default function Header() { - const { setSideBarVisible } = useGlobal() + const { setSideBarVisible } = useGameGlobal() return (
-
+
diff --git a/themes/game/components/MenuList.js b/themes/game/components/MenuList.js index 3835ee4d..16b2443f 100644 --- a/themes/game/components/MenuList.js +++ b/themes/game/components/MenuList.js @@ -1,30 +1,72 @@ -import Link from 'next/link' +import { siteConfig } from '@/lib/config' +import { useGlobal } from '@/lib/global' import { useGameGlobal } from '..' +import CONFIG from '../config' +import DarkModeButton from './DarkModeButton' +import { MenuItemDrop } from './MenuItemDrop' -export const MenuList = () => { +/** + * 导航菜单 + */ +export const MenuList = props => { const { setSideBarVisible } = useGameGlobal() + const { customNav, customMenu } = props + const { locale } = useGlobal() + const defaultLinks = [ + { + id: 1, + icon: 'fas fa-home', + name: locale.NAV.INDEX, + to: '/' || '/', + show: true + }, + { + id: 2, + icon: 'fas fa-th', + name: locale.COMMON.CATEGORY, + to: '/category', + show: siteConfig('GAME_MENU_CATEGORY', null, CONFIG) + }, + { + id: 3, + icon: 'fas fa-tag', + name: locale.COMMON.TAGS, + to: '/tag', + show: siteConfig('GAME_MENU_TAG', null, CONFIG) + } + ] + + let links = [].concat(defaultLinks) + if (customNav) { + links = defaultLinks.concat(customNav) + } + + // 如果 开启自定义菜单，则覆盖Page生成的菜单 + if (siteConfig('CUSTOM_MENU')) { + links = customMenu + } + return ( -
-
    -
  • - - - - Home - - -
    • -
  • - -
    • -
-
+
    +
  • + + +
    • + + {links?.map( + (link, index) => + link && link.show && + )} +
) } diff --git a/themes/game/components/Nav.js b/themes/game/components/Nav.js deleted file mode 100644 index 04b1e9fb..00000000 --- a/themes/game/components/Nav.js +++ /dev/null @@ -1,152 +0,0 @@ -import Collapse from '@/components/Collapse' -import LazyImage from '@/components/LazyImage' -import { siteConfig } from '@/lib/config' -import { useGlobal } from '@/lib/global' -import Link from 'next/link' -import { useEffect, useRef, useState } from 'react' -import CONFIG from '../config' -import { MenuItemCollapse } from './MenuItemCollapse' -import { MenuItemDrop } from './MenuItemDrop' -import RandomPostButton from './RandomPostButton' -import SearchButton from './SearchButton' -import { SvgIcon } from './SvgIcon' - -const Nav = props => { - const { navBarTitle, fullWidth, siteInfo } = props - const useSticky = !JSON.parse(siteConfig('GAME_AUTO_COLLAPSE_NAV_BAR', true)) - const navRef = useRef(null) - const sentinalRef = useRef([]) - const handler = ([entry]) => { - if (navRef && navRef.current && useSticky) { - if (!entry.isIntersecting && entry !== undefined) { - navRef.current?.classList.add('sticky-nav-full') - } else { - navRef.current?.classList.remove('sticky-nav-full') - } - } else { - navRef.current?.classList.add('remove-sticky') - } - } - useEffect(() => { - const obvserver = new window.IntersectionObserver(handler) - obvserver.observe(sentinalRef.current) - return () => { - if (sentinalRef.current) obvserver.unobserve(sentinalRef.current) - } - }, [sentinalRef]) - return ( - <> -
- - - ) -} - -const NavBar = props => { - const { customMenu, customNav } = props - const [isOpen, changeOpen] = useState(false) - const toggleOpen = () => { - changeOpen(!isOpen) - } - const collapseRef = useRef(null) - - const { locale } = useGlobal() - let links = [ - { - id: 2, - name: locale.NAV.RSS, - to: '/feed', - show: siteConfig('ENABLE_RSS') && siteConfig('GAME_MENU_RSS', null, CONFIG), - target: '_blank' - }, - { - icon: 'fas fa-search', - name: locale.NAV.SEARCH, - to: '/search', - show: siteConfig('GAME_MENU_SEARCH', null, CONFIG) - }, - { - icon: 'fas fa-archive', - name: locale.NAV.ARCHIVE, - to: '/archive', - show: siteConfig('GAME_MENU_ARCHIVE', null, CONFIG) - }, - { - icon: 'fas fa-folder', - name: locale.COMMON.CATEGORY, - to: '/category', - show: siteConfig('GAME_MENU_CATEGORY', null, CONFIG) - }, - { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('GAME_MENU_TAG', null, CONFIG) } - ] - if (customNav) { - links = links.concat(customNav) - } - - // 如果 开启自定义菜单，则覆盖Page生成的菜单 - if (siteConfig('CUSTOM_MENU')) { - links = customMenu - } - - if (!links || links.length === 0) { - return null - } - - return ( -
-
    - {links?.map((link, index) => ( - - ))} -
-
- -
- {links?.map((link, index) => ( - collapseRef.current?.updateCollapseHeight(param)} - /> - ))} -
- -
- - {JSON.parse(siteConfig('GAME_MENU_RANDOM_POST', null, CONFIG)) && } - {JSON.parse(siteConfig('GAME_MENU_SEARCH_BUTTON', null, CONFIG)) && } - -
- ) -} - -export default Nav diff --git a/themes/game/components/NavBar.js b/themes/game/components/NavBar.js deleted file mode 100644 index 0a146c40..00000000 --- a/themes/game/components/NavBar.js +++ /dev/null @@ -1,9 +0,0 @@ -import { MenuList } from './MenuList' - -export default function NavBar({ className }) { - return ( - - ) -} diff --git a/themes/game/components/PostInfo.js b/themes/game/components/PostInfo.js new file mode 100644 index 00000000..8b9b4983 --- /dev/null +++ b/themes/game/components/PostInfo.js @@ -0,0 +1,53 @@ +import NotionIcon from '@/components/NotionIcon' +import Link from 'next/link' +import TagItem from './TagItem' + +/** + * 文章详情页说明信息 + */ +export default function PostInfo(props) { + const { post } = props + + return ( +
+
+
+ {post?.type !== 'Page' && ( + <> + + {post?.category} + + + )} +
+ +

+ + {post?.title} +

+ + {post?.type !== 'Page' && ( + <> + + + )} +
+
+ ) +} diff --git a/themes/game/components/SideBarContent.js b/themes/game/components/SideBarContent.js index 1960b63f..e2efbeb3 100644 --- a/themes/game/components/SideBarContent.js +++ b/themes/game/components/SideBarContent.js @@ -1,5 +1,8 @@ +import { siteConfig } from '@/lib/config' +import { deepClone } from '@/lib/utils' import { useEffect, useRef } from 'react' import { useGameGlobal } from '..' +import CONFIG from '../config' import { GameListNormal } from './GameListNormal' import Logo from './Logo' @@ -7,9 +10,9 @@ import Logo from './Logo' * 侧拉抽屉的内容 */ export default function SideBarContent() { - const { allGames, sideBarVisible, setSideBarVisible, filterGames, setFilterGames } = useGameGlobal() + const { allNavPages, sideBarVisible, setSideBarVisible, filterGames, setFilterGames } = useGameGlobal() const inputRef = useRef(null) // 创建对输入框的引用 - + const allGames = deepClone(allNavPages) useEffect(() => { if (sideBarVisible) { setTimeout(() => { @@ -21,7 +24,9 @@ export default function SideBarContent() { const handleSearch = e => { const search = e.target.value if (!search || search === '') { - setFilterGames(allGames?.filter(item => item.recommend)) + setFilterGames( + allGames?.filter(item => item.tags?.some(t => t === siteConfig('GAME_RECOMMEND_TAG', 'Recommend', CONFIG))) + ) return } setFilterGames( diff --git a/themes/game/components/TagItem.js b/themes/game/components/TagItem.js index 0364e3fc..4f01fb72 100644 --- a/themes/game/components/TagItem.js +++ b/themes/game/components/TagItem.js @@ -1,11 +1,11 @@ import Link from 'next/link' const TagItem = ({ tag }) => ( - ( -

+ +

{tag}

- ) + ) export default TagItem diff --git a/themes/game/components/TagItemMini.js b/themes/game/components/TagItemMini.js new file mode 100644 index 00000000..3fe0c7bf --- /dev/null +++ b/themes/game/components/TagItemMini.js @@ -0,0 +1,21 @@ +import Link from 'next/link' + +const TagItemMini = ({ tag, selected = false }) => { + return ( + + {/* # {tag.name} */} + + # {tag.name}{' '} + + {tag.count ? `${tag.count}` : ''} + + + + ) +} + +export default TagItemMini diff --git a/themes/game/index.js b/themes/game/index.js index d7158faf..f65532ad 100644 --- a/themes/game/index.js +++ b/themes/game/index.js @@ -1,9 +1,11 @@ -import CusdisComponent from '@/components/CusdisComponent' +import Comment from '@/components/Comment' import { Draggable } from '@/components/Draggable' import { AdSlot } from '@/components/GoogleAdsense' import replaceSearchResult from '@/components/Mark' +import NotionPage from '@/components/NotionPage' +import ShareBar from '@/components/ShareBar' import { siteConfig } from '@/lib/config' -import { deepClone, isBrowser } from '@/lib/utils' +import { deepClone, isBrowser, shuffleArray } from '@/lib/utils' import Link from 'next/link' import { createContext, useContext, useEffect, useRef, useState } from 'react' import Announcement from './components/Announcement' @@ -16,8 +18,11 @@ import FullScreen from './components/FullScreen' import { GameListIndexCombine } from './components/GameListIndexCombine' import { GameListRelate } from './components/GameListRealate' import { GameListRecent } from './components/GameListRecent' +import GroupCategory from './components/GroupCategory' +import GroupTag from './components/GroupTag' import Header from './components/Header' -import NavBar from './components/NavBar' +import { MenuList } from './components/MenuList' +import PostInfo from './components/PostInfo' import SearchNavBar from './components/SearchNavBar' import SideBarContent from './components/SideBarContent' import SideBarDrawer from './components/SideBarDrawer' @@ -47,14 +52,22 @@ const LayoutBase = props => { const [filterGames, setFilterGames] = useState( deepClone( - allNavPages?.filter(item => item.tags?.some(t => t === siteConfig('GAME_RECOMMEND_TAG', 'Recommend', CONFIG))) + allNavPages?.filter(item => + item.tags?.some( + t => t === siteConfig('GAME_RECOMMEND_TAG', 'Recommend', CONFIG) + ) + ) ) ) const [recentGames, setRecentGames] = useState([]) const [sideBarVisible, setSideBarVisible] = useState(false) useEffect(() => { - setRecentGames(localStorage.getItem('recent_games') ? JSON.parse(localStorage.getItem('recent_games')) : []) + setRecentGames( + localStorage.getItem('recent_games') + ? JSON.parse(localStorage.getItem('recent_games')) + : [] + ) }, []) return ( @@ -74,37 +87,34 @@ const LayoutBase = props => { id='theme-game' className={`${siteConfig('FONT_STYLE')} w-full h-full min-h-screen justify-center bg-[#83FFE7] dark:bg-black dark:text-gray-300 scroll-smooth`}>