hexo-theme-butterfly/source/css/_mode/darkmode.styl
Jerry 321091befb Breaking Change
1. 不再支持hexo 4.0.0以下版本
2. 添加hexo fragment_cache,加快生成速度
3. 完善V5圖標顯示,不再需要同時加載V4和v5圖標
4. 去除cheerio依賴
5. 整合豆瓣配置,增加配置遊戲,圖書頁面top_img,可設置是否設置meta,解決部分瀏覽器無法顯示圖片問題
6. 友情鏈接除列表外可自定義內容
7. 可設置主頁標題距離頂部距離
8. 側邊欄可隱藏,可設置手機頁面是否隱藏
9. 增加disqusjs和utterances 兩個評論
10. 主頁文章增加tags和更新日期顯示,可以配置post_meta
11. 首頁subtitle可關閉打字效果,可設置打字效果顯示一次或loop
12. 增加valine和gitalk的配置
13. darkmode配置整理
14. 增加404頁面
15. post_beautify改為beautify,頁面美化不再只限於post頁,page頁也一樣
16. 可設置是否顯示cover,可設置各位置的cover顯示
17. 增加mermaid,可畫流程圖、狀態圖、時序圖、甘特圖等等
18. 增加pangu配置,中英文之間添加空格
19. 整合部分配置
20. post-copyright增加decode網址 (可以顯示中文)
21. 增加部分顏色配置
Feature
1. 適配IE
2. 增加一個Tag Plugins: 圖庫集
3. 增加一個Tag Plugins: tag-hide 功能 inline/block
4. 去除page頁開頭顯示與標題一樣的內容
5. aside 公告欄設置,支持html代碼
6. 手機界面sidebar顯示進度條和加深對應的標題
7. 主頁subtitle 的 hitokoto 顯示內容出處
9. footer 的hexo鏈接改為https
10. 修改手機下,menus和toc的打開效果
11. 手機頁面下,搜索界面全屏顯示
12. SEO優化,標題欄改為h1顯示
13. 閲讀模式優化,可根據light mode 和darkmode調整背景
14. 當屏蔽js時,header會出現(之前用js控制,會隱藏)
Fixed
1. 修復Tencent Analytics的script加載為https #105
2. 修復相關文章,日期顯示錯誤bug
3. 修復gitalk報錯問題
4. 修復當valine background 是絕對地址時無法顯示的bug
5. 修復medium-zoom 無法使用的bug
6. 修復在safari下,點擊或移動到首頁文章cover,圓角變成正方形的bug #114
7. 修復在部分瀏覽器下,aside,友情鏈接頭像轉動變形的bug
8. 修復在寬度限制下,表格內容溢出屏幕外而出現滾動條的bug \#138
9. 修復gitalk js 在一些沒有設置評論的page里加載的bug
10. 修復tag plugins 的gist 在不同主題下的背景顏色問題(黑色主題下,文字不易觀看)
11. 修復highlight figcaption 顯示不全的bug
12. 修復disqus評論數無法獲取的bug
13. 修復子目錄在觸摸屏下點擊,偶爾不出現的bug
14. 修復a標籤太長(連續英文字母)不會換行的bug
15. 修復toc滾動時,閲讀進度條也跟著滾動的bug
16. 修復aside的圖片,可點擊顯示大圖bug
17. 修復activate-power-mode設置參數無效bug
18. 修復語言上的錯誤 \#156
19. 修復主頁在safari桌面端,首頁滾動卡頓的bug
2020-03-17 21:28:27 +08:00

371 lines
8.0 KiB
Stylus
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

if hexo-config('darkmode.enable')
[data-theme='dark']
body
background-color: darken(#121212, 2)
color: alpha(#FFFFFF, .6)
::-webkit-scrollbar-thumb
background: lighten(#121212, 5)
// footer
#web_bg[data-type=color],
#footer[data-type=color]
background: darken(#121212, 2)
#web_bg[data-type=photo]:before,
#footer[data-type=photo]:before
position: absolute
width: 100%
height: 100%
background-color: alpha($dark-black, .7)
content: ''
#nav,
.layout_post > #post,
.layout_page > div:first-child:not(.recent-posts)
background-color: #121212
#sidebar
background: #121212
box-shadow: -.25rem 0 .25rem #121212
#article-container code
background: #2c2c2c
.recent-posts
.recent-post-item
background: #121212 !important
.article-title
color: alpha(#FFFFFF, .8) !important
#page-header
&.fixed
background: alpha(#121212, .8)
box-shadow: 0 5px 6px -5px rgba(133, 133, 133, 0)
.toggle-menu,
#site-name,
a
color: alpha(#FFFFFF, .8)
.menus_item_child
background-color: lighten(#121212, 5) !important
li
&:hover
background: lighten(#121212, 20)
a
color: alpha(#FFFFFF, .6)
//
#article-container pre,
#article-container pre code
background-color: lighten(#121212, 2)
.highlight-tools
background: lighten(#121212, 3)
#article-container .highlight:not(.js-file-line-container)
background-color: lighten(#121212, 2)
.code pre,
.gutter pre
background-color: lighten(#121212, 2)
table
.copy-notice
background: lighten(#121212, 3)
.copy-notice
background: lighten(#121212, 3)
blockquote
background-color: lighten(#121212, 10)
color: alpha(#FFFFFF, .6)
hr
border: 2px dashed alpha(#FFFFFF, .3)
background: 0
&:before
color: alpha(#FFFFFF, .6)
.layout_post .tag_share .post-meta__tags
border: 1px solid alpha(#FFFFFF, .6)
color: alpha(#FFFFFF, .6)
&:hover
background: darken(#FFFFFF, 60)
//
.post-copyright
border: 1px solid alpha(#FFFFFF, .6)
.post-copyright-meta
color: alpha(#FFFFFF, .8)
.post-copyright-info
color: alpha(#FFFFFF, .6)
//
.aplayer
filter: brightness(.7)
color: $dark-black
//
#rightside
& > div
& > i,
& > a,
& > div
background-color: lighten(#121212, 5) !important
color: alpha(#FFFFFF, .6) !important
&:hover
background: lighten(#121212, 20) !important
//
.post-reward
.reward-button
background-color: lighten(#121212, 10) !important
.reward-all
background-color: lighten(#121212, 10) !important
&:after
border-top: 13px solid lighten(#121212, 10) !important
.md-links-item:before,
.aside-category-list:hover,
.archive-list-item:hover,
#bookmark-it
background-color: lighten(#121212, 10) !important
img,
iframe:not(.utterances-frame),
.gist
filter: brightness(.7)
//
#aside_content
.card-widget
background: #121212 !important
.headline,
.length_num,
.aside-post_title,
.aside-category-list_link,
.archive-list-link,
.social-icon
color: alpha(#FFFFFF, .6) !important
.button--animated:before
background: lighten(#121212, 20) !important
//
#nav
&:before
position: absolute
top: 0
right: 0
bottom: 0
left: 0
background-color: alpha($dark-black, .7)
content: ''
#nav span,
#nav i,
#page-header a,
#page-header .toggle-menu,
#post-meta,
#post-meta a,
#footer-wrap,
#footer-wrap a
color: alpha(#FFFFFF, .6) !important
.posttitle,
h1,
h2,
h3,
h4,
h5,
h6
color: alpha(#FFFFFF, .8)
.recent-posts .post-meta__date,
.recent-posts .article-meta,
.recent-posts a,
.post-reward .reward-button,
.fa-clipboard,
.gutter pre,
#bookmark-it,
.copy-notice,
.md-links-item a,
.category-list-link,
.relatedPosts_date,
.prev-post .label,
.next-post .label
color: alpha(#FFFFFF, .6) !important
.prev_info,
.next_info,
.relatedPosts_title
color: alpha(#FFFFFF, .8) !important
//
.article-sort-item__title
color: alpha(#FFFFFF, .6)
&:hover
color: #49b1f5
// MENU,TOC
#mobile-sidebar
#mobile-sidebar-menus
background: #121212
.headline
color: alpha(#FFFFFF, .6) !important
.length_num
color: alpha(#FFFFFF, .8) !important
a
color: alpha(#FFFFFF, .6) !important
// note
if hexo-config('note.style') == 'modern'
.note
filter: brightness(.7)
if hexo-config('note.style') == 'flat'
.note
filter: brightness(.7)
color: #4c4948
//
// hexo-blog-encrypt
#hexo-blog-encrypt
label,
input
color: alpha(#FFFFFF, .6) !important
input
background-color: #121212
if hexo-config('gitalk') && hexo-config('gitalk.enable')
#gitalk-container
.gt-header-textarea,
.gt-header-preview,
.gt-comment-content,
button,
.gt-popup
filter: brightness(.7)
svg
fill: alpha(#FFFFFF, .6) !important
if hexo-config('valine') && hexo-config('valine.enable')
//
#vcomment
p,
a,
textarea,
.vemoji-btn,
.vpreview-btn,
input,
path,
.vcount,
.vnum,
.vtime,
.vsys,
.vsys,
.vnick
color: alpha(#FFFFFF, .6) !important
.vsys
background: rgb(97, 106, 107) !important
.vbtn,
.vat
border: 1px solid alpha(#FFFFFF, .6)
background: lighten(#121212, 5) !important
color: alpha(#FFFFFF, .6) !important
&:hover
background: lighten(#121212, 20) !important
.vwrap
border: 1px solid alpha(#FFFFFF, .6)
input
border-bottom: 1px dashed #616a6b
.vh
border-bottom: 1px dashed #616a6b
pre
border: 1px solid alpha(#FFFFFF, .6)
background-color: #121212
code
background: transparent
code
background-color: #2c2c2c
color: alpha(#FFFFFF, .6)
.vcontent.expand:before
background: linear-gradient(180deg, hsla(0, 0, 0, 0), hsl(218, 8%, 19%))
.vcontent.expand:after
background: hsla(204, 5%, 22%, 1)
if hexo-config('local_search') && hexo-config('local_search.enable')
#local-search
background: #121212
.local-search-box--input
background: #121212
color: alpha(#FFFFFF, .6)
.search-result-title
color: alpha(#FFFFFF, .6)
if hexo-config('algolia_search.enable')
#algolia-search
background: #121212
.ais-search-box--input
background: #121212
color: alpha(#FFFFFF, .6)
#algolia-search-results
.algolia-hit-item-link
color: alpha(#FFFFFF, .6)
if hexo-config('disqusjs.enable')
#disqus_thread
#dsqjs
.dsqjs-tab-active,
.dsqjs-no-comment
color: alpha(#FFFFFF, .6)
.dsqjs-order-label
background-color: lighten(#121212, 5)
.dsqjs-post-body
color: alpha(#FFFFFF, .6)
code,
pre
background: #2c2c2c
blockquote
color: alpha(#FFFFFF, .6)
.mermaid
filter: brightness(.7)