修复剩余的FontAwesome

This commit is contained in:
tangly1024
2022-02-28 12:20:59 +08:00
parent 52845d82b4
commit 63bcf46299
7 changed files with 9 additions and 23 deletions

View File

@@ -1,7 +1,5 @@
import React from 'react'
import Link from 'next/link'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faInfo } from '@fortawesome/free-solid-svg-icons'
/**
* 悬浮在屏幕右下角,联系我的按钮
@@ -14,7 +12,7 @@ const ContactButton = () => {
<a className={'fixed right-10 bottom-40 animate__fadeInRight animate__animated animate__faster'}>
<span
className='dark:bg-black bg-white px-5 py-3 cursor-pointer shadow-card text-xl hover:bg-blue-500 transform duration-200 hover:text-white hover:shadow'>
<FontAwesomeIcon icon={faInfo} className='dark:text-gray-200 ' title='about' />
<i className='dark:text-gray-200 fas fa-info' title='about' />
</span>
</a>
</Link>

View File

@@ -1,6 +1,4 @@
import { useGlobal } from '@/lib/global'
import { faMoon, faSun } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { loadUserThemeFromCookies, saveTheme } from '@/lib/theme'
const DarkModeButton = () => {
@@ -14,7 +12,7 @@ const DarkModeButton = () => {
changeTheme(newTheme)
}
return <div className='z-10 duration-200 text-xs cursor-pointer py-1.5 px-1'>
<FontAwesomeIcon icon={userTheme === 'dark' ? faSun : faMoon} id='darkModeButton' className='hover:scale-125 transform duration-200'
<i id='darkModeButton' className={`hover:scale-125 transform duration-200 fas ${userTheme === 'dark' ? 'fa-sun' : 'fa-moon'}`}
onClick={handleChangeDarkMode} />
</div>
}

View File

@@ -1,8 +1,6 @@
import React, { useEffect, useState } from 'react'
import throttle from 'lodash.throttle'
import DarkModeButton from './DarkModeButton'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faBars } from '@fortawesome/free-solid-svg-icons'
/**
* 左上角悬浮菜单栏
@@ -32,8 +30,7 @@ const LeftFloatButton = () => {
{/* 菜单折叠 */}
<div className='p-1 border hover:shadow-xl duration-200 dark:border-gray-500 h-12 bg-white dark:bg-gray-600 dark:bg-opacity-70 bg-opacity-70
dark:hover:bg-gray-100 text-xl cursor-pointer mr-2 my-2 dark:text-gray-300 dark:hover:text-black'>
<FontAwesomeIcon icon={faBars} className='p-2.5 hover:scale-125 transform duration-200'
onClick={() => changeCollapse(!collapse)} />
<i className='p-2.5 hover:scale-125 transform duration-200 fas fa-bars' onClick={() => changeCollapse(!collapse)} />
</div>
{/* 夜间模式 */}
<DarkModeButton />

View File

@@ -1,7 +1,5 @@
import React from 'react'
import Image from 'next/image'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faQrcode } from '@fortawesome/free-solid-svg-icons'
/**
* 赞赏按钮
@@ -23,7 +21,7 @@ const RewardButton = () => {
<div className='justify-center'>
<div onMouseEnter={openPopover} onMouseLeave={closePopover}
className='bg-pink-500 py-2 w-36 mx-auto animate__jello text-white hover:bg-green-400 duration-200 transform hover:scale-110 px-3 rounded cursor-pointer'>
<FontAwesomeIcon icon={faQrcode} className='mr-2' />
<i className='mr-2 fas fa-qrcode' />
<span>打赏一杯咖啡</span>
</div>

View File

@@ -1,7 +1,5 @@
import React from 'react'
import ShareBar from './ShareBar'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faShareAltSquare } from '@fortawesome/free-solid-svg-icons'
/**
* 悬浮在屏幕右下角,分享按钮
@@ -27,7 +25,7 @@ const ShareButton = ({ post }) => {
</div>
<div ref={btnRef}
className='z-20 border dark:border-gray-500 dark:bg-gray-600 bg-white cursor-pointer text-md hover:shadow-2xl shadow-lg'>
<FontAwesomeIcon icon={faShareAltSquare} className='transform duration-200 hover:scale-150 dark:text-gray-200 p-4' title='share' />
<i className='fas fa-share-alt-square transform duration-200 hover:scale-150 dark:text-gray-200 p-4' title='share' />
</div>
</div>
)

View File

@@ -48,7 +48,6 @@ const SideAreaLeft = (props) => {
<div key={locale.NAV.ABOUT} className='mb-5 bg-white dark:bg-gray-800 duration-200 py-6'>
<InfoCard />
<>
{/* <div className='px-5 text-sm font-light pb-1 text-gray-600 dark:text-gray-200'><FontAwesomeIcon icon={faChartBar} className='mr-2' />{locale.COMMON.ANALYTICS}</div> */}
<div className='mt-2 text-center dark:text-gray-300 font-light text-xs'>
<span className='px-1 '>
<strong className='font-medium'>{postCount}</strong>{locale.COMMON.POSTS}</span>

View File

@@ -2,8 +2,6 @@ import CategoryGroup from './CategoryGroup'
import InfoCard from './InfoCard'
import TagGroups from './TagGroups'
import { useGlobal } from '@/lib/global'
import { faAngleDoubleRight, faTag, faThList } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import Link from 'next/link'
import React from 'react'
@@ -32,10 +30,10 @@ const SideBar = ({ tags, currentTag, post, slot, categories, currentCategory })
{categories && (
<section className='mt-8'>
<div className='text-sm px-5 flex flex-nowrap justify-between font-light'>
<div className='text-gray-600 dark:text-gray-200'><FontAwesomeIcon icon={faThList} className='mr-2' />{locale.COMMON.CATEGORY}</div>
<div className='text-gray-600 dark:text-gray-200'><i className='mr-2 fas fa-th-list' />{locale.COMMON.CATEGORY}</div>
<Link href={'/category'} passHref>
<a className='mb-3 text-gray-400 hover:text-black dark:text-gray-400 dark:hover:text-white hover:underline cursor-pointer'>
{locale.COMMON.MORE} <FontAwesomeIcon icon={faAngleDoubleRight} />
{locale.COMMON.MORE} <i className='fas fa-angle-double-right'/>
</a>
</Link>
</div>
@@ -47,10 +45,10 @@ const SideBar = ({ tags, currentTag, post, slot, categories, currentCategory })
{tags && (
<section className='mt-4'>
<div className='text-sm py-2 px-5 flex flex-nowrap justify-between font-light dark:text-gray-200'>
<div className='text-gray-600 dark:text-gray-200'><FontAwesomeIcon icon={faTag} className='mr-2'/>{locale.COMMON.TAGS}</div>
<div className='text-gray-600 dark:text-gray-200'><i className='mr-2 fas fa-tag'/>{locale.COMMON.TAGS}</div>
<Link href={'/tag'} passHref>
<a className='text-gray-400 hover:text-black dark:hover:text-white hover:underline cursor-pointer'>
{locale.COMMON.MORE} <FontAwesomeIcon icon={faAngleDoubleRight} />
{locale.COMMON.MORE} <i className='fas fa-angle-double-right'/>
</a>
</Link>
</div>