From 53ff5fa2dfe1ab8416ad4589a09132f560c40d75 Mon Sep 17 00:00:00 2001 From: Josh Gao Date: Sun, 9 Apr 2023 20:24:20 +0800 Subject: [PATCH] update some settings, enable dark mode --- _config.next.yml | 18 +-- _config.yml | 6 +- source/_data/styles.styl | 302 +++------------------------------------ 3 files changed, 31 insertions(+), 295 deletions(-) diff --git a/_config.next.yml b/_config.next.yml index c028147..84ef79f 100644 --- a/_config.next.yml +++ b/_config.next.yml @@ -42,7 +42,7 @@ custom_file_path: scheme: Gemini # Dark Mode -darkmode: false +darkmode: true # --------------------------------------------------------------- @@ -574,7 +574,7 @@ math: # Easily enable fast Ajax navigation on your website. # For more information: https://github.com/next-theme/pjax -pjax: false +pjax: true # FancyBox is a tool that offers a nice and elegant way to add zooming functionality for images. # For more information: https://fancyapps.com/fancybox/ @@ -602,8 +602,8 @@ quicklink: # Home page and archive page can be controlled through home and archive options below. # This configuration item is independent of `enable`. - home: false - archive: false + home: true + archive: true # Default (true) will initialize quicklink after the load event fires. delay: true @@ -700,8 +700,8 @@ disqusjs: # For more information: https://changyan.kuaizhan.com changyan: enable: false - appid: - appkey: + appid: cywCjT2Ce + appkey: c413e82874f27a2ebad90047ce54c0c1 # Show comments count count: true @@ -759,14 +759,14 @@ add_this_id: # Google Analytics # See: https://analytics.google.com google_analytics: - tracking_id: # + tracking_id: G-FS8FDJ89QM # By default, NexT will load an external gtag.js script on your site. # If you only need the pageview feature, set the following option to true to get a better performance. only_pageview: false # Baidu Analytics # See: https://tongji.baidu.com -baidu_analytics: # +baidu_analytics: 350182f3e243a2a441aad7e64040d3ce # Growingio Analytics # See: https://www.growingio.com @@ -774,7 +774,7 @@ growingio_analytics: # # Cloudflare Web Analytics # See: https://www.cloudflare.com/web-analytics/ -cloudflare_analytics: +cloudflare_analytics: 97f59b7e4ea54bd79d9c911c06f990de # Microsoft Clarity Analytics # See: https://clarity.microsoft.com/ diff --git a/_config.yml b/_config.yml index ca65796..4cebe73 100644 --- a/_config.yml +++ b/_config.yml @@ -107,15 +107,15 @@ theme: next # Deployment ## Docs: https://hexo.io/docs/one-command-deployment deploy: + - type: git + repo: josh@101.43.227.73:/home/josh/documents/josh-blog-deploy.git + branch: master - type: git repo: git@e.coding.net:josh-gao/josh-blog/josh-blog.git branch: master - type: git repo: git@github.com:JoshGao-bit/JoshGao-bit.github.io.git branch: master - - type: git - repo: git@101.43.227.73:/data/josh_blog.git - branch: master # MathJax [Redundant] # math: diff --git a/source/_data/styles.styl b/source/_data/styles.styl index c94d6f2..c4b99e9 100644 --- a/source/_data/styles.styl +++ b/source/_data/styles.styl @@ -1,298 +1,34 @@ // Custom styles. -// 网站最顶部条线的颜色 -// .headband { -// height: 3px; -// background: #222222; -// } - // 设置背景图片 body{ - // background:url('https://josh-blog-1257563604.cos.ap-beijing.myqcloud.com/img/backgroud.jpg'); - background:url(../images/bg.svg); - background-repeat:repeat; - // background-attachment:fixed; - // background-position:center; - // background-size:100% 100%; + // background:url('https://josh-blog-1257563604.cos.ap-beijing.myqcloud.com/img/backgroud.jpg'); + background:url(../images/bg.svg); + background-repeat:repeat; + // background-attachment:fixed; + // background-position:center; + // background-size:100% 100%; } -// 设置侧边栏左上角网站标题和副标题区颜色 -// .site-meta { -// background: #222222; +// 博客内容透明化 +// :root { +// --content-bg-color:rgba(255, 255, 255, 0.96); // } -// 设置侧边栏网站标题样式 -.site-title { - +@media (prefers-color-scheme: light) { + :root { + --content-bg-color:rgba(255, 255, 255, 0.96); + } } -// 设置侧边栏网站标题鼠标悬浮样式 -// .site-title:hover { -// letter-spacing: 0.1rem; -// } - -// 侧边栏网站副标题样式 -// .site-subtitle { -// color:#fff; -// } - -// 文章标题鼠标悬浮下划线样式 -// .posts-expand .post-title-link::before { -// content: ""; -// position: absolute; -// width: 100%; -// height: 2px; -// bottom: 0; -// left: 0; -// background-color: #222222; -// visibility: hidden; -// transform: scaleX(0); -// transition-duration: 0.2s; -// transition-timing-function: ease-in-out; -// transition-delay: 0s; -// } - -// // 文章标题颜色 -// .posts-expand .post-title-link { -// color:#222222; -// } - -// // 阅读全文按钮样式 -// .btn { -// border:2px solid #222222; -// color:#222222; -// } - -// // 阅读全文按钮鼠标悬浮样式 -// .btn:hover { -// border-color: #222222; -// color: #fff; -// background: #222222; -// } - -// // 设置文章和侧边栏中链接样式 -// a:hover, -// span.exturl:hover { -// color: #222222; -// border-bottom-color: #222222; -// } - -// // 修改文章页侧边栏文章目录下面的第一个标题的鼠标悬浮样式 -// // 真的有毒，文章目录第一个标题的样式还是单独设置的...一开始还没发现 -// .post-toc .nav .active-current > a:hover { -// color: #222222; -// } - -// // 文章页面左边文章标题颜色 -// .post-toc ol a:hover { -// color: #222222; -// border-bottom-color: #222222; -// } - -// // 文章页面左边文章标题active时颜色 -// .post-toc .nav .active > a { -// color: #222222; -// border-bottom-color: #222222; -// } - -// // 文章页侧边栏文章目录和站点概况鼠标悬浮样式 -// .sidebar-nav li:hover { -// color: #222222; -// } - -// // 文章页侧边栏文章目录和站点概况active时鼠标悬浮样式 -// .sidebar-nav .sidebar-nav-active:hover { -// color: #222222; -// } - -// // 文章页侧边栏文章目录和站点概况active时样式 -// .sidebar-nav .sidebar-nav-active { -// color: #222222; -// border-bottom-color: #222222; -// } - -// // 社交栏鼠标悬浮样式 -// #sidebar div.links-of-author.motion-element a:hover { -// color: #222222; -// background: rgba(255, 255, 255, 0); -// } - -// // 友链鼠标悬浮样式 -// .sidebar a:hover, -// .sidebar span.exturl:hover { -// border-bottom-color: #222222; -// color: #222222; -// } - -// RSS文字颜色 -//#sidebar div.feed-link.motion-element > a { -// color: #222222; -//} - -// RSS图标颜色 -//#sidebar div.feed-link.motion-element > a i{ -// color: #222222; -//} - -// 侧边栏日志、分类、标签 上面的数字的颜色 -// .site-state-item-count { -// color: #222222; -// } - -// 设置底部文章分页数字鼠标悬浮上划线颜色 -// .pagination .prev:hover, -// .pagination .next:hover, -// .pagination .page-number:hover { -// border-top-color: #222222; -// } - -// 设置文章页上一篇文章和下一篇文章鼠标悬浮样式 -// .post-nav-item a:hover { -// color: #222222; -// border-bottom: none; -// } - -// 修改鼠标选中字符的颜色 -/* webkit, opera, IE9 */ -// ::selection { -// background: #222222; -// color: #f7f7f7; -// } -/* firefox */ -// ::-moz-selection { -// background: #222222; -// color: #f7f7f7; -// } - -// 侧边栏返回顶部按钮鼠标悬浮样式 -// .back-to-top:hover { -// background: #eee; -// color: #222222; -// } - -// 当页面处于 首页、标签、分类、归档、关于页面其中之一时，处于哪个页面哪个选项就变蓝 -// #menu > li.menu-item-active > a { -// color: #222222; -// } - -// 侧边栏导航小圆点颜色 -// .menu-item-active a:after, -// .menu .menu-item a:hover:after, -// .menu .menu-item span.exturl:hover:after { -// background-color: #222222; -// } - -// 侧边栏上半部分设置为透明 -.menu-item-active a, -.menu .menu-item a:hover, -.menu .menu-item span.exturl:hover { - background: rgba(255, 255, 255, 0); - border-bottom-color: rgba(255, 255, 255, 0);; +@media (prefers-color-scheme: dark) { + :root { + --content-bg-color:rgba(0, 0, 0, 0.88); + } } -// 侧边栏下半部分设置为透明 -.sidebar{ - background: rgba(255, 255, 255, 0); -} -.sidebar-inner{ - background: rgba(255, 255, 255, 0.94); -} - -// 设置底部文章分页部分为透明 -.pagination{ - background: rgba(255, 255, 255, 0.94); -} -.pagination .page-number.current { - color: #fff; - background: #222222; -} - -// 导航栏底部百分比透明 -.back-to-top, -.back-to-top:hover -{ - background: rgba(255, 255, 255, 0); -} - -// 设置文章背景透明度 -.post-block{ - background: rgba(255, 255, 255, 0.94); -} - -// 这里需要完全透明，不然就会在上面的0.7基础上再进行透明度计算 -.btn{ - background: rgba(255, 255, 255, 0); -} - -.header-inner{ - background: rgba(255, 255, 255, 0.94); -} -.main-inner { - background: rgba(255, 255, 255, 0.94); -} - -// 代码高亮背景透明 -// .table-container{ -// background: rgba(29, 31, 33, 0.94); -// } -// table > tbody > tr:nth-of-type(odd) { -// background-color: rgba(29, 31, 33, 0); -// } -// table > tbody > tr:hover { -// background-color: rgba(29, 31, 33, 0); -// } -// pre, -// .highlight { -// background: rgba(29, 31, 33, 0); -// } -// .highlight .gutter pre { -// background: rgba(29, 31, 33, 0.94); -// } -// .highlight .code pre { -// background: rgba(29, 31, 33, 0); -// } - -// 评论 -.comments { - background: rgba(255, 255, 255, 0.94); -} - -// 文章页内作者信息 -.post-copyright { - border-left: 3px solid #222222; - background: rgba(255, 255, 255, 0.3); -} - -/* 行内代码块的自定义样式 */ -// code { -// color: #222222; -// background: rgba(220,220,220, 0.94); -// margin: 2px; -// border: 1px solid #90EE90; -// } - -// 底部动态的叶子图标 -// .with-love{ -// color: green; -// } - -// 去掉文章白色背景 -.main-inner { - background: rgba(255,255,255,0); -} - -// // 标签页链接下划线颜色 -// a, -// span.exturl { -// border-bottom: 1px solid #222222; -// } - -// // 标签页链接鼠标悬浮颜色 -// .tag-cloud a:hover { -// color: #222222 !important; -// } - +// 修复不蒜子显示属性被 hexo-helper-live2d 覆盖 #busuanzi_container_site_uv, #busuanzi_container_site_pv, #busuanzi_container_page_pv { display: inline !important; -} \ No newline at end of file +}