Hexo 样式调整

This commit is contained in:
tangly1024
2022-02-28 15:31:09 +08:00
parent 8d91ad7110
commit d0dece5539
6 changed files with 9 additions and 9 deletions

View File

@@ -53,7 +53,7 @@ export const LayoutSlug = props => {
showTag={false} showTag={false}
floatSlot={floatSlot} floatSlot={floatSlot}
> >
<div className="w-full lg:shadow-xl lg:hover:shadow-2xl lg:border lg:border-gray-100 lg:rounded-xl lg:px-2 lg:py-4 lg:bg-white lg:dark:bg-gray-800 lg:duration-300"> <div className="w-full lg:shadow-md lg:hover:shadow-2xl lg:border lg:border-gray-100 lg:rounded-xl lg:px-2 lg:py-4 lg:bg-white lg:dark:bg-gray-800 lg:duration-300">
<ArticleDetail {...props} /> <ArticleDetail {...props} />
</div> </div>

View File

@@ -1,7 +1,7 @@
const Card = ({ children, headerSlot, className }) => { const Card = ({ children, headerSlot, className }) => {
return <div className={className}> return <div className={className}>
<>{headerSlot}</> <>{headerSlot}</>
<section className="shadow-xl hover:shadow-2xl border border-gray-100 rounded-xl px-2 py-4 bg-white dark:bg-gray-800 duration-300"> <section className="shadow-md hover:shadow-2xl border border-gray-100 rounded-xl px-2 py-4 bg-white dark:bg-gray-800 duration-300">
{children} {children}
</section> </section>
</div> </div>

View File

@@ -53,7 +53,7 @@ const Catalog = ({ toc }) => {
return <div className='px-3'> return <div className='px-3'>
<div className='w-full'><i className='mr-1 fas fa-stream' /> 目录</div> <div className='w-full'><i className='mr-1 fas fa-stream' /> 目录</div>
<div className='w-full py-1'> <div className='w-full py-3'>
<Progress/> <Progress/>
</div> </div>
<nav className='font-sans overflow-y-auto scroll-hidden text-black'> <nav className='font-sans overflow-y-auto scroll-hidden text-black'>

View File

@@ -25,9 +25,9 @@ const LatestPostsGroup = ({ posts }) => {
const selected = currentPath === `${BLOG.PATH}/article/${post.slug}` const selected = currentPath === `${BLOG.PATH}/article/${post.slug}`
return ( return (
<Link key={post.id} title={post.title} href={`${BLOG.PATH}/article/${post.slug}`} passHref> <Link key={post.id} title={post.title} href={`${BLOG.PATH}/article/${post.slug}`} passHref>
<a className={ 'my-1 flex font-light'}> <a className={ 'my-1 mx-5 flex font-light'}>
<div className={ (selected ? 'text-white bg-blue-600 ' : 'text-gray-500 dark:text-gray-400 ') + ' text-xs py-1.5 flex overflow-x-hidden whitespace-nowrap hover:bg-blue-600 px-2 duration-200 w-full ' + <div className={ (selected ? 'text-white bg-blue-400 ' : 'text-gray-500 dark:text-gray-400 ') + ' text-xs py-1.5 flex overflow-x-hidden whitespace-nowrap hover:bg-blue-400 px-2 duration-200 w-full rounded ' +
'hover:text-white dark:hover:text-white cursor-pointer' }> 'hover:text-white dark:hover:text-white cursor-pointer items-center'}>
<i className='mr-2 fas fa-file-alt'/> <i className='mr-2 fas fa-file-alt'/>
<div className='truncate'>{post.title}</div> <div className='truncate'>{post.title}</div>
</div> </div>

View File

@@ -25,8 +25,8 @@ const MenuButtonGroup = (props) => {
if (link.show) { if (link.show) {
const selected = (router.pathname === link.to) || (router.asPath === link.to) const selected = (router.pathname === link.to) || (router.asPath === link.to)
return <Link key={`${link.id}-${link.to}`} title={link.to} href={link.to} > return <Link key={`${link.id}-${link.to}`} title={link.to} href={link.to} >
<a className={'py-1.5 my-1 px-5 duration-300 text-base justify-between hover:bg-blue-600 hover:text-white hover:shadow-lg cursor-pointer flex flex-nowrap items-center ' + <a className={'py-1.5 my-1 px-5 duration-300 text-base justify-between hover:bg-blue-400 rounded-md hover:text-white hover:shadow-lg cursor-pointer flex flex-nowrap items-center ' +
(selected ? 'bg-blue-600 text-white' : ' ')} > (selected ? 'bg-blue-400 rounded-md text-white' : ' ')} >
<div className='my-auto items-center justify-center flex '> <div className='my-auto items-center justify-center flex '>
<i className={link.icon} /> <i className={link.icon} />
<div className={'ml-4'}>{link.name}</div> <div className={'ml-4'}>{link.name}</div>

View File

@@ -29,7 +29,7 @@ const Progress = ({ targetRef, showPercent = true }) => {
return ( return (
<div className="h-4 w-full shadow-2xl bg-gray-400 font-sans"> <div className="h-4 w-full shadow-2xl bg-gray-400 font-sans">
<div <div
className="h-4 bg-blue-600 duration-200" className="h-4 bg-blue-400 duration-200"
style={{ width: `${percent}%` }} style={{ width: `${percent}%` }}
> >
{showPercent && ( {showPercent && (