${array[i].nick} /
34 | .*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
9 | content = content.replace(/.*?<\/code>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
10 | content = content.replace(/<[^>]+>/g, "") // remove html tag
11 |
12 | if (content.length > 150) {
13 | content = content.substring(0, 150) + '...'
14 | }
15 | return content
16 | },
17 |
18 | generateHtml: (array, ele) => {
19 | let result = ''
20 |
21 | if (array.length) {
22 | for (let i = 0; i < array.length; i++) {
23 | result += ''
24 |
25 | if (!{theme.aside.card_newest_comments.avatar} && array[i].avatar) {
26 | const imgAttr = '!{theme.lazyload.enable && !theme.lazyload.native ? "data-lazy-src" : "src"}'
27 | const lazyloadNative = '!{theme.lazyload.enable && theme.lazyload.native ? "loading=\"lazy\"" : ""}'
28 | result += `![${array[i].nick}]()
`
29 | }
30 |
31 | result += `
32 | ${array[i].content}
33 | `
35 | }
36 | } else {
37 | result += '!{_p("aside.card_newest_comments.zero")}'
38 | }
39 |
40 | ele.innerHTML = result
41 | window.lazyLoadInstance && window.lazyLoadInstance.update()
42 | window.pjax && window.pjax.refresh(ele)
43 | },
44 |
45 | newestCommentInit: (name, getComment) => {
46 | const $dom = document.querySelector('#card-newest-comments .aside-list')
47 | if ($dom) {
48 | const data = btf.saveToLocal.get(name)
49 | if (data) {
50 | newestComments.generateHtml(JSON.parse(data), $dom)
51 | } else {
52 | getComment($dom)
53 | }
54 | }
55 | },
56 |
57 | run: (name, getComment) => {
58 | newestComments.newestCommentInit(name, getComment)
59 | btf.addGlobalFn('pjaxComplete', () => newestComments.newestCommentInit(name, getComment), name)
60 | }
61 | }
--------------------------------------------------------------------------------
/layout/includes/third-party/newest-comments/disqus-comment.pug:
--------------------------------------------------------------------------------
1 | != partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
2 |
3 | script.
4 | window.addEventListener('load', () => {
5 | const keyName = 'disqus-newest-comments'
6 | const { changeContent, generateHtml, run } = window.newestComments
7 |
8 | const getComment = ele => {
9 | fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{forum}&related=thread&limit=!{newestCommentsLimit}&api_key=!{apiKey}')
10 | .then(response => response.json())
11 | .then(data => {
12 | const disqusArray = data.response.map(item => {
13 | return {
14 | 'avatar': item.author.avatar.cache,
15 | 'content': changeContent(item.message),
16 | 'nick': item.author.name,
17 | 'url': item.url,
18 | 'date': item.createdAt
19 | }
20 | })
21 |
22 | btf.saveToLocal.set(keyName, JSON.stringify(disqusArray), !{theme.aside.card_newest_comments.storage}/(60*24))
23 | generateHtml(disqusArray, ele)
24 | }).catch(e => {
25 | console.error(e)
26 | ele.textContent= "!{_p('aside.card_newest_comments.error')}"
27 | })
28 | }
29 |
30 | run(keyName, getComment)
31 | })
32 |
33 |
34 |
35 |
--------------------------------------------------------------------------------
/layout/includes/third-party/newest-comments/github-issues.pug:
--------------------------------------------------------------------------------
1 | != partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
2 |
3 | script.
4 | window.addEventListener('load', () => {
5 | const keyName = 'github-newest-comments'
6 | const { changeContent, generateHtml, run } = window.newestComments
7 |
8 | const findTrueUrl = (array, ele) => {
9 | Promise.all(array.map(item =>
10 | fetch(item.url).then(resp => resp.json()).then(data => {
11 | let urlArray = data.body ? data.body.match(/(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?/ig) : []
12 | if (!Array.isArray(urlArray) || urlArray.length === 0) {
13 | urlArray = [`${data.html_url}`]
14 | }
15 | if (data.user.login === 'utterances-bot') {
16 | return urlArray.pop()
17 | } else {
18 | return urlArray.shift()
19 | }
20 | })
21 | )).then(res => {
22 | array = array.map((i,index)=> {
23 | return {
24 | ...i,
25 | url: res[index]
26 | }
27 | })
28 |
29 | btf.saveToLocal.set(keyName, JSON.stringify(array), !{theme.aside.card_newest_comments.storage}/(60*24))
30 | generateHtml(array, ele)
31 | });
32 | }
33 |
34 | const getComment = ele => {
35 | fetch('https://api.github.com/repos/!{userRepo}/issues/comments?sort=updated&direction=desc&per_page=!{newestCommentsLimit}&page=1',{
36 | "headers": {
37 | Accept: 'application/vnd.github.v3.html+json'
38 | }
39 | })
40 | .then(response => response.json())
41 | .then(data => {
42 | const githubArray = data.map(item => {
43 | return {
44 | 'avatar': item.user.avatar_url,
45 | 'content': changeContent(item.body_html || item.body),
46 | 'nick': item.user.login,
47 | 'url': item.issue_url,
48 | 'date': item.updated_at
49 | }
50 | })
51 | findTrueUrl(githubArray, ele)
52 | }).catch(e => {
53 | console.error(e)
54 | ele.textContent= "!{_p('aside.card_newest_comments.error')}"
55 | })
56 | }
57 | run(keyName, getComment)
58 | })
59 |
60 |
61 |
62 |
63 |
--------------------------------------------------------------------------------
/layout/includes/third-party/newest-comments/index.pug:
--------------------------------------------------------------------------------
1 | - let { use } = theme.comments
2 |
3 | if use
4 | -
5 | let forum,apiKey,userRepo
6 | let { limit:newestCommentsLimit } = theme.aside.card_newest_comments
7 | if (newestCommentsLimit > 10 || newestCommentsLimit < 1) newestCommentsLimit = 6
8 |
9 | case use[0]
10 | when 'Valine'
11 | include ./valine.pug
12 | when 'Waline'
13 | include ./waline.pug
14 | when 'Twikoo'
15 | include ./twikoo-comment.pug
16 | when 'Disqus'
17 | - forum = theme.disqus.shortname
18 | - apiKey = theme.disqus.apikey
19 | include ./disqus-comment.pug
20 | when 'Disqusjs'
21 | - forum = theme.disqusjs.shortname
22 | - apiKey = theme.disqusjs.apikey
23 | include ./disqus-comment.pug
24 | when 'Gitalk'
25 | - let { repo,owner } = theme.gitalk
26 | - userRepo = owner + '/' + repo
27 | include ./github-issues.pug
28 | when 'Utterances'
29 | - userRepo = theme.utterances.repo
30 | include ./github-issues.pug
31 | when 'Remark42'
32 | include ./remark42.pug
33 | when 'Artalk'
34 | include ./artalk.pug
--------------------------------------------------------------------------------
/layout/includes/third-party/newest-comments/remark42.pug:
--------------------------------------------------------------------------------
1 | - const { host, siteId } = theme.remark42
2 | != partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
3 |
4 | script.
5 | window.addEventListener('load', () => {
6 | const keyName = 'remark42-newest-comments'
7 | const { changeContent, generateHtml, run } = window.newestComments
8 |
9 | const getComment = ele => {
10 | fetch('!{host}/api/v1/last/!{newestCommentsLimit}?site=!{siteId}')
11 | .then(response => response.json())
12 | .then(data => {
13 | const remark42 = data.map(e => {
14 | return {
15 | 'avatar': e.user.picture,
16 | 'content': changeContent(e.text),
17 | 'nick': e.user.name,
18 | 'url': e.locator.url,
19 | 'date': e.time,
20 | }
21 | })
22 | btf.saveToLocal.set(keyName, JSON.stringify(remark42), !{theme.aside.card_newest_comments.storage}/(60*24))
23 | generateHtml(remark42, ele)
24 | }).catch(e => {
25 | console.error(e)
26 | ele.textContent= "!{_p('aside.card_newest_comments.error')}"
27 | })
28 | }
29 |
30 | run(keyName, getComment)
31 | })
32 |
--------------------------------------------------------------------------------
/layout/includes/third-party/newest-comments/twikoo-comment.pug:
--------------------------------------------------------------------------------
1 | != partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
2 |
3 | script.
4 | window.addEventListener('load', () => {
5 | const keyName = 'twikoo-newest-comments'
6 | const { changeContent, generateHtml, run } = window.newestComments
7 |
8 | const getComment = ele => {
9 | const runTwikoo = () => {
10 | twikoo.getRecentComments({
11 | envId: '!{theme.twikoo.envId}',
12 | region: '!{theme.twikoo.region}',
13 | pageSize: !{newestCommentsLimit},
14 | includeReply: true
15 | }).then(res => {
16 | const twikooArray = res.map(e => {
17 | return {
18 | 'content': changeContent(e.comment),
19 | 'avatar': e.avatar,
20 | 'nick': e.nick,
21 | 'url': e.url + '#' + e.id,
22 | 'date': new Date(e.created).toISOString()
23 | }
24 | })
25 |
26 | btf.saveToLocal.set(keyName, JSON.stringify(twikooArray), !{theme.aside.card_newest_comments.storage}/(60*24))
27 | generateHtml(twikooArray, ele)
28 | }).catch(err => {
29 | console.error(err)
30 | ele.textContent= "!{_p('aside.card_newest_comments.error')}"
31 | })
32 | }
33 |
34 | if (typeof twikoo === 'object') {
35 | runTwikoo()
36 | } else {
37 | btf.getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo)
38 | }
39 | }
40 |
41 | run(keyName, getComment)
42 | })
43 |
44 |
45 |
46 |
--------------------------------------------------------------------------------
/layout/includes/third-party/newest-comments/valine.pug:
--------------------------------------------------------------------------------
1 | - let default_avatar = theme.valine.avatar
2 |
3 | script(src=url_for(theme.asset.blueimp_md5))
4 | != partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
5 |
6 | script.
7 | window.addEventListener('load', () => {
8 | const keyName = 'valine-newest-comments'
9 | const { changeContent, generateHtml, run } = window.newestComments
10 |
11 | const getIcon = (icon, mail) => {
12 | if (icon) return icon
13 | let defaultIcon = '!{ default_avatar ? `?d=${default_avatar}` : ''}'
14 | let iconUrl = `https://gravatar.loli.net/avatar/${md5(mail.toLowerCase()) + defaultIcon}`
15 | return iconUrl
16 | }
17 |
18 | const getComment = ele => {
19 | const serverURL = '!{theme.valine.serverURLs || `https://${theme.valine.appId.substring(0,8)}.api.lncldglobal.com` }'
20 |
21 | var settings = {
22 | "method": "GET",
23 | "headers": {
24 | "X-LC-Id": '!{theme.valine.appId}',
25 | "X-LC-Key": '!{theme.valine.appKey}',
26 | "Content-Type": "application/json"
27 | },
28 | }
29 |
30 | fetch(`${serverURL}/1.1/classes/Comment?limit=!{newestCommentsLimit}&order=-createdAt`,settings)
31 | .then(response => response.json())
32 | .then(data => {
33 | const valineArray = data.results.map(e => {
34 | return {
35 | 'avatar': getIcon(e.QQAvatar, e.mail),
36 | 'content': changeContent(e.comment),
37 | 'nick': e.nick,
38 | 'url': e.url + '#' + e.objectId,
39 | 'date': e.updatedAt,
40 | }
41 | })
42 | btf.saveToLocal.set(keyName, JSON.stringify(valineArray), !{theme.aside.card_newest_comments.storage}/(60*24))
43 | generateHtml(valineArray, ele)
44 | }).catch(e => {
45 | console.error(e)
46 | ele.textContent= "!{_p('aside.card_newest_comments.error')}"
47 | })
48 | }
49 |
50 | run(keyName, getComment)
51 | })
52 |
--------------------------------------------------------------------------------
/layout/includes/third-party/newest-comments/waline.pug:
--------------------------------------------------------------------------------
1 | - const serverURL = theme.waline.serverURL.replace(/\/$/, '')
2 |
3 | != partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
4 |
5 | script.
6 | window.addEventListener('load', () => {
7 | const keyName = 'waline-newest-comments'
8 | const { changeContent, generateHtml, run } = window.newestComments
9 |
10 | const getComment = async (ele) => {
11 | try {
12 | const res = await fetch('!{serverURL}/api/comment?type=recent&count=!{newestCommentsLimit}')
13 | const result = await res.json()
14 | const walineArray = result.data.map(e => {
15 | return {
16 | 'content': changeContent(e.comment),
17 | 'avatar': e.avatar,
18 | 'nick': e.nick,
19 | 'url': e.url + '#' + e.objectId,
20 | 'date': e.time || e.insertedAt
21 | }
22 | })
23 | btf.saveToLocal.set(keyName, JSON.stringify(walineArray), !{theme.aside.card_newest_comments.storage}/(60*24))
24 | generateHtml(walineArray, ele)
25 | } catch (err) {
26 | console.error(err)
27 | ele.textContent= "!{_p('aside.card_newest_comments.error')}"
28 | }
29 | }
30 |
31 | run(keyName, getComment)
32 | })
33 |
--------------------------------------------------------------------------------
/layout/includes/third-party/pjax.pug:
--------------------------------------------------------------------------------
1 | - var pjaxExclude = 'a:not([target="_blank"])'
2 | if theme.pjax.exclude
3 | each val in theme.pjax.exclude
4 | - pjaxExclude += `:not([href="${val}"])`
5 |
6 | - let pjaxSelectors = ['head > title', '#config-diff', '#body-wrap', '#rightside-config-hide', '#rightside-config-show', '.js-pjax']
7 |
8 | - let choose = theme.comments.use
9 | if choose
10 | if choose.includes('Livere') || choose.includes('Utterances') || choose.includes('Giscus')
11 | - pjaxSelectors.unshift('link[rel="canonical"]')
12 | if theme.Open_Graph_meta.enable
13 | - pjaxSelectors.unshift('meta[property="og:image"]', 'meta[property="og:title"]', 'meta[property="og:url"]', 'meta[property="og:description"]')
14 | else
15 | - pjaxSelectors.unshift('meta[name="description"]')
16 |
17 | script(src=url_for(theme.asset.pjax))
18 | script.
19 | (() => {
20 | const pjaxSelectors = !{JSON.stringify(pjaxSelectors)}
21 |
22 | window.pjax = new Pjax({
23 | elements: '!{pjaxExclude}',
24 | selectors: pjaxSelectors,
25 | cacheBust: false,
26 | analytics: !{theme.google_analytics ? true : false},
27 | scrollRestoration: false
28 | })
29 |
30 | const triggerPjaxFn = (val) => {
31 | if (!val) return
32 | Object.values(val).forEach(fn => fn())
33 | }
34 |
35 | document.addEventListener('pjax:send', () => {
36 | // removeEventListener
37 | btf.removeGlobalFnEvent('pjaxSendOnce')
38 | btf.removeGlobalFnEvent('themeChange')
39 |
40 | // reset readmode
41 | const $bodyClassList = document.body.classList
42 | if ($bodyClassList.contains('read-mode')) $bodyClassList.remove('read-mode')
43 |
44 | triggerPjaxFn(window.globalFn.pjaxSend)
45 | })
46 |
47 | document.addEventListener('pjax:complete', () => {
48 | btf.removeGlobalFnEvent('pjaxCompleteOnce')
49 | document.querySelectorAll('script[data-pjax]').forEach(item => {
50 | const newScript = document.createElement('script')
51 | const content = item.text || item.textContent || item.innerHTML || ""
52 | Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
53 | newScript.appendChild(document.createTextNode(content))
54 | item.parentNode.replaceChild(newScript, item)
55 | })
56 |
57 | triggerPjaxFn(window.globalFn.pjaxComplete)
58 | })
59 |
60 | document.addEventListener('pjax:error', e => {
61 | if (e.request.status === 404) {
62 | const usePjax = !{theme.pjax && theme.pjax.enable}
63 | !{theme.error_404 && theme.error_404.enable}
64 | ? (usePjax ? pjax.loadUrl('!{url_for("/404.html")}') : window.location.href = '!{url_for("/404.html")}')
65 | : window.location.href = e.request.responseURL
66 | }
67 | })
68 | })()
--------------------------------------------------------------------------------
/layout/includes/third-party/prismjs.pug:
--------------------------------------------------------------------------------
1 | - const { prismjs_js, prismjs_autoloader, prismjs_lineNumber_js } = theme.asset
2 | - const { prismjs, syntax_highlighter } = config
3 | - const { enable, preprocess, line_number } = prismjs
4 |
5 | if (syntax_highlighter === 'prismjs' || enable) && !preprocess
6 | script.
7 | (() => {
8 | window.Prism = window.Prism || {}
9 | window.Prism.manual = true
10 |
11 | const highlightAll = () => {
12 | window.Prism.highlightAll()
13 | }
14 |
15 | window.addEventListener('load', highlightAll)
16 | btf.addGlobalFn('pjaxComplete', highlightAll, 'prismjs')
17 | btf.addGlobalFn('encrypt', highlightAll, 'prismjs')
18 | })()
19 |
20 | script(src=url_for(prismjs_js))
21 | script(src=url_for(prismjs_autoloader))
22 | if (line_number)
23 | script(src=url_for(prismjs_lineNumber_js))
--------------------------------------------------------------------------------
/layout/includes/third-party/search/algolia.pug:
--------------------------------------------------------------------------------
1 | #algolia-search
2 | .search-dialog
3 | nav.search-nav
4 | span.search-dialog-title= _p('search.title')
5 | button.search-close-button
6 | i.fas.fa-times
7 |
8 | .search-wrap
9 | #algolia-search-input
10 | hr
11 | #algolia-search-results
12 | #algolia-hits
13 | #algolia-pagination
14 | #algolia-info
15 | .algolia-stats
16 | .algolia-poweredBy
17 |
18 | #search-mask
19 |
20 | script(src=url_for(theme.asset.algolia_search))
21 | script(src=url_for(theme.asset.instantsearch))
22 | script(src=url_for(theme.asset.algolia_js))
--------------------------------------------------------------------------------
/layout/includes/third-party/search/docsearch.pug:
--------------------------------------------------------------------------------
1 | - const { placeholder, docsearch: { appId, apiKey, indexName, option } } = theme.search
2 |
3 | .docsearch-wrap
4 | #docsearch(style="display:none")
5 | link(rel="stylesheet" href=url_for(theme.asset.docsearch_css))
6 | script(src=url_for(theme.asset.docsearch_js))
7 | script.
8 | (() => {
9 | docsearch(Object.assign({
10 | appId: '!{appId}',
11 | apiKey: '!{apiKey}',
12 | indexName: '!{indexName}',
13 | container: '#docsearch',
14 | placeholder: '!{ placeholder || _p("search.input_placeholder")}',
15 | }, !{JSON.stringify(option)}))
16 |
17 | const handleClick = () => {
18 | document.querySelector('.DocSearch-Button').click()
19 | }
20 |
21 | const searchClickFn = () => {
22 | btf.addEventListenerPjax(document.querySelector('#search-button > .search'), 'click', handleClick)
23 | }
24 |
25 | searchClickFn()
26 | window.addEventListener('pjax:complete', searchClickFn)
27 | })()
28 |
29 |
30 |
--------------------------------------------------------------------------------
/layout/includes/third-party/search/index.pug:
--------------------------------------------------------------------------------
1 | case theme.search.use
2 | when 'algolia_search'
3 | include ./algolia.pug
4 | when 'local_search'
5 | include ./local-search.pug
6 | when 'docsearch'
7 | include ./docsearch.pug
--------------------------------------------------------------------------------
/layout/includes/third-party/search/local-search.pug:
--------------------------------------------------------------------------------
1 | #local-search
2 | .search-dialog
3 | nav.search-nav
4 | span.search-dialog-title= _p('search.title')
5 | span#loading-status
6 | button.search-close-button
7 | i.fas.fa-times
8 |
9 | #loading-database.text-center
10 | i.fas.fa-spinner.fa-pulse
11 | span= ' ' + _p("search.load_data")
12 |
13 | .search-wrap
14 | #local-search-input
15 | .local-search-box
16 | input(placeholder=theme.search.placeholder || _p("search.input_placeholder") type="text").local-search-box--input
17 | hr
18 | #local-search-results
19 | #local-search-stats-wrap
20 | #search-mask
21 |
22 | script(src=url_for(theme.asset.local_search))
--------------------------------------------------------------------------------
/layout/includes/third-party/share/addtoany.pug:
--------------------------------------------------------------------------------
1 | .addtoany
2 | .a2a_kit.a2a_kit_size_32.a2a_default_style
3 | - let addtoanyItem = theme.share.addtoany.item.split(',')
4 | each name in addtoanyItem
5 | a(class="a2a_button_" + name)
6 |
7 | a.a2a_dd(href="https://www.addtoany.com/share")
8 | script(async src='https://static.addtoany.com/menu/page.js')
9 |
10 |
11 |
--------------------------------------------------------------------------------
/layout/includes/third-party/share/index.pug:
--------------------------------------------------------------------------------
1 | - const { use } = theme.share
2 |
3 | if use
4 | .post-share
5 | case use
6 | when 'addtoany'
7 | !=partial('includes/third-party/share/addtoany', {}, {cache: true})
8 | when 'sharejs'
9 | include ./share-js.pug
--------------------------------------------------------------------------------
/layout/includes/third-party/share/share-js.pug:
--------------------------------------------------------------------------------
1 | - const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img
2 | .social-share(data-image=url_for(coverVal) data-sites= theme.share.sharejs.sites)
3 | link(rel='stylesheet' href=url_for(theme.asset.sharejs_css) media="print" onload="this.media='all'")
4 | script(src=url_for(theme.asset.sharejs) defer)
--------------------------------------------------------------------------------
/layout/includes/third-party/umami_analytics.pug:
--------------------------------------------------------------------------------
1 | - let { serverURL, website_id, option, UV_PV } = theme.umami_analytics
2 | - const isServerURL = !!serverURL
3 | - const baseURL = serverURL ? serverURL.replace(/\/$/, '') : 'https://cloud.umami.is'
4 | - const apiUrl = serverURL ? serverURL.replace(/\/$/, '') + '/api' : 'https://api.umami.is/v1'
5 |
6 | script.
7 | (() => {
8 | const option = !{JSON.stringify(option)}
9 | const config = !{JSON.stringify(UV_PV)}
10 |
11 | const runTrack = () => {
12 | umami.track(props => ({ ...props, url: window.location.pathname, title: GLOBAL_CONFIG_SITE.title }))
13 | }
14 |
15 | const loadUmamiJS = () => {
16 | btf.getScript('!{baseURL}/script.js', {
17 | 'data-website-id': '!{website_id}',
18 | 'data-auto-track': 'false',
19 | ...option
20 | }).then(runTrack)
21 | }
22 |
23 | const getData = async (isPost) => {
24 | const now = Date.now()
25 | const keyUrl = isPost ? `&url=${window.location.pathname}` : ''
26 | const headerList = { 'Accept': 'application/json' }
27 | if (!{isServerURL}) headerList['Authorization'] = `Bearer ${config.token}`
28 | else headerList['x-umami-api-key'] = config.token
29 | const res = await fetch(`!{apiUrl}/websites/!{website_id}/stats?startAt=0000000000&endAt=${now}${keyUrl}`, {
30 | method: "GET",
31 | headers: headerList
32 | })
33 | return await res.json()
34 | }
35 |
36 | const insertData = async () => {
37 | try {
38 | if (GLOBAL_CONFIG_SITE.pageType === 'post' && config.page_pv) {
39 | const pagePV = document.getElementById('umamiPV')
40 | if (pagePV) {
41 | const data = await getData(true)
42 | pagePV.textContent = data.pageviews.value
43 | }
44 | } else {
45 | const data = (config.site_uv || config.site_pv) && await getData()
46 | if (config.site_uv) {
47 | const siteUV = document.getElementById('umami-site-uv')
48 | if (siteUV) siteUV.textContent = data.visitors.value
49 | }
50 | if (config.site_pv) {
51 | const sitePV = document.getElementById('umami-site-pv')
52 | if (sitePV) sitePV.textContent = data.pageviews.value
53 | }
54 | }
55 | } catch (e) {
56 | console.error('Failed to load Umami Analytics:', e)
57 | }
58 | }
59 |
60 | btf.addGlobalFn('pjaxComplete', runTrack, 'umami_analytics_run_track')
61 | btf.addGlobalFn('pjaxComplete', insertData, 'umami_analytics_insert')
62 |
63 | loadUmamiJS()
64 | insertData()
65 | })()
--------------------------------------------------------------------------------
/layout/includes/widget/card_ad.pug:
--------------------------------------------------------------------------------
1 | if theme.ad && theme.ad.aside
2 | .card-widget.ads-wrap
3 | != theme.ad.aside
4 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_announcement.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_announcement.enable
2 | .card-widget.card-announcement
3 | .item-headline
4 | i.fas.fa-bullhorn.fa-shake
5 | span= _p('aside.card_announcement')
6 | .announcement_content!= theme.aside.card_announcement.content
--------------------------------------------------------------------------------
/layout/includes/widget/card_archives.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_archives.enable
2 | .card-widget.card-archives
3 | - let type = theme.aside.card_archives.type || 'monthly'
4 | - let format = theme.aside.card_archives.format || 'MMMM YYYY'
5 | - let order = theme.aside.card_archives.order || -1
6 | - let limit = theme.aside.card_archives.limit === 0 ? 0 : theme.aside.card_archives.limit || 8
7 | != aside_archives({ type:type, format: format, order: order, limit: limit })
8 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_author.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_author.enable
2 | .card-widget.card-info.text-center
3 | .avatar-img
4 | img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
5 | .author-info-name= config.author
6 | .author-info-description!= theme.aside.card_author.description || config.description
7 |
8 | .site-data
9 | a(href=url_for(config.archive_dir) + '/')
10 | .headline= _p('aside.articles')
11 | .length-num= site.posts.length
12 | a(href=url_for(config.tag_dir) + '/')
13 | .headline= _p('aside.tags')
14 | .length-num= site.tags.length
15 | a(href=url_for(config.category_dir) + '/')
16 | .headline= _p('aside.categories')
17 | .length-num= site.categories.length
18 |
19 | if theme.aside.card_author.button.enable
20 | a#card-info-btn(href=theme.aside.card_author.button.link)
21 | i(class=theme.aside.card_author.button.icon)
22 | span=theme.aside.card_author.button.text
23 |
24 | if(theme.social)
25 | .card-info-social-icons
26 | !=partial('includes/header/social', {}, {cache: true})
27 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_bottom_self.pug:
--------------------------------------------------------------------------------
1 | if site.data.widget && site.data.widget.bottom
2 | each item in site.data.widget.bottom
3 | .card-widget(class=item.class_name id=item.id_name style=item.order ? `order: ${item.order}` : '')
4 | .item-headline
5 | i(class=item.icon)
6 | span=item.name
7 | .item-content
8 | !=item.html
9 |
10 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_categories.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_categories.enable
2 | if site.categories.length
3 | .card-widget.card-categories
4 | !=aside_categories({ limit: theme.aside.card_categories.limit === 0 ? 0 : theme.aside.card_categories.limit || 8 , expand: theme.aside.card_categories.expand })
5 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_newest_comment.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_newest_comments.enable && theme.comments.use && !['Livere','Facebook Comments','Giscus'].includes(theme.comments.use[0])
2 | .card-widget#card-newest-comments
3 | .item-headline
4 | i.fas.fa-comment-dots
5 | span= _p('aside.card_newest_comments.headline')
6 | .aside-list
7 | span= _p('aside.card_newest_comments.loading_text')
8 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_post_series.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_post_series.enable
2 | - const array = fragment_cache('seriesArr', groupPosts)
3 | .card-widget.card-post-series
4 | .item-headline
5 | i.fa-solid.fa-layer-group
6 | span= theme.aside.card_post_series.series_title ? page.series : _p('aside.card_post_series')
7 | .aside-list
8 | each item in array[page.series]
9 | - const { path, title = _p('no_title'), cover, cover_type, date:dateA } = item
10 | - let link = url_for(path)
11 | - let no_cover = cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
12 | .aside-list-item(class=no_cover)
13 | if cover && theme.cover.aside_enable
14 | a.thumbnail(href=link title=title)
15 | if cover_type === 'img'
16 | img(src=url_for(cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
17 | else
18 | div(style=`background: ${cover}`)
19 | .content
20 | a.title(href=link title=title)= title
21 | time(datetime=date_xml(dateA) title=_p('post.created') + ' ' + full_date(dateA)) #[=date(dateA, config.date_format)]
22 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_post_toc.pug:
--------------------------------------------------------------------------------
1 | - let tocNumber = typeof page.toc_number === 'boolean' ? page.toc_number : theme.toc.number
2 | - let tocExpand = typeof page.toc_expand === 'boolean' ? page.toc_expand : theme.toc.expand
3 | - let tocExpandClass = tocExpand ? 'is-expand' : ''
4 |
5 | #card-toc.card-widget
6 | .item-headline
7 | i.fas.fa-stream
8 | span= _p('aside.card_toc')
9 | span.toc-percentage
10 |
11 | if (page.encrypt == true)
12 | .toc-content.toc-div-class(class=tocExpandClass style="display:none")!=toc(page.origin, {list_number: tocNumber})
13 | else
14 | .toc-content(class=tocExpandClass)!=toc(page.content, {list_number: tocNumber})
15 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_recent_post.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_recent_post.enable
2 | .card-widget.card-recent-post
3 | .item-headline
4 | i.fas.fa-history
5 | span= _p('aside.card_recent_post')
6 | .aside-list
7 | - let postLimit = theme.aside.card_recent_post.limit === 0 ? site.posts.length : theme.aside.card_recent_post.limit || 5
8 | - let sort = theme.aside.card_recent_post.sort === 'updated' ? 'updated' : 'date'
9 | - site.posts.sort(sort, -1).limit(postLimit).each(function(article){
10 | - let link = article.link || article.path
11 | - let title = article.title || _p('no_title')
12 | - let no_cover = article.cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
13 | - let post_cover = article.cover
14 | .aside-list-item(class=no_cover)
15 | if post_cover && theme.cover.aside_enable
16 | a.thumbnail(href=url_for(link) title=title)
17 | if article.cover_type === 'img'
18 | img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
19 | else
20 | div(style=`background: ${post_cover}`)
21 | .content
22 | a.title(href=url_for(link) title=title)= title
23 | if theme.aside.card_recent_post.sort === 'updated'
24 | time(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated)) #[=date(article.updated, config.date_format)]
25 | else
26 | time(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date)) #[=date(article.date, config.date_format)]
27 | - })
--------------------------------------------------------------------------------
/layout/includes/widget/card_tags.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_tags.enable
2 | if site.tags.length
3 | .card-widget.card-tags
4 | .item-headline
5 | i.fas.fa-tags
6 | span= _p('aside.card_tags')
7 |
8 | - let { limit, orderby, order } = theme.aside.card_tags
9 | - limit = limit === 0 ? 0 : limit || 40
10 |
11 | if theme.aside.card_tags.color
12 | .card-tag-cloud!= cloudTags({source: site.tags, orderby: orderby, order: order, minfontsize: 1.15, maxfontsize: 1.45, limit: limit, unit: 'em'})
13 | else
14 | .card-tag-cloud!= tagcloud({orderby: orderby, order: order, min_font: 1.1, max_font: 1.5, amount: limit , color: true, start_color: '#999', end_color: '#99a9bf', unit: 'em'})
15 |
--------------------------------------------------------------------------------
/layout/includes/widget/card_top_self.pug:
--------------------------------------------------------------------------------
1 | if site.data.widget && site.data.widget.top
2 | each item in site.data.widget.top
3 | .card-widget(class=item.class_name id=item.id_name)
4 | .item-headline
5 | i(class=item.icon)
6 | span=item.name
7 | .item-content
8 | !=item.html
--------------------------------------------------------------------------------
/layout/includes/widget/card_webinfo.pug:
--------------------------------------------------------------------------------
1 | if theme.aside.card_webinfo.enable
2 | .card-widget.card-webinfo
3 | .item-headline
4 | i.fas.fa-chart-line
5 | span= _p('aside.card_webinfo.headline')
6 | .webinfo
7 | if theme.aside.card_webinfo.post_count
8 | .webinfo-item
9 | .item-name= `${_p('aside.card_webinfo.article_name')} :`
10 | .item-count= site.posts.length
11 | if theme.aside.card_webinfo.runtime_date
12 | .webinfo-item
13 | .item-name= `${_p('aside.card_webinfo.runtime.name')} :`
14 | .item-count#runtimeshow(data-publishDate=date_xml(theme.aside.card_webinfo.runtime_date))
15 | i.fa-solid.fa-spinner.fa-spin
16 | if theme.wordcount.enable && theme.wordcount.total_wordcount
17 | .webinfo-item
18 | .item-name= `${_p('aside.card_webinfo.site_wordcount')} :`
19 | .item-count= totalcount(site)
20 | if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.site_uv
21 | .webinfo-item
22 | .item-name= `${_p('aside.card_webinfo.site_uv_name')} :`
23 | .item-count#umami-site-uv
24 | i.fa-solid.fa-spinner.fa-spin
25 | else if theme.busuanzi.site_uv
26 | .webinfo-item
27 | .item-name= `${_p('aside.card_webinfo.site_uv_name')} :`
28 | .item-count#busuanzi_value_site_uv
29 | i.fa-solid.fa-spinner.fa-spin
30 | if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.site_pv
31 | .webinfo-item
32 | .item-name= `${_p('aside.card_webinfo.site_pv_name')} :`
33 | .item-count#umami-site-pv
34 | i.fa-solid.fa-spinner.fa-spin
35 | else if theme.busuanzi.site_pv
36 | .webinfo-item
37 | .item-name= `${_p('aside.card_webinfo.site_pv_name')} :`
38 | .item-count#busuanzi_value_site_pv
39 | i.fa-solid.fa-spinner.fa-spin
40 | if theme.aside.card_webinfo.last_push_date
41 | .webinfo-item
42 | .item-name= `${_p('aside.card_webinfo.last_push_date.name')} :`
43 | .item-count#last-push-date(data-lastPushDate=date_xml(Date.now()))
44 | i.fa-solid.fa-spinner.fa-spin
--------------------------------------------------------------------------------
/layout/includes/widget/index.pug:
--------------------------------------------------------------------------------
1 | #aside-content.aside-content
2 | //- post
3 | if globalPageType === 'post'
4 | - const tocStyle = page.toc_style_simple
5 | - const tocStyleVal = tocStyle === true || tocStyle === false ? tocStyle : theme.toc.style_simple
6 | if showToc && tocStyleVal
7 | .sticky_layout
8 | include ./card_post_toc.pug
9 | else
10 | !=partial('includes/widget/card_author', {}, {cache: true})
11 | !=partial('includes/widget/card_announcement', {}, {cache: true})
12 | !=partial('includes/widget/card_top_self', {}, {cache: true})
13 | .sticky_layout
14 | if showToc
15 | include ./card_post_toc.pug
16 | if page.series
17 | include ./card_post_series.pug
18 | !=partial('includes/widget/card_recent_post', {}, {cache: true})
19 | !=partial('includes/widget/card_ad', {}, {cache: true})
20 | else
21 | //- page
22 | !=partial('includes/widget/card_author', {}, {cache: true})
23 | !=partial('includes/widget/card_announcement', {}, {cache: true})
24 | !=partial('includes/widget/card_top_self', {}, {cache: true})
25 |
26 | .sticky_layout
27 | if showToc
28 | include ./card_post_toc.pug
29 | !=partial('includes/widget/card_recent_post', {}, {cache: true})
30 | !=partial('includes/widget/card_ad', {}, {cache: true})
31 | !=partial('includes/widget/card_newest_comment', {}, {cache: true})
32 | !=partial('includes/widget/card_categories', {}, {cache: true})
33 | !=partial('includes/widget/card_tags', {}, {cache: true})
34 | !=partial('includes/widget/card_archives', {}, {cache: true})
35 | !=partial('includes/widget/card_webinfo', {}, {cache: true})
36 | !=partial('includes/widget/card_bottom_self', {}, {cache: true})
--------------------------------------------------------------------------------
/layout/index.pug:
--------------------------------------------------------------------------------
1 | extends includes/layout.pug
2 |
3 | block content
4 | include ./includes/mixins/indexPostUI.pug
5 | +indexPostUI
--------------------------------------------------------------------------------
/layout/page.pug:
--------------------------------------------------------------------------------
1 | extends includes/layout.pug
2 |
3 | block content
4 | - const noCardLayout = ['shuoshuo', '404'].includes(page.type) ? 'nc' : ''
5 | - var commentsJsLoad = false
6 |
7 | mixin commentLoad
8 | if page.comments !== false && theme.comments.use
9 | - commentsJsLoad = true
10 | !=partial('includes/third-party/comments/index', {}, {cache: true})
11 |
12 | #page(class=noCardLayout)
13 | if top_img === false && page.title
14 | .page-title= page.title
15 |
16 | case page.type
17 | when 'tags'
18 | include includes/page/tags.pug
19 | +commentLoad
20 | when 'link'
21 | include includes/page/flink.pug
22 | +commentLoad
23 | when 'categories'
24 | include includes/page/categories.pug
25 | +commentLoad
26 | when '404'
27 | include includes/page/404.pug
28 | when 'shuoshuo'
29 | include includes/page/shuoshuo.pug
30 | default
31 | include includes/page/default-page.pug
32 | +commentLoad
--------------------------------------------------------------------------------
/layout/post.pug:
--------------------------------------------------------------------------------
1 | extends includes/layout.pug
2 |
3 | block content
4 | #post
5 | if top_img === false
6 | include includes/header/post-info.pug
7 |
8 | article#article-container.container.post-content
9 | if theme.noticeOutdate.enable && page.noticeOutdate !== false
10 | include includes/post/outdate-notice.pug
11 | else
12 | !=page.content
13 | include includes/post/post-copyright.pug
14 | .tag_share
15 | if (page.tags.length > 0 && theme.post_meta.post.tags)
16 | .post-meta__tag-list
17 | each item, index in page.tags.data
18 | a(href=url_for(item.path)).post-meta__tags #[=item.name]
19 | include includes/third-party/share/index.pug
20 |
21 | if theme.reward.enable && theme.reward.QR_code
22 | !=partial('includes/post/reward', {}, {cache: true})
23 |
24 | //- ad
25 | if theme.ad && theme.ad.post
26 | .ads-wrap!=theme.ad.post
27 |
28 | if theme.post_pagination
29 | include includes/pagination.pug
30 | if theme.related_post && theme.related_post.enable
31 | != related_posts(page,site.posts)
32 |
33 | if page.comments !== false && theme.comments.use
34 | - var commentsJsLoad = true
35 | !=partial('includes/third-party/comments/index', {}, {cache: true})
36 |
--------------------------------------------------------------------------------
/layout/tag.pug:
--------------------------------------------------------------------------------
1 | extends includes/layout.pug
2 |
3 | block content
4 | if theme.tag_ui == 'index'
5 | include ./includes/mixins/indexPostUI.pug
6 | +indexPostUI
7 | else
8 | include ./includes/mixins/article-sort.pug
9 | #tag
10 | .article-sort-title= _p('page.tag') + ' - ' + page.tag
11 | +articleSort(page.posts)
12 | include includes/pagination.pug
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "hexo-theme-butterfly",
3 | "version": "5.4.0-b2",
4 | "description": "A Simple and Card UI Design theme for Hexo",
5 | "main": "package.json",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1"
8 | },
9 | "keywords": [
10 | "hexo",
11 | "theme",
12 | "butterfly",
13 | "Card UI Design",
14 | "Jerry",
15 | "hexo-theme-butterfly"
16 | ],
17 | "repository": {
18 | "type": "git",
19 | "url": "https://github.com/jerryc127/hexo-theme-butterfly.git"
20 | },
21 | "bugs": {
22 | "url": "https://github.com/jerryc127/hexo-theme-butterfly/issues",
23 | "email": "my@crazywong.com"
24 | },
25 | "dependencies": {
26 | "hexo-renderer-pug": "^3.0.0",
27 | "hexo-renderer-stylus": "^3.0.1",
28 | "hexo-util": "^3.3.0",
29 | "moment-timezone": "^0.5.48"
30 | },
31 | "homepage": "https://butterfly.js.org/",
32 | "author": "Jerry ",
33 | "license": "Apache-2.0"
34 | }
35 |
--------------------------------------------------------------------------------
/scripts/common/postDesc.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 |
3 | const { stripHTML, truncate } = require('hexo-util')
4 |
5 | // Truncates the given content to a specified length, removing HTML tags and replacing newlines with spaces.
6 | const truncateContent = (content, length, encrypt = false) => {
7 | if (!content || encrypt) return ''
8 | return truncate(stripHTML(content).replace(/\n/g, ' '), { length })
9 | }
10 |
11 | // Generates a post description based on the provided data and theme configuration.
12 | const postDesc = (data, hexo) => {
13 | const { description, content, postDesc, encrypt } = data
14 |
15 | if (postDesc) return postDesc
16 |
17 | const { length, method } = hexo.theme.config.index_post_content
18 |
19 | if (method === false) return
20 |
21 | let result
22 | switch (method) {
23 | case 1:
24 | result = description
25 | break
26 | case 2:
27 | result = description || truncateContent(content, length, encrypt)
28 | break
29 | default:
30 | result = truncateContent(content, length, encrypt)
31 | }
32 |
33 | data.postDesc = result
34 | return result
35 | }
36 |
37 | module.exports = { truncateContent, postDesc }
38 |
--------------------------------------------------------------------------------
/scripts/events/404.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Butterfly
3 | * 404 error page
4 | */
5 |
6 | 'use strict'
7 |
8 | hexo.extend.generator.register('404', function (locals) {
9 | if (!hexo.theme.config.error_404.enable) return
10 | return {
11 | path: '404.html',
12 | layout: ['page'],
13 | data: {
14 | type: '404',
15 | top_img: false,
16 | comments: false,
17 | aside: false
18 | }
19 | }
20 | })
21 |
--------------------------------------------------------------------------------
/scripts/events/comment.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Capitalize the first letter of comment name
3 | */
4 |
5 | hexo.extend.filter.register('before_generate', () => {
6 | const themeConfig = hexo.theme.config
7 | let { use } = themeConfig.comments
8 | if (!use) return
9 |
10 | // Make sure use is an array
11 | use = Array.isArray(use) ? use : use.split(',')
12 |
13 | // Capitalize the first letter of each comment name
14 | use = use.map(item =>
15 | item.trim().toLowerCase().replace(/\b[a-z]/g, s => s.toUpperCase())
16 | )
17 |
18 | // Disqus and Disqusjs conflict, only keep the first one
19 | if (use.includes('Disqus') && use.includes('Disqusjs')) {
20 | use = [use[0]]
21 | }
22 |
23 | themeConfig.comments.use = use
24 | })
25 |
--------------------------------------------------------------------------------
/scripts/events/init.js:
--------------------------------------------------------------------------------
1 | hexo.extend.filter.register('before_generate', () => {
2 | // Get first two digits of the Hexo version number
3 | const { version, log, locals } = hexo
4 | const hexoVer = version.replace(/(^.*\..*)\..*/, '$1')
5 |
6 | if (hexoVer < 5.3) {
7 | log.error('Please update Hexo to V5.3.0 or higher!')
8 | log.error('請把 Hexo 升級到 V5.3.0 或更高的版本！')
9 | process.exit(-1)
10 | }
11 |
12 | if (locals.get) {
13 | const data = locals.get('data')
14 | if (data && data.butterfly) {
15 | log.error("'butterfly.yml' is deprecated. Please use '_config.butterfly.yml'")
16 | log.error("'butterfly.yml' 已經棄用，請使用 '_config.butterfly.yml'")
17 | process.exit(-1)
18 | }
19 | }
20 | })
21 |
--------------------------------------------------------------------------------
/scripts/events/stylus.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Stylus renderer
3 | */
4 |
5 | 'use strict'
6 |
7 | hexo.extend.filter.register('stylus:renderer', style => {
8 | const { syntax_highlighter: syntaxHighlighter, highlight, prismjs } = hexo.config
9 | let { enable: highlightEnable, line_number: highlightLineNumber } = highlight
10 | let { enable: prismjsEnable, line_number: prismjsLineNumber } = prismjs
11 |
12 | // for hexo > 7.0
13 | if (syntaxHighlighter) {
14 | highlightEnable = syntaxHighlighter === 'highlight.js'
15 | prismjsEnable = syntaxHighlighter === 'prismjs'
16 | }
17 |
18 | style.define('$highlight_enable', highlightEnable)
19 | .define('$highlight_line_number', highlightLineNumber)
20 | .define('$prismjs_enable', prismjsEnable)
21 | .define('$prismjs_line_number', prismjsLineNumber)
22 | .define('$language', hexo.config.language)
23 | // .import(`${this.source_dir.replace(/\\/g, '/')}_data/css/*`)
24 | })
25 |
--------------------------------------------------------------------------------
/scripts/events/welcome.js:
--------------------------------------------------------------------------------
1 | hexo.on('ready', () => {
2 | const { version } = require('../../package.json')
3 | hexo.log.info(`
4 | ===================================================================
5 | ##### # # ##### ##### ###### ##### ###### # # #
6 | # # # # # # # # # # # # #
7 | ##### # # # # ##### # # ##### # #
8 | # # # # # # # ##### # # #
9 | # # # # # # # # # # # #
10 | ##### #### # # ###### # # # ###### #
11 | ${version}
12 | ===================================================================`)
13 | })
14 |
--------------------------------------------------------------------------------
/scripts/filters/post_lazyload.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Butterfly
3 | * lazyload
4 | * replace src to data-lazy-src
5 | */
6 |
7 | 'use strict'
8 |
9 | const urlFor = require('hexo-util').url_for.bind(hexo)
10 |
11 | const lazyload = htmlContent => {
12 | if (hexo.theme.config.lazyload.native) {
13 | return htmlContent.replace(/()/ig, '$1 loading=\'lazy\'$2')
14 | }
15 |
16 | const bg = hexo.theme.config.lazyload.placeholder ? urlFor(hexo.theme.config.lazyload.placeholder) : 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
17 | return htmlContent.replace(/( {
21 | const { enable, field } = hexo.theme.config.lazyload
22 | if (!enable || field !== 'site') return
23 | return lazyload(data)
24 | })
25 |
26 | hexo.extend.filter.register('after_post_render', data => {
27 | const { enable, field } = hexo.theme.config.lazyload
28 | if (!enable || field !== 'post') return
29 | data.content = lazyload(data.content)
30 | return data
31 | })
32 |
--------------------------------------------------------------------------------
/scripts/filters/random_cover.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Random cover for posts
3 | */
4 |
5 | 'use strict'
6 |
7 | hexo.extend.generator.register('post', locals => {
8 | const previousIndexes = []
9 |
10 | const getRandomCover = defaultCover => {
11 | if (!defaultCover) return false
12 | if (!Array.isArray(defaultCover)) return defaultCover
13 |
14 | const coverCount = defaultCover.length
15 |
16 | if (coverCount === 1) {
17 | return defaultCover[0]
18 | }
19 |
20 | const maxPreviousIndexes = coverCount === 2 ? 1 : (coverCount === 3 ? 2 : 3)
21 |
22 | let index
23 | do {
24 | index = Math.floor(Math.random() * coverCount)
25 | } while (previousIndexes.includes(index) && previousIndexes.length < coverCount)
26 |
27 | previousIndexes.push(index)
28 | if (previousIndexes.length > maxPreviousIndexes) {
29 | previousIndexes.shift()
30 | }
31 |
32 | return defaultCover[index]
33 | }
34 |
35 | const handleImg = data => {
36 | const imgTestReg = /\.(png|jpe?g|gif|svg|webp|avif)(\?.*)?$/i
37 | let { cover: coverVal, top_img: topImg } = data
38 |
39 | // Add path to top_img and cover if post_asset_folder is enabled
40 | if (hexo.config.post_asset_folder) {
41 | if (topImg && topImg.indexOf('/') === -1 && imgTestReg.test(topImg)) {
42 | data.top_img = `${data.path}${topImg}`
43 | }
44 | if (coverVal && coverVal.indexOf('/') === -1 && imgTestReg.test(coverVal)) {
45 | data.cover = `${data.path}${coverVal}`
46 | }
47 | }
48 |
49 | if (coverVal === false) return data
50 |
51 | // If cover is not set, use random cover
52 | if (!coverVal) {
53 | const { cover: { default_cover: defaultCover } } = hexo.theme.config
54 | const randomCover = getRandomCover(defaultCover)
55 | data.cover = randomCover
56 | coverVal = randomCover // update coverVal
57 | }
58 |
59 | if (coverVal && (coverVal.indexOf('//') !== -1 || imgTestReg.test(coverVal))) {
60 | data.cover_type = 'img'
61 | }
62 |
63 | return data
64 | }
65 |
66 | // https://github.com/hexojs/hexo/blob/master/lib%2Fplugins%2Fgenerator%2Fpost.ts
67 | const posts = locals.posts.sort('date').toArray()
68 | const { length } = posts
69 |
70 | return posts.map((post, i) => {
71 | if (i) post.prev = posts[i - 1]
72 | if (i < length - 1) post.next = posts[i + 1]
73 |
74 | post.__post = true
75 |
76 | return {
77 | data: handleImg(post),
78 | layout: 'post',
79 | path: post.path
80 | }
81 | })
82 | })
83 |
--------------------------------------------------------------------------------
/scripts/helpers/getArchiveLength.js:
--------------------------------------------------------------------------------
1 | hexo.extend.helper.register('getArchiveLength', function () {
2 | const archiveGenerator = hexo.config.archive_generator
3 | const posts = this.site.posts
4 |
5 | const { yearly, monthly, daily } = archiveGenerator
6 | const { year, month, day } = this.page
7 |
8 | // Archives Page
9 | if (!year) return posts.length
10 |
11 | // Function to generate a unique key based on the granularity
12 | const getKey = (post, type) => {
13 | const date = post.date.clone()
14 | const y = date.year()
15 | const m = date.month() + 1
16 | const d = date.date()
17 | if (type === 'year') return `${y}`
18 | if (type === 'month') return `${y}-${m}`
19 | if (type === 'day') return `${y}-${m}-${d}`
20 | }
21 |
22 | // Create a map to count posts per period
23 | const mapData = this.fragment_cache('createArchiveObj', () => {
24 | const map = new Map()
25 | posts.forEach(post => {
26 | const keyYear = getKey(post, 'year')
27 | const keyMonth = getKey(post, 'month')
28 | const keyDay = getKey(post, 'day')
29 |
30 | if (yearly) map.set(keyYear, (map.get(keyYear) || 0) + 1)
31 | if (monthly) map.set(keyMonth, (map.get(keyMonth) || 0) + 1)
32 | if (daily) map.set(keyDay, (map.get(keyDay) || 0) + 1)
33 | })
34 | return map
35 | })
36 |
37 | // Determine the appropriate key to fetch based on current page context
38 | let key
39 | if (yearly && year) key = `${year}`
40 | if (monthly && month) key = `${year}-${month}`
41 | if (daily && day) key = `${year}-${month}-${day}`
42 |
43 | // Return the count for the current period or default to the total posts
44 | return mapData.get(key) || posts.length
45 | })
46 |
--------------------------------------------------------------------------------
/scripts/helpers/series.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 |
3 | hexo.extend.helper.register('groupPosts', function () {
4 | const getGroupArray = array => {
5 | return array.reduce((groups, item) => {
6 | const key = item.series
7 | if (key) {
8 | groups[key] = groups[key] || []
9 | groups[key].push(item)
10 | }
11 | return groups
12 | }, {})
13 | }
14 |
15 | const sortPosts = posts => {
16 | const { orderBy = 'date', order = 1 } = this.theme.aside.card_post_series
17 | if (orderBy === 'title') return posts.sort('title', order)
18 | return posts.sort('date', order)
19 | }
20 |
21 | return getGroupArray(sortPosts(this.site.posts))
22 | })
23 |
--------------------------------------------------------------------------------
/scripts/tag/button.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Button
3 | * {% btn url text icon option %}
4 | * option: color outline center block larger
5 | * color : default/blue/pink/red/purple/orange/green
6 | */
7 |
8 | 'use strict'
9 |
10 | const urlFor = require('hexo-util').url_for.bind(hexo)
11 |
12 | const btn = args => {
13 | const [url = '', text = '', icon = '', option = ''] = args.join(' ').split(',').map(arg => arg.trim())
14 |
15 | const iconHTML = icon ? `` : ''
16 | const textHTML = text ? `${text}` : ''
17 |
18 | return `${iconHTML}${textHTML}`
19 | }
20 |
21 | hexo.extend.tag.register('btn', btn, { ends: false })
22 |
--------------------------------------------------------------------------------
/scripts/tag/chartjs.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Butterfly
3 | * chartjs
4 | * https://www.chartjs.org/
5 | * {% chartjs [width, abreast, chartId] %}
6 | *
7 | *
8 | *
9 | *
10 | * {% endchartjs %}
11 | */
12 |
13 | 'use strict'
14 |
15 | const { escapeHTML } = require('hexo-util')
16 |
17 | const chartjs = (args, content) => {
18 | if (!content) return
19 |
20 | const chartRegex = /\n([\w\W\s\S]*?)/
21 | const descRegex = /\n([\w\W\s\S]*?)/
22 | const selfConfig = args.join(' ').trim()
23 |
24 | const [width = '', layout = false, chartId = ''] = selfConfig.split(',').map(s => s.trim())
25 |
26 | const chartMatch = content.match(chartRegex)
27 | const descMatch = content.match(descRegex)
28 |
29 | if (!chartMatch) {
30 | hexo.log.warn('chartjs tag: chart content is required!')
31 | return
32 | }
33 |
34 | const chartConfig = chartMatch && chartMatch[1] ? chartMatch[1] : ''
35 | const descContent = descMatch && descMatch[1] ? descMatch[1] : ''
36 |
37 | const renderedDesc = descContent ? hexo.render.renderSync({ text: descContent, engine: 'markdown' }).trim() : ''
38 |
39 | const descDOM = renderedDesc ? `${renderedDesc}` : ''
40 | const abreastClass = layout ? ' chartjs-abreast' : ''
41 | const widthStyle = width ? `data-width="${width}%"` : ''
42 |
43 | return `
44 | ${escapeHTML(chartConfig)}
45 | ${descDOM}
46 | `
47 | }
48 |
49 | hexo.extend.tag.register('chartjs', chartjs, { ends: true })
50 |
--------------------------------------------------------------------------------
/scripts/tag/flink.js:
--------------------------------------------------------------------------------
1 | /**
2 | * flink
3 | */
4 |
5 | 'use strict'
6 |
7 | const urlFor = require('hexo-util').url_for.bind(hexo)
8 |
9 | const flinkFn = (args, content) => {
10 | const data = hexo.render.renderSync({ text: content, engine: 'yaml' })
11 | let result = ''
12 |
13 | data.forEach(item => {
14 | const className = item.class_name ? `${item.class_name}` : ''
15 | const classDesc = item.class_desc ? `${item.class_desc}` : ''
16 |
17 | const listResult = item.link_list.map(link => `
18 | `).join('')
27 |
28 | result += `${className}${classDesc}${listResult}`
29 | })
30 |
31 | return `${result}`
32 | }
33 |
34 | hexo.extend.tag.register('flink', flinkFn, { ends: true })
35 |
--------------------------------------------------------------------------------
/scripts/tag/gallery.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Butterfly
3 | * galleryGroup and gallery
4 | * {% galleryGroup [name] [descr] [url] [img] %}
5 | *
6 | * {% gallery [button],[limit],[firstLimit] %}
7 | * {% gallery url,[url],[button] %}
8 | */
9 |
10 | 'use strict'
11 |
12 | const urlFor = require('hexo-util').url_for.bind(hexo)
13 |
14 | const DEFAULT_LIMIT = 10
15 | const DEFAULT_FIRST_LIMIT = 10
16 | const IMAGE_REGEX = /!\[(.*?)\]\(([^\s]*)\s*(?:["'](.*?)["']?)?\s*\)/g
17 |
18 | // Helper functions
19 | const parseGalleryArgs = args => {
20 | const [type, ...rest] = args.join(' ').split(',').map(arg => arg.trim())
21 | return {
22 | isUrl: type === 'url',
23 | params: type === 'url' ? rest : [type, ...rest]
24 | }
25 | }
26 |
27 | const parseImageContent = content => {
28 | const images = []
29 | let match
30 |
31 | while ((match = IMAGE_REGEX.exec(content)) !== null) {
32 | images.push({
33 | url: match[2],
34 | alt: match[1] || '',
35 | title: match[3] || ''
36 | })
37 | }
38 |
39 | return images
40 | }
41 |
42 | const createGalleryHTML = (type, dataStr, button, limit, firstLimit) => {
43 | return `
44 | ${dataStr}
45 | `
46 | }
47 |
48 | const gallery = (args, content) => {
49 | const { isUrl, params } = parseGalleryArgs(args)
50 |
51 | if (isUrl) {
52 | const [dataStr, button = false, limit = DEFAULT_LIMIT, firstLimit = DEFAULT_FIRST_LIMIT] = params
53 | return createGalleryHTML('url', urlFor(dataStr), button, limit, firstLimit)
54 | }
55 |
56 | const [button = false, limit = DEFAULT_LIMIT, firstLimit = DEFAULT_FIRST_LIMIT] = params
57 | const images = parseImageContent(content)
58 | return createGalleryHTML('data', JSON.stringify(images), button, limit, firstLimit)
59 | }
60 |
61 | const galleryGroup = args => {
62 | const [name = '', descr = '', url = '', img = ''] = args.map(arg => arg.trim())
63 |
64 | return `
65 | })
66 |
67 | ${name}
68 | ${descr}
69 |
70 |
71 | `
72 | }
73 |
74 | // Register tags
75 | hexo.extend.tag.register('gallery', gallery, { ends: true })
76 | hexo.extend.tag.register('galleryGroup', galleryGroup)
77 |
--------------------------------------------------------------------------------
/scripts/tag/hide.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Butterfly
3 | * @example
4 | * hideInline
5 | * {% hideInline content,display,bg,color %}
6 | * content不能包含當引號，可用 '
7 | * hideBlock
8 | * {% hideBlock display,bg,color %}
9 | * content
10 | * {% endhideBlock %}
11 | * hideToggle
12 | * {% hideToggle display,bg,color %}
13 | * content
14 | * {% endhideToggle %}
15 | */
16 |
17 | 'use strict'
18 |
19 | const parseArgs = args => args.join(' ').split(',')
20 |
21 | const generateStyle = (bg, color) => {
22 | let style = 'style="'
23 | if (bg) style += `background-color: ${bg};`
24 | if (color) style += `color: ${color}`
25 | style += '"'
26 | return style
27 | }
28 |
29 | const hideInline = args => {
30 | const [content, display = 'Click', bg = false, color = false] = parseArgs(args)
31 | const style = generateStyle(bg, color)
32 | return ``
33 | }
34 |
35 | const hideBlock = (args, content) => {
36 | const [display = 'Click', bg = false, color = false] = parseArgs(args)
37 | const style = generateStyle(bg, color)
38 | const renderedContent = hexo.render.renderSync({ text: content, engine: 'markdown' })
39 | return ``
40 | }
41 |
42 | const hideToggle = (args, content) => {
43 | const [display, bg = false, color = false] = parseArgs(args)
44 | const style = generateStyle(bg, color)
45 | const border = bg ? `style="border: 1px solid ${bg}"` : ''
46 | const renderedContent = hexo.render.renderSync({ text: content, engine: 'markdown' })
47 | return `${display}
${renderedContent}`
48 | }
49 |
50 | hexo.extend.tag.register('hideInline', hideInline)
51 | hexo.extend.tag.register('hideBlock', hideBlock, { ends: true })
52 | hexo.extend.tag.register('hideToggle', hideToggle, { ends: true })
--------------------------------------------------------------------------------
/scripts/tag/inlineImg.js:
--------------------------------------------------------------------------------
1 | /**
2 | * inlineImg
3 | * @param {Array} args - Image name and height
4 | * @param {string} args[0] - Image name
5 | * @param {number} args[1] - Image height
6 | * @returns {string} - Image tag
7 | */
8 |
9 | 'use strict'
10 |
11 | const urlFor = require('hexo-util').url_for.bind(hexo)
12 |
13 | const inlineImg = ([img, height = '']) => {
14 | const heightStyle = height ? `style="height:${height}"` : ''
15 | const src = urlFor(img)
16 | return `
`
17 | }
18 |
19 | hexo.extend.tag.register('inlineImg', inlineImg, { ends: false })
20 |
--------------------------------------------------------------------------------
/scripts/tag/label.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Butterfly
3 | * label
4 | * {% label text color %}
5 | */
6 |
7 | 'use strict'
8 |
9 | const addLabel = args => {
10 | const [text, className = 'default'] = args
11 | return `${text}`
12 | }
13 |
14 | hexo.extend.tag.register('label', addLabel, { ends: false })
15 |
--------------------------------------------------------------------------------
/scripts/tag/mermaid.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Butterfly
3 | * mermaid
4 | * https://github.com/mermaid-js/mermaid
5 | */
6 |
7 | 'use strict'
8 |
9 | const { escapeHTML } = require('hexo-util')
10 |
11 | const mermaid = (args, content) => {
12 | return `
13 | ${escapeHTML(content)}
14 | `
15 | }
16 |
17 | hexo.extend.tag.register('mermaid', mermaid, { ends: true })
18 |
--------------------------------------------------------------------------------
/scripts/tag/note.js:
--------------------------------------------------------------------------------
1 | /**
2 | * note.js
3 | * transplant from hexo-theme-next
4 | * Modify by Jerry
5 | */
6 |
7 | 'use strict'
8 |
9 | const postNote = (args, content) => {
10 | const styleConfig = hexo.theme.config.note.style
11 | const noteTag = ['flat', 'modern', 'simple', 'disabled']
12 | if (!noteTag.includes(args[args.length - 1])) {
13 | args.push(styleConfig)
14 | }
15 |
16 | let icon = ''
17 | const iconArray = args[args.length - 2]
18 | if (iconArray && iconArray.startsWith('fa')) {
19 | icon = ``
20 | args[args.length - 2] = 'icon-padding'
21 | }
22 |
23 | return `${icon + hexo.render.renderSync({ text: content, engine: 'markdown' })}`
24 | }
25 |
26 | hexo.extend.tag.register('note', postNote, { ends: true })
27 | hexo.extend.tag.register('subnote', postNote, { ends: true })
28 |
--------------------------------------------------------------------------------
/scripts/tag/score.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Music Score
3 | * {% score %}
4 | */
5 |
6 | 'use strict'
7 |
8 | const score = (args, content) => {
9 | // Escape HTML tags and some special characters, including curly braces
10 | const escapeHtmlTags = s => {
11 | const lookup = {
12 | '&': '&',
13 | '"': '"',
14 | "'": ''',
15 | '<': '<',
16 | '>': '>',
17 | '{': '{',
18 | '}': '}'
19 | }
20 | return s.replace(/[&"'<>{}]/g, c => lookup[c])
21 | }
22 |
23 | const trimmed = content.trim()
24 | // Split content using six dashes as a delimiter
25 | const parts = trimmed.split('------')
26 |
27 | if (parts.length < 2) {
28 | // If no delimiter is found, treat the entire content as the score
29 | return `${escapeHtmlTags(trimmed)}`
30 | }
31 |
32 | // First part is parameters (JSON string), the rest is the score content
33 | const paramPart = parts[0].trim()
34 | const scorePart = parts.slice(1).join('------').trim()
35 |
36 | let paramsObj = {}
37 | try {
38 | paramsObj = JSON.parse(paramPart)
39 | } catch (e) {
40 | console.error("Failed to parse JSON in score tag:", e)
41 | }
42 |
43 | // Use double quotes for data-params attribute value,
44 | // ensuring JSON internal double quotes are escaped
45 | return `
46 | ${escapeHtmlTags(scorePart)}
47 | `
48 | }
49 |
50 | hexo.extend.tag.register("score", score, { ends: true })
--------------------------------------------------------------------------------
/scripts/tag/series.js:
--------------------------------------------------------------------------------
1 | /**
2 | * series plugin
3 | * Syntax:
4 | * {% series [series name] %}
5 | * Usage:
6 | * {% series %}
7 | * {% series series1 %}
8 | */
9 |
10 | 'use strict'
11 |
12 | const urlFor = require('hexo-util').url_for.bind(hexo)
13 | const groups = {}
14 |
15 | hexo.extend.filter.register('before_post_render', data => {
16 | if (!hexo.theme.config.series.enable) return data
17 |
18 | const { layout, series } = data
19 | if (layout === 'post' && series) {
20 | if (!groups[series]) groups[series] = []
21 | groups[series].push({
22 | title: data.title,
23 | path: data.path,
24 | date: data.date.unix()
25 | })
26 | }
27 | return data
28 | })
29 |
30 | function series (args) {
31 | const { series } = hexo.theme.config
32 | if (!series.enable) {
33 | hexo.log.warn('Series plugin is disabled in the theme config')
34 | return ''
35 | }
36 |
37 | const seriesArr = args.length ? groups[args[0]] : groups[this.series]
38 |
39 | if (!seriesArr) {
40 | hexo.log.warn(`There is no series named "${args[0]}"`)
41 | return ''
42 | }
43 |
44 | const isAsc = (series.order || 1) === 1 // 1: asc, -1: desc
45 | const isSortByTitle = series.orderBy === 'title'
46 |
47 | const compareFn = (a, b) => {
48 | const itemA = isSortByTitle ? a.title.toUpperCase() : a.date
49 | const itemB = isSortByTitle ? b.title.toUpperCase() : b.date
50 |
51 | return itemA < itemB ? (isAsc ? -1 : 1) : itemA > itemB ? (isAsc ? 1 : -1) : 0
52 | }
53 |
54 | seriesArr.sort(compareFn)
55 |
56 | const listItems = seriesArr.map(ele =>
57 | `${ele.title} `
58 | ).join('')
59 |
60 | return series.number ? `${listItems}
` : `${listItems}
`
61 | }
62 |
63 | hexo.extend.tag.register('series', series, { ends: false })
64 |
--------------------------------------------------------------------------------
/scripts/tag/tabs.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Tabs
3 | * transplant from hexo-theme-next
4 | * modify by Jerry
5 | */
6 |
7 | 'use strict'
8 |
9 | const postTabs = (args, content) => {
10 | const tabBlock = /\n([\w\W\s\S]*?)/g
11 | args = args.join(' ').split(',')
12 | const tabName = args[0] || 'tab'
13 | const tabActive = Number(args[1]) || 0
14 | const matches = []
15 | let match
16 | let tabId = 0
17 | let tabNav = ''
18 | let tabContent = ''
19 | let noDefault = true
20 |
21 | while ((match = tabBlock.exec(content)) !== null) {
22 | matches.push(match[1], match[2])
23 | }
24 |
25 | for (let i = 0; i < matches.length; i += 2) {
26 | const [tabCaption = '', tabIcon = ''] = matches[i].split('@')
27 | let postContent = matches[i + 1]
28 |
29 | postContent = hexo.render.renderSync({ text: postContent, engine: 'markdown' }).trim()
30 | tabId += 1
31 |
32 | const caption = (tabCaption || tabIcon) ? tabCaption : `${tabName} ${tabId}`
33 | const iconHtml = tabIcon ? `` : ''
34 | const isActive = (tabActive > 0 && tabActive === tabId) || (tabActive === 0 && tabId === 1) ? ' active' : ''
35 |
36 | if (isActive) noDefault = false
37 |
38 | tabNav += ``
39 | tabContent += `${postContent}`
40 | }
41 |
42 | const toTop = ''
43 | tabNav = ``
44 | tabContent = `${tabContent}`
45 |
46 | return `${tabNav}${tabContent}${toTop}`
47 | }
48 |
49 | hexo.extend.tag.register('tabs', postTabs, { ends: true })
50 | hexo.extend.tag.register('subtabs', postTabs, { ends: true })
51 | hexo.extend.tag.register('subsubtabs', postTabs, { ends: true })
52 |
--------------------------------------------------------------------------------
/scripts/tag/timeline.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Timeline tag for Hexo
3 | * Syntax:
4 | * {% timeline [headline],[color] %}
5 | *
6 | * [content]
7 | *
8 | *
9 | * [content]
10 | *
11 | * {% endtimeline %}
12 | */
13 |
14 | 'use strict'
15 |
16 | const timeLineFn = (args, content) => {
17 | // Use named capture groups for better readability
18 | const tlBlock = /\n(?[\s\S]*?)/g
19 |
20 | // Pre-compile markdown render function
21 | const renderMd = text => hexo.render.renderSync({ text, engine: 'markdown' })
22 |
23 | // Parse arguments more efficiently
24 | const [text, color = ''] = args.length ? args.join(' ').split(',') : []
25 |
26 | // Build initial headline if text exists
27 | const headline = text
28 | ? `
29 |
30 | ${renderMd(text)}
31 |
32 | `
33 | : ''
34 |
35 | // Match all timeline blocks in one pass and transform
36 | const items = Array.from(content.matchAll(tlBlock))
37 | .map(({ groups: { title, content } }) =>
38 | `
39 |
40 | ${renderMd(title)}
41 |
42 | ${renderMd(content)}
43 | `
44 | )
45 | .join('')
46 |
47 | return `${headline}${items}`
48 | }
49 |
50 | hexo.extend.tag.register('timeline', timeLineFn, { ends: true })
51 |
--------------------------------------------------------------------------------
/source/css/_highlight/highlight/diff.styl:
--------------------------------------------------------------------------------
1 | figure.highlight
2 | table
3 | // scrollbar - firefox
4 | @-moz-document url-prefix()
5 | scrollbar-color: var(--hlscrollbar-bg) transparent
6 |
7 | &::-webkit-scrollbar-thumb
8 | background: var(--hlscrollbar-bg)
9 |
10 | pre .deletion
11 | color: $highlight-deletion
12 |
13 | pre .addition
14 | color: $highlight-addition
15 |
16 | pre .meta
17 | color: $highlight-purple
18 |
19 | pre
20 | .comment
21 | color: $highlight-comment
22 |
23 | .variable,
24 | .attribute,
25 | .regexp,
26 | .ruby .constant,
27 | .xml .tag .title,
28 | .xml .pi,
29 | .xml .doctype,
30 | .html .doctype,
31 | .css .id,
32 | .tag .name,
33 | .css .class,
34 | .css .pseudo
35 | color: $highlight-red
36 |
37 | .tag
38 | color: $highlight-aqua
39 |
40 | .number,
41 | .preprocessor,
42 | .literal,
43 | .params,
44 | .constant,
45 | .command
46 | color: $highlight-orange
47 |
48 | .built_in
49 | color: $highlight-yellow
50 |
51 | .ruby .class .title,
52 | .css .rules .attribute,
53 | .string,
54 | .value,
55 | .inheritance,
56 | .header,
57 | .ruby .symbol,
58 | .xml .cdata,
59 | .special,
60 | .number,
61 | .formula
62 | color: $highlight-green
63 |
64 | .keyword,
65 | .title,
66 | .css .hexcolor
67 | color: $highlight-aqua
68 |
69 | .function,
70 | .python .decorator,
71 | .python .title,
72 | .ruby .function .title,
73 | .ruby .title .keyword,
74 | .perl .sub,
75 | .javascript .title,
76 | .coffeescript .title
77 | color: $highlight-blue
78 |
79 | .tag .attr,
80 | .javascript .function
81 | color: $highlight-purple
82 |
--------------------------------------------------------------------------------
/source/css/_highlight/highlight/index.styl:
--------------------------------------------------------------------------------
1 | if $highlight_theme != false
2 | @require 'diff'
3 |
4 | .container
5 | figure.highlight
6 | .line
7 | if wordWrap
8 | &:before
9 | display: inline-block
10 | padding: 0 6px 0 0
11 | min-width: 30px
12 | color: var(--hlnumber-color)
13 | content: counter(line)
14 | counter-increment: line
15 | text-align: left
16 |
17 | &.marked
18 | background-color: $highlight-selection
19 |
20 | table
21 | display: block
22 | overflow: auto
23 | border: none
24 |
25 | td
26 | padding: 0
27 | border: none
28 |
29 | .gutter pre
30 | padding-right: 10px
31 | padding-left: 10px
32 | background-color: var(--hlnumber-bg)
33 | color: var(--hlnumber-color)
34 | text-align: right
35 |
36 | .code pre
37 | padding-right: 10px
38 | padding-left: 10px
39 | width: 100%
40 |
--------------------------------------------------------------------------------
/source/css/_highlight/prismjs/index.styl:
--------------------------------------------------------------------------------
1 | if $prismjs_line_number
2 | @require 'line-number'
3 |
4 | if $highlight_theme != false
5 | @require 'diff'
6 |
7 | .container
8 | pre[class*='language-']
9 | // scrollbar - firefox
10 | @-moz-document url-prefix()
11 | scrollbar-color: var(--hlscrollbar-bg) transparent
12 |
13 | &::-webkit-scrollbar-thumb
14 | background: var(--hlscrollbar-bg)
15 |
16 | &:not(.line-numbers)
17 | padding: 10px 20px
18 |
19 | .caption
20 | margin-left: -3.8em
21 | padding: 4px 16px !important
22 |
23 | a
24 | padding: 0 !important
25 |
--------------------------------------------------------------------------------
/source/css/_highlight/prismjs/line-number.styl:
--------------------------------------------------------------------------------
1 | .container
2 | pre[class*='language-']
3 | &.line-numbers
4 | position: relative
5 | padding-left: 3.8em
6 | counter-reset: linenumber
7 | line-height: $line-height-code-block
8 |
9 | > code
10 | position: relative
11 | line-height: $line-height-code-block
12 |
13 | if hexo-config('code_blocks.word_wrap')
14 | white-space: pre-wrap
15 | else
16 | white-space: inherit
17 | word-wrap: normal
18 | word-break: normal
19 | overflow-wrap: normal
20 |
21 | .line-numbers-rows
22 | position: absolute
23 | top: 0
24 | left: -3.8em
25 | width: 3em
26 | letter-spacing: -1px
27 | font-size: 100%
28 | pointer-events: none
29 | user-select: none
30 | -webkit-user-select: none
31 |
32 | & > span
33 | display: block
34 | counter-increment: linenumber
35 | pointer-events: none
36 |
37 | &:before
38 | display: block
39 | padding-right: .8em
40 | color: var(--hlnumber-color)
41 | content: counter(linenumber)
42 | text-align: right
43 |
--------------------------------------------------------------------------------
/source/css/_layout/chat.styl:
--------------------------------------------------------------------------------
1 | // chat
2 | if hexo-config('chat.rightside_button') == true
3 | if hexo-config('chat.use') == 'chatra'
4 | #chatra:not(.chatra--expanded)
5 | visibility: hidden !important
6 | width: 1px !important
7 | height: 1px !important
8 | opacity: 0 !important
9 | pointer-events: none
--------------------------------------------------------------------------------
/source/css/_layout/comments.styl:
--------------------------------------------------------------------------------
1 | #post-comment
2 | .comment-head
3 | margin-bottom: 20px
4 |
5 | &:after
6 | display: block
7 | clear: both
8 | content: ''
9 |
10 | .comment-headline
11 | display: inline-block
12 | vertical-align: middle
13 | font-weight: 700
14 | font-size: 1.43em
15 |
16 | .comment-switch
17 | display: inline-block
18 |
19 | if hexo-config('comments.text')
20 | float: right
21 | margin: 2px auto 0
22 | padding: 4px 16px
23 | width: max-content
24 | border-radius: 8px
25 | background: $comments-switch-bg
26 | else
27 | vertical-align: middle
28 |
29 | > span
30 | display: none
31 |
32 | .first-comment
33 | color: $comments-switch-first-text
34 |
35 | .second-comment
36 | color: $comments-switch-second-text
37 |
38 | #switch-btn
39 | position: relative
40 | display: inline-block
41 | margin: -4px 8px 0
42 | width: 42px
43 | height: 22px
44 | border-radius: 34px
45 | background-color: $comments-switch-first-text
46 | vertical-align: middle
47 | cursor: pointer
48 | transition: .4s
49 |
50 | &:before
51 | position: absolute
52 | bottom: 4px
53 | left: 4px
54 | width: 14px
55 | height: 14px
56 | border-radius: 50%
57 | background-color: $comments-switch-round
58 | content: ''
59 | transition: .4s
60 |
61 | .comment-wrap
62 | > div
63 | animation: tabshow .5s
64 |
65 | &:nth-child(2)
66 | display: none
67 |
68 | &.move
69 | #switch-btn
70 | background-color: $comments-switch-second-text
71 |
72 | &:before
73 | transform: translateX(20px)
74 |
75 | .comment-wrap
76 | > div
77 | &:first-child
78 | display: none
79 |
80 | &:last-child
81 | display: block
--------------------------------------------------------------------------------
/source/css/_layout/footer.styl:
--------------------------------------------------------------------------------
1 | #footer
2 | position: relative
3 | background-color: $light-blue
4 | background-attachment: scroll
5 | background-position: bottom
6 | background-size: cover
7 |
8 | if hexo-config('footer_img') != false && hexo-config('mask.footer')
9 | &:before
10 | position: absolute
11 | width: 100%
12 | height: 100%
13 | background-color: var(--mark-bg)
14 | content: ''
15 |
16 | & > *
17 | position: relative
18 | color: var(--light-grey)
19 |
20 | a
21 | color: var(--light-grey)
22 | transition: all .3s ease-in-out
23 |
24 | &:hover
25 | color: $light-blue
26 |
27 | .footer-separator
28 | margin: 0 4px
29 |
30 | .icp-icon
31 | padding: 0 4px
32 | max-height: 1.4em
33 | width: auto
34 | vertical-align: text-bottom
35 |
36 | .footer-flex
37 | display: flex
38 | flex-direction: row
39 | flex-wrap: wrap
40 | justify-content: space-between
41 | margin: 0 auto
42 | padding: 40px 60px
43 | max-width: 1200px
44 | width: 100%
45 | text-align: left
46 | gap: 13px
47 |
48 | +maxWidth768()
49 | padding: 30px
50 | gap: 10px
51 |
52 | .footer-flex-items
53 | flex-shrink: 0
54 | min-width: 100px
55 | text-align: left
56 | white-space: nowrap
57 |
58 | .footer-flex-title
59 | margin-bottom: 5px
60 | white-space: nowrap
61 | font-weight: 600
62 | font-size: 1.4em
63 |
64 | .footer-flex-item
65 | margin: 10px 0
66 | white-space: nowrap
67 |
68 | a
69 | display: block
70 | white-space: nowrap
71 |
72 | .footer-other
73 | padding: 40px 20px
74 | width: 100%
75 | text-align: center
76 |
77 | if hexo-config('footer.nav')
78 | padding: 10px 8px
79 | background-color: rgba(0, 0, 0, .1)
80 |
81 | .copyright,
82 | .framework-info,
83 | .footer_custom_text
84 | font-size: .9em
85 | else
86 | .framework-info
87 | display: block
--------------------------------------------------------------------------------
/source/css/_layout/loading.styl:
--------------------------------------------------------------------------------
1 | if hexo-config('preloader.enable') && hexo-config('preloader.source') == 1
2 | .loading-bg
3 | position: fixed
4 | z-index: 1000
5 | width: 50%
6 | height: 100%
7 | background-color: var(--preloader-bg)
8 |
9 | #loading-box
10 | .loading-left-bg
11 | @extend .loading-bg
12 |
13 | .loading-right-bg
14 | @extend .loading-bg
15 | right: 0
16 |
17 | .spinner-box
18 | position: fixed
19 | z-index: 1001
20 | display: flex
21 | justify-content: center
22 | align-items: center
23 | width: 100%
24 | height: 100vh
25 |
26 | .configure-border-1
27 | position: absolute
28 | padding: 3px
29 | width: 115px
30 | height: 115px
31 | background: #ffab91
32 | animation: configure-clockwise 3s ease-in-out 0s infinite alternate
33 |
34 | .configure-border-2
35 | left: -115px
36 | padding: 3px
37 | width: 115px
38 | height: 115px
39 | background: rgb(63, 249, 220)
40 | transform: rotate(45deg)
41 | animation: configure-xclockwise 3s ease-in-out 0s infinite alternate
42 |
43 | .loading-word
44 | position: absolute
45 | color: var(--preloader-color)
46 | font-size: 16px
47 |
48 | .configure-core
49 | width: 100%
50 | height: 100%
51 | background-color: var(--preloader-bg)
52 |
53 | &.loaded
54 | .loading-left-bg
55 | transition: all .5s
56 | transform: translate(-100%, 0)
57 |
58 | .loading-right-bg
59 | transition: all .5s
60 | transform: translate(100%, 0)
61 |
62 | .spinner-box
63 | display: none
64 |
65 | @keyframes configure-clockwise
66 | 0%
67 | transform: rotate(0)
68 |
69 | 25%
70 | transform: rotate(90deg)
71 |
72 | 50%
73 | transform: rotate(180deg)
74 |
75 | 75%
76 | transform: rotate(270deg)
77 |
78 | 100%
79 | transform: rotate(360deg)
80 |
81 | @keyframes configure-xclockwise
82 | 0%
83 | transform: rotate(45deg)
84 |
85 | 25%
86 | transform: rotate(-45deg)
87 |
88 | 50%
89 | transform: rotate(-135deg)
90 |
91 | 75%
92 | transform: rotate(-225deg)
93 |
94 | 100%
95 | transform: rotate(-315deg)
96 |
--------------------------------------------------------------------------------
/source/css/_layout/pagination.styl:
--------------------------------------------------------------------------------
1 | #pagination
2 | .pagination
3 | margin-top: 20px
4 | text-align: center
5 |
6 | .page-number
7 | &.current
8 | background: $theme-paginator-color
9 | color: var(--white)
10 |
11 | .full-width
12 | width: 100% !important
13 |
14 | .pagination-related
15 | height: 150px
16 |
17 | +minWidth768()
18 | flex: 1
19 |
20 | .info-1
21 | .info-item-2
22 | -webkit-line-clamp: 1
23 |
24 | .info-2
25 | .info-item-1
26 | -webkit-line-clamp: 2
27 |
28 | &.pagination-post
29 | overflow: hidden
30 | margin-top: 40px
31 | width: 100%
32 | addBorderRadius()
33 | display: flex
34 |
35 | +maxWidth768()
36 | flex-direction: column
37 |
38 | .layout
39 | .pagination
40 | & > *
41 | display: inline-block
42 | margin: 0 6px
43 | width: w = 2.5em
44 | height: w
45 | line-height: w
46 |
47 | & > *:not(.space)
48 | @extend .cardHover
49 |
50 | &:hover
51 | background: var(--btn-hover-color)
52 | color: var(--btn-color)
53 |
54 | #archive
55 | .pagination
56 | margin-top: 30px
57 |
58 | & > *:not(.space)
59 | box-shadow: none
60 |
61 | .pagination-related
62 | position: relative
63 | display: inline-block
64 | overflow: hidden
65 | background: $dark-black
66 | vertical-align: bottom
67 | @extend .postImgHover
68 |
69 | &.next-post
70 | .info
71 | text-align: right
72 |
73 | .info
74 | .info-1,
75 | .info-2
76 | @extend .verticalCenter
77 | padding: 20px 40px
78 | color: var(--white)
79 | transition: transform .3s, opacity .3s
80 |
81 | .info-1
82 | .info-item-1
83 | color: var(--light-grey)
84 | text-transform: uppercase
85 | font-size: 90%
86 |
87 | .info-item-2
88 | @extend .limit-more-line
89 | color: var(--white)
90 | font-weight: 500
91 |
92 | .info-2
93 | opacity: 0
94 | transform: translate(0, 0)
95 |
96 | .info-item-1
97 | @extend .limit-more-line
98 |
99 | &:not(.no-desc):hover
100 | .info-1
101 | opacity: 0
102 | transform: translate(0, -100%)
103 |
104 | .info-2
105 | opacity: 1
106 | transform: translate(0, -50%)
--------------------------------------------------------------------------------
/source/css/_layout/relatedposts.styl:
--------------------------------------------------------------------------------
1 | .relatedPosts
2 | margin-top: 40px
3 |
4 | & > .headline
5 | margin-bottom: 5px
6 | font-weight: 700
7 | font-size: 1.43em
8 |
9 | & > .relatedPosts-list
10 | & > a
11 | margin: 3px
12 | width: calc(33.333% - 6px)
13 | height: 200px
14 | addBorderRadius()
15 |
16 | +maxWidth768()
17 | margin: 2px
18 | width: calc(50% - 4px)
19 | height: 150px
20 |
21 | +maxWidth600()
22 | width: calc(100% - 4px)
23 |
24 | .info
25 | .info-1
26 | .info-item-2
27 | -webkit-line-clamp: 2
28 |
29 | .info-2
30 | .info-item-1
31 | -webkit-line-clamp: 3
--------------------------------------------------------------------------------
/source/css/_layout/reward.styl:
--------------------------------------------------------------------------------
1 | .post-reward
2 | position: relative
3 | margin-top: 80px
4 | width: 100%
5 | text-align: center
6 | pointer-events: none
7 |
8 | & > *
9 | pointer-events: auto
10 |
11 | .reward-button
12 | display: inline-block
13 | padding: 4px 24px
14 | background: var(--btn-bg)
15 | color: var(--btn-color)
16 | cursor: pointer
17 | addBorderRadius()
18 |
19 | i
20 | margin-right: 5px
21 |
22 | &:hover
23 | .reward-button
24 | background: var(--btn-hover-color)
25 |
26 | & > .reward-main
27 | display: block
28 |
29 | .reward-main
30 | position: absolute
31 | bottom: 40px
32 | left: 0
33 | z-index: 100
34 | display: none
35 | padding: 0 0 15px
36 | width: 100%
37 | addBorderRadius()
38 |
39 | .reward-all
40 | display: inline-block
41 | margin: 0
42 | padding: 20px 10px
43 | background: var(--reward-pop)
44 |
45 | &:before
46 | position: absolute
47 | bottom: -10px
48 | left: 0
49 | width: 100%
50 | height: 20px
51 | content: ''
52 |
53 | &:after
54 | position: absolute
55 | right: 0
56 | bottom: 2px
57 | left: 0
58 | margin: 0 auto
59 | width: 0
60 | height: 0
61 | border-top: 13px solid var(--reward-pop)
62 | border-right: 13px solid transparent
63 | border-left: 13px solid transparent
64 | content: ''
65 |
66 | .reward-item
67 | display: inline-block
68 | padding: 0 8px
69 | list-style-type: none
70 | vertical-align: top
71 |
72 | img
73 | width: 130px
74 | height: 130px
75 |
76 | .post-qr-code-desc
77 | width: 130px
78 | color: $reward-pop-up-color
79 |
--------------------------------------------------------------------------------
/source/css/_layout/rightside.styl:
--------------------------------------------------------------------------------
1 | #rightside
2 | position: fixed
3 | right: -48px
4 | bottom: $rightside-bottom
5 | z-index: 100
6 | opacity: 0
7 | transition: all .5s
8 |
9 | &.rightside-show
10 | opacity: .8
11 | transform: translate(-58px, 0)
12 |
13 | #rightside-config-hide
14 | height: 0
15 | opacity: 0
16 | transition: transform .4s
17 | transform: translate(45px, 0)
18 |
19 | &.show
20 | height: auto
21 | opacity: 1
22 | transform: translate(0, 0)
23 |
24 | &.status
25 | height: auto
26 | opacity: 1
27 |
28 | & > div
29 | & > button,
30 | & > a
31 | display: block
32 | margin-bottom: 5px
33 | width: w = 35px
34 | height: w
35 | background-color: var(--btn-bg)
36 | color: var(--btn-color)
37 | text-align: center
38 | font-size: 16px
39 | line-height: w
40 | addBorderRadius(5)
41 |
42 | &:hover
43 | background-color: var(--btn-hover-color)
44 |
45 | #mobile-toc-button
46 | display: none
47 |
48 | +maxWidth900()
49 | display: block
50 |
51 | +maxWidth900()
52 | #hide-aside-btn
53 | display: none
54 |
55 | if hexo-config('rightside_scroll_percent')
56 | #go-up
57 | .scroll-percent
58 | display: none
59 |
60 | &.show-percent
61 | .scroll-percent
62 | display: block
63 |
64 | & + i
65 | display: none
66 |
67 | &:hover
68 | .scroll-percent
69 | display: none
70 |
71 | & + i
72 | display: block
73 |
--------------------------------------------------------------------------------
/source/css/_layout/sidebar.styl:
--------------------------------------------------------------------------------
1 | #sidebar
2 | #menu-mask
3 | position: fixed
4 | z-index: 102
5 | display: none
6 | width: 100%
7 | height: 100%
8 | background: alpha($dark-black, .8)
9 |
10 | #sidebar-menus
11 | position: fixed
12 | top: 0
13 | right: -($sidebar-width)
14 | z-index: 103
15 | overflow-x: hidden
16 | overflow-y: scroll
17 | padding-left: 5px
18 | width: $sidebar-width
19 | height: 100%
20 | background: var(--sidebar-bg)
21 | transition: all .5s
22 |
23 | &.open
24 | transform: translate3d(-100%, 0, 0)
25 |
26 | & > .avatar-img
27 | margin: 20px auto
28 |
29 | .site-data
30 | padding: 0 10px
31 |
32 | hr
33 | margin: 20px auto
34 |
35 | .menus_items
36 | margin: 20px
37 | padding: 15px
38 | background: var(--sidebar-menu-bg)
39 | box-shadow: 0 0 1px 1px rgba(7, 17, 27, .05)
40 | addBorderRadius(10)
41 |
42 | .site-page
43 | @extend .limit-one-line
44 | position: relative
45 | display: block
46 | margin: 4px 0
47 | padding: 2px 23px 2px 15px
48 | color: var(--font-color)
49 | font-size: 1.15em
50 | cursor: pointer
51 | addBorderRadius(6)
52 |
53 | &:hover
54 | background: var(--text-bg-hover)
55 | color: var(--white)
56 |
57 | i:first-child
58 | width: 15%
59 | text-align: left
60 |
61 | &.group
62 | & > i:last-child
63 | position: absolute
64 | top: .6em
65 | right: 10px
66 | transition: transform .3s
67 |
68 | &.hide
69 | & > i:last-child
70 | transform: rotate(90deg)
71 |
72 | & + .menus_item_child
73 | display: none
74 |
75 | .menus_item_child
76 | margin: 0
77 | padding-left: 25px
78 | list-style: none
--------------------------------------------------------------------------------
/source/css/_page/404.styl:
--------------------------------------------------------------------------------
1 | if hexo-config('error_404.enable')
2 | .type-404
3 | .error-content
4 | @extend .cardHover
5 | overflow: hidden
6 | margin: 0 20px
7 | height: 360px
8 |
9 | +maxWidth768()
10 | margin: 0
11 | height: 500px
12 |
13 | .error-img
14 | display: inline-block
15 | overflow: hidden
16 | width: 50%
17 | height: 100%
18 |
19 | +maxWidth768()
20 | width: 100%
21 | height: 45%
22 |
23 | img
24 | @extend .imgHover
25 | background-color: $theme-color
26 |
27 | .error-info
28 | display: inline-flex
29 | flex-direction: column
30 | justify-content: center
31 | align-content: center
32 | width: 50%
33 | height: 100%
34 | vertical-align: top
35 | text-align: center
36 |
37 | if $site-name-font
38 | font-family: $site-name-font
39 |
40 | +maxWidth768()
41 | width: 100%
42 | height: 55%
43 |
44 | .error_title
45 | margin-top: -.6em
46 | font-size: 9em
47 |
48 | +maxWidth768()
49 | font-size: 8em
50 |
51 | .error_subtitle
52 | @extend .limit-more-line
53 | margin-top: -3em
54 | word-break: break-word
55 | font-size: 1.6em
56 | -webkit-line-clamp: 2
57 |
58 | .nc
59 | margin-top: 5%
60 | padding: 0 20px
61 |
62 | #footer
63 | display: none
64 |
65 | & + #rightside
66 | display: none
--------------------------------------------------------------------------------
/source/css/_page/archives.styl:
--------------------------------------------------------------------------------
1 | .article-sort
2 | margin-left: 10px
3 | padding-left: 20px
4 | border-left: 2px solid lighten($light-blue, 20)
5 |
6 | &-title
7 | position: relative
8 | margin-left: 10px
9 | padding-bottom: 20px
10 | padding-left: 20px
11 | font-size: 1.72em
12 |
13 | &:hover
14 | &:before
15 | border-color: var(--pseudo-hover)
16 |
17 | &:before
18 | position: absolute
19 | top: calc(((100% - 36px) / 2))
20 | left: -9px
21 | z-index: 1
22 | width: w = 10px
23 | height: h = w
24 | border: .5 * w solid $light-blue
25 | border-radius: w
26 | background: var(--card-bg)
27 | content: ''
28 | line-height: h
29 | transition: all .2s ease-in-out
30 |
31 | &:after
32 | position: absolute
33 | bottom: 0
34 | left: 0
35 | z-index: 0
36 | width: 2px
37 | height: 1.5em
38 | background: lighten($light-blue, 20)
39 | content: ''
40 |
41 | &-item
42 | position: relative
43 | display: flex
44 | align-items: center
45 | margin: 0 0 20px 10px
46 | transition: all .2s ease-in-out
47 |
48 | &:hover
49 | &:before
50 | border-color: var(--pseudo-hover)
51 |
52 | &:before
53 | $w = 6px
54 | position: absolute
55 | left: calc(-20px - 17px)
56 | width: w = $w
57 | height: h = w
58 | border: .5 * w solid $light-blue
59 | border-radius: w
60 | background: var(--card-bg)
61 | content: ''
62 | transition: all .2s ease-in-out
63 |
64 | &.no-article-cover
65 | height: 80px
66 |
67 | .article-sort-item-info
68 | padding: 0
69 |
70 | &.year
71 | font-size: 1.43em
72 | margin-bottom: 10px
73 |
74 | &:hover
75 | &:before
76 | border-color: $light-blue
77 |
78 | &:before
79 | border-color: var(--pseudo-hover)
80 |
81 | &-time
82 | color: var(--card-meta)
83 | font-size: .85em
84 |
85 | time
86 | padding-left: 6px
87 | cursor: default
88 |
89 | &-title
90 | @extend .limit-more-line
91 | color: var(--font-color)
92 | font-size: 1.05em
93 | transition: all .3s
94 | -webkit-line-clamp: 2
95 |
96 | &:hover
97 | color: $text-hover
98 | transform: translateX(10px)
99 |
100 | &-img
101 | overflow: hidden
102 | width: 100px
103 | height: 70px
104 | addBorderRadius()
105 |
106 | +maxWidth768()
107 | width: 70px
108 | height: 70px
109 |
110 | :first-child
111 | @extend .imgHover
112 |
113 | &-info
114 | flex: 1
115 | padding: 0 16px
116 |
--------------------------------------------------------------------------------
/source/css/_page/categories.styl:
--------------------------------------------------------------------------------
1 | .category-lists
2 | .category-title
3 | font-size: 2.57em
4 |
5 | +maxWidth768()
6 | font-size: 2em
7 |
8 | .category-list
9 | margin-bottom: 0
10 |
11 | a
12 | color: var(--font-color)
13 |
14 | &:hover
15 | color: $text-hover
16 |
17 | .category-list-count
18 | margin-left: 8px
19 | color: var(--card-meta)
20 |
21 | &:before
22 | content: '('
23 |
24 | &:after
25 | content: ')'
26 |
27 | ul
28 | padding: 0 0 0 20px
29 | @extend .list-beauty
30 |
31 | ul
32 | padding-left: 4px
33 |
34 | li
35 | position: relative
36 | margin: 6px 0
37 | padding: .12em .4em .12em 1.4em
38 |
--------------------------------------------------------------------------------
/source/css/_page/common.styl:
--------------------------------------------------------------------------------
1 | #body-wrap
2 | display: flex
3 | flex-direction: column
4 | min-height: 100vh
5 |
6 | .layout
7 | display: flex
8 | flex: 1 auto
9 | margin: 0 auto
10 | padding: 40px 15px
11 | max-width: 1200px
12 | width: 100%
13 |
14 | +maxWidth900()
15 | flex-direction: column
16 |
17 | +maxWidth768()
18 | padding: 20px 5px
19 |
20 | +minWidth2000()
21 | max-width: 70%
22 |
23 | & > div:first-child:not(.nc)
24 | @extend .cardHover
25 | align-self: flex-start
26 | padding: 50px 40px
27 |
28 | +maxWidth768()
29 | padding: 36px 14px
30 |
31 | & > div:first-child
32 | width: 74%
33 | transition: all .3s
34 |
35 | +maxWidth900()
36 | width: 100% !important
37 |
38 | if hexo-config('aside.position') == 'left'
39 | +minWidth900()
40 | order: 2
41 |
42 | // 隱藏aside
43 | &.hide-aside
44 | max-width: 1000px
45 |
46 | +minWidth2000()
47 | max-width: 1300px
48 |
49 | & > div
50 | width: 100% !important
51 |
52 | // for apple device
53 | .apple
54 | #page-header.full_page
55 | background-attachment: scroll !important
56 |
57 | .recent-post-item,
58 | .avatar-img,
59 | .flink-item-icon
60 | transform: translateZ(0)
61 |
--------------------------------------------------------------------------------
/source/css/_page/flink.styl:
--------------------------------------------------------------------------------
1 | .container
2 | .flink
3 | margin-bottom: 20px
4 |
5 | .flink-list
6 | overflow: auto
7 | padding: 10px 10px 0
8 | text-align: center
9 |
10 | & > .flink-list-item
11 | position: relative
12 | float: left
13 | overflow: hidden
14 | margin: 15px 7px
15 | width: calc(100% / 3 - 15px)
16 | height: 90px
17 | line-height: 17px
18 | -webkit-transform: translateZ(0)
19 | addBorderRadius(8)
20 |
21 | +maxWidth1024()
22 | width: calc(50% - 15px) !important
23 |
24 | +maxWidth600()
25 | width: calc(100% - 15px) !important
26 |
27 | &:hover
28 | .flink-item-icon
29 | margin-left: -10px
30 | width: 0
31 |
32 | &:before
33 | position: absolute
34 | top: 0
35 | right: 0
36 | bottom: 0
37 | left: 0
38 | z-index: -1
39 | background: var(--text-bg-hover)
40 | content: ''
41 | transition: transform .3s ease-out
42 | transform: scale(0)
43 |
44 | &:hover:before,
45 | &:focus:before,
46 | &:active:before
47 | transform: scale(1)
48 |
49 | a
50 | color: var(--font-color)
51 | text-decoration: none
52 |
53 | .flink-item-icon
54 | float: left
55 | overflow: hidden
56 | margin: 15px 10px
57 | width: 60px
58 | height: 60px
59 | border-radius: 7px
60 | transition: width .3s ease-out
61 |
62 | img
63 | width: 100%
64 | height: 100%
65 | transition: filter 375ms ease-in .2s, transform .3s
66 | object-fit: cover
67 |
68 | .img-alt
69 | display: none
70 |
71 | .flink-item-name
72 | @extend .limit-one-line
73 | padding: 16px 10px 0 0
74 | height: 40px
75 | font-weight: bold
76 | font-size: 1.43em
77 |
78 | .flink-item-desc
79 | @extend .limit-one-line
80 | padding: 16px 10px 16px 0
81 | height: 50px
82 | font-size: .93em
83 |
84 | .flink-name
85 | margin-bottom: 5px
86 | font-weight: bold
87 | font-size: 1.5em
--------------------------------------------------------------------------------
/source/css/_page/shuoshuo.styl:
--------------------------------------------------------------------------------
1 | #article-container
2 | .shuoshuo-item
3 | @extend .cardHover
4 | margin-bottom: 20px
5 | padding: 35px 30px 30px
6 |
7 | +maxWidth768()
8 | padding: 25px 20px 20px
9 |
10 | .shuoshuo-item-header
11 | display: flex
12 | align-items: center
13 | cursor: default
14 |
15 | .shuoshuo-avatar
16 | overflow: hidden
17 | width: 40px
18 | height: 40px
19 | border-radius: 40px
20 |
21 | img
22 | margin: 0
23 | width: 100%
24 | height: 100%
25 |
26 | .shuoshuo-info
27 | margin-left: 10px
28 | line-height: 1.5
29 |
30 | .shuoshuo-date
31 | color: #858585
32 | font-size: .8em
33 |
34 | .shuoshuo-content
35 | padding: 15px 0 10px
36 |
37 | & > *:last-child
38 | margin-bottom: 0
39 |
40 | .shuoshuo-footer
41 | display: flex
42 | align-items: center
43 |
44 | &.flex-between
45 | justify-content: space-between
46 |
47 | &.flex-end
48 | justify-content: flex-end
49 |
50 | .shuoshuo-tag
51 | display: inline-block
52 | margin-right: 8px
53 | padding: 0 8px
54 | width: fit-content
55 | border: 1px solid $light-blue
56 | border-radius: 12px
57 | color: $light-blue
58 | font-size: .85em
59 | cursor: default
60 | transition: all .2s ease-in-out
61 |
62 | &:hover
63 | background: $light-blue
64 | color: var(--white)
65 |
66 | .shuoshuo-comment-btn
67 | padding: 2px
68 | color: #90a4ae
69 | cursor: pointer
70 |
71 | &:hover
72 | color: $light-blue
73 |
74 | .shuoshuo-comment
75 | padding-top: 10px
76 |
77 | &.no-comment
78 | display: none
79 |
--------------------------------------------------------------------------------
/source/css/_page/tags.styl:
--------------------------------------------------------------------------------
1 | .tag-cloud
2 | &-list
3 | a
4 | display: inline-block
5 | margin: 2px
6 | padding: 2px 7px
7 | line-height: 1.7
8 | transition: all .3s
9 | addBorderRadius(5)
10 |
11 | &:hover
12 | background: var(--btn-bg) !important
13 | box-shadow: 2px 2px 6px rgba(0, 0, 0, .2)
14 | color: var(--btn-color) !important
15 |
16 | +maxWidth768()
17 | zoom: .85
18 |
19 | &-title
20 | font-size: 2.57em
21 |
22 | +maxWidth768()
23 | font-size: 2em
24 |
25 | .page-title
26 | & + .tag-cloud-list
27 | text-align: left
28 |
--------------------------------------------------------------------------------
/source/css/_search/algolia.styl:
--------------------------------------------------------------------------------
1 | #algolia-search
2 | .search-dialog
3 | .ais-SearchBox
4 | input
5 | padding: 5px 14px
6 | width: 100%
7 | outline: none
8 | border: 2px solid $search-color
9 | border-radius: 40px
10 | background: var(--search-bg)
11 | color: var(--search-input-color)
12 |
13 | .ais-SearchBox-loadingIndicator
14 | position: absolute
15 | top: 18px
16 | left: 67px
17 |
18 | .ais-Hits-list
19 | margin: 0
20 | padding: 0
21 | @extend .list-beauty
22 |
23 | a
24 | color: var(--search-a-color)
25 |
26 | &:hover
27 | color: $search-color
28 |
29 | mark
30 | background: transparent
31 | color: $search-keyword-highlight
32 | font-weight: bold
33 |
34 | .algolia-hits-item-title
35 | font-weight: 600
36 |
37 | .algolia-hit-item-content
38 | margin: 0 0 8px
39 | word-break: break-word
40 |
41 | .ais-Pagination
42 | margin: 15px 0 0
43 | padding: 0
44 | text-align: center
45 |
46 | .ais-Pagination-list
47 | margin: 0
48 | padding: 0
49 | list-style: none
50 |
51 | .ais-Pagination-item
52 | display: inline
53 | margin: 0 4px
54 | padding: 0
55 |
56 | .ais-Pagination-link
57 | display: inline-block
58 | min-width: 24px
59 | height: 24px
60 | text-align: center
61 | line-height: 24px
62 | addBorderRadius()
63 |
64 | .ais-Pagination-item--selected
65 | a
66 | background: $theme-paginator-color
67 | color: #eee
68 | cursor: default
69 |
70 | .ais-Pagination-item--disabled
71 | visibility: hidden
72 |
73 | #algolia-hits
74 | > div
75 | overflow-y: overlay
76 | margin: 0 -20px
77 | padding: 0 22px
78 | max-height: calc(80vh - 220px)
79 |
80 | +maxWidth768()
81 | max-height: none
82 | height: calc(var(--search-height) - 235px)
83 |
84 | #algolia-info
85 | div
86 | display: inline
87 |
88 | .algolia-poweredBy
89 | float: right
90 | vertical-align: text-top
91 |
92 | svg
93 | height: 1.1em
--------------------------------------------------------------------------------
/source/css/_search/index.styl:
--------------------------------------------------------------------------------
1 | .search-dialog
2 | position: fixed
3 | top: 10%
4 | left: 50%
5 | z-index: 1001
6 | display: none
7 | margin-left: -300px
8 | padding: 20px
9 | width: 600px
10 | background: var(--search-bg)
11 | --search-height: 100vh
12 | addBorderRadius(8)
13 |
14 | +maxWidth768()
15 | top: 0
16 | left: 0
17 | margin: 0
18 | width: 100%
19 | height: 100%
20 | border-radius: 0
21 |
22 | .search-nav
23 | margin: 0 0 14px
24 | color: $search-color
25 | font-size: 1.4em
26 | line-height: 1
27 |
28 | .search-dialog-title
29 | margin-right: 10px
30 |
31 | .search-close-button
32 | float: right
33 | color: $grey
34 | transition: color .2s ease-in-out
35 |
36 | &:hover
37 | color: $search-color
38 |
39 | hr
40 | margin: 15px auto
41 | @extend .custom-hr
42 |
43 | #search-mask
44 | position: fixed
45 | top: 0
46 | right: 0
47 | bottom: 0
48 | left: 0
49 | z-index: 1000
50 | display: none
51 | background: rgba($dark-black, .6)
52 |
53 | if hexo-config('search.use') == 'algolia_search'
54 | @require 'algolia'
55 | else if hexo-config('search.use') == 'local_search'
56 | @require 'local-search'
--------------------------------------------------------------------------------
/source/css/_search/local-search.styl:
--------------------------------------------------------------------------------
1 | #local-search
2 | .search-dialog
3 | .local-search-box
4 | margin: 0 auto
5 | max-width: 100%
6 | width: 100%
7 |
8 | input
9 | padding: 5px 14px
10 | width: 100%
11 | outline: none
12 | border: 2px solid $search-color
13 | border-radius: 40px
14 | background: var(--search-bg)
15 | color: var(--search-input-color)
16 | -webkit-appearance: none
17 |
18 | .search-wrap
19 | display: none
20 |
21 | .local-search-hit-item
22 | margin-left: 24px
23 | padding-left: 3px
24 | line-height: 1.8
25 |
26 | &::marker
27 | color: $search-color
28 | font-weight: bold
29 | font-style: italic
30 |
31 | a
32 | color: var(--search-a-color)
33 |
34 | &:hover
35 | color: $search-color
36 |
37 | .search-result-title
38 | font-weight: 600
39 |
40 | .search-result
41 | margin: 0 0 8px
42 | word-break: break-all
43 | font-size: .9em
44 |
45 | .search-result-list
46 | overflow-y: overlay
47 | margin: 0 -20px
48 | padding: 0 22px
49 | max-height: calc(80vh - 180px)
50 |
51 | +maxWidth768()
52 | max-height: calc(var(--search-height) - 190px) !important
53 |
54 | .search-keyword
55 | background: transparent
56 | color: $search-keyword-highlight
57 | font-weight: 600
--------------------------------------------------------------------------------
/source/css/_tags/button.styl:
--------------------------------------------------------------------------------
1 | .container
2 | .btn-center
3 | margin: 0 0 20px
4 | text-align: center
5 |
6 | .btn-beautify
7 | display: inline-block
8 | margin: 0 4px 6px
9 | padding: 0 15px
10 | background-color: var(--btn-beautify-color, $btn-default-color)
11 | color: $btn-color
12 | line-height: 2
13 | addBorderRadius()
14 |
15 | for $type in $color-types
16 | &.{$type}
17 | --btn-beautify-color: lookup('$tagsP-' + $type + '-color')
18 |
19 | &:hover
20 | background-color: var(--btn-hover-color)
21 |
22 | i + span
23 | margin-left: 6px
24 |
25 | &:not(.block) + .btn-beautify:not(.block)
26 | margin: 0 4px 20px
27 |
28 | &.block
29 | display: block
30 | margin: 0 0 20px
31 | width: fit-content
32 | width: -moz-fit-content
33 |
34 | &.center
35 | margin: 0 auto 20px
36 |
37 | &.right
38 | margin: 0 0 20px auto
39 |
40 | &.larger
41 | padding: 6px 15px
42 |
43 | &:hover
44 | text-decoration: none
45 |
46 | &.outline
47 | border: 1px solid transparent
48 | border-color: var(--btn-beautify-color, $btn-default-color)
49 | background-color: transparent
50 | color: var(--btn-beautify-color, $btn-default-color)
51 |
52 | &:hover
53 | background-color: var(--btn-beautify-color, $btn-default-color)
54 |
55 | &:hover
56 | color: white !important
57 |
--------------------------------------------------------------------------------
/source/css/_tags/hexo.styl:
--------------------------------------------------------------------------------
1 | // pullquote
2 | blockquote
3 | &.pullquote
4 | position: relative
5 | max-width: 45%
6 | font-size: 110%
7 |
8 | &.left
9 | float: left
10 | margin: 1em .5em 0 0
11 |
12 | &.right
13 | float: right
14 | margin: 1em 0 0 .5em
15 |
16 | // hexo tag video
17 | .video-container
18 | position: relative
19 | overflow: hidden
20 | margin-bottom: 16px
21 | padding-top: 56.25%
22 | height: 0
23 |
24 | iframe
25 | position: absolute
26 | top: 0
27 | left: 0
28 | margin-top: 0
29 | width: 100%
30 | height: 100%
31 |
--------------------------------------------------------------------------------
/source/css/_tags/hide.styl:
--------------------------------------------------------------------------------
1 | // tag-hide
2 | .hide-inline,
3 | .hide-block
4 | & > .hide-button
5 | display: inline-block
6 | padding: 5px 18px
7 | background: $tag-hide-bg
8 | color: var(--white)
9 | addBorderRadius()
10 |
11 | &:hover
12 | background-color: var(--btn-hover-color)
13 |
14 | &.open
15 | display: none
16 |
17 | & + div
18 | display: block
19 |
20 | & + span
21 | display: inline
22 |
23 | & > .hide-content
24 | display: none
25 |
26 | .hide-inline
27 | & > .hide-button
28 | margin: 0 6px
29 |
30 | & > .hide-content
31 | margin: 0 6px
32 |
33 | .hide-block
34 | margin: 0 0 16px
35 |
36 | .toggle
37 | margin-bottom: 20px
38 | border: 1px solid $tag-hide-toggle-bg
39 | addBorderRadius(5, true)
40 |
41 | & > .toggle-button
42 | padding: 6px 15px
43 | background: $tag-hide-toggle-bg
44 | color: #1F2D3D
45 | cursor: pointer
46 |
47 | & > .toggle-content
48 | margin: 30px 24px
49 |
--------------------------------------------------------------------------------
/source/css/_tags/inlineImg.styl:
--------------------------------------------------------------------------------
1 | .container
2 | .inline-img
3 | display: inline
4 | margin: 0 3px
5 | height: 1.1em
6 | vertical-align: text-bottom
--------------------------------------------------------------------------------
/source/css/_tags/label.styl:
--------------------------------------------------------------------------------
1 | .hl-label
2 | padding: 2px 4px
3 | color: $btn-color
4 | addBorderRadius(3)
5 |
6 | &.default
7 | background-color: $btn-default-color
8 |
9 | for $type in $color-types
10 | &.{$type}
11 | background-color: lookup('$tagsP-' + $type + '-color')
12 |
--------------------------------------------------------------------------------
/source/css/_tags/series.styl:
--------------------------------------------------------------------------------
1 | .container
2 | .series-items
3 | a
4 | &:hover
5 | color: var(--pseudo-hover)
--------------------------------------------------------------------------------
/source/css/_tags/tabs.styl:
--------------------------------------------------------------------------------
1 |
2 | .container
3 | .tabs
4 | position: relative
5 | margin: 0 0 20px
6 | border-right: 1px solid var(--tab-border-color)
7 | border-bottom: 1px solid var(--tab-border-color)
8 | border-left: 1px solid var(--tab-border-color)
9 | addBorderRadius()
10 | overflow: hidden
11 |
12 | > .nav-tabs
13 | display: flex
14 | flex-wrap: wrap
15 | margin: 0
16 | padding: 0
17 | background: var(--tab-button-bg)
18 |
19 | > .tab
20 | flex-grow: 1
21 | padding: 8px 18px
22 | border-top: 2px solid var(--tab-border-color)
23 | background: var(--tab-button-bg)
24 | color: var(--tab-button-color)
25 | line-height: 2
26 | transition: all .4s
27 |
28 | i
29 | width: 1.5em
30 |
31 | &.active
32 | border-top: 2px solid $tab-active-border-color
33 | background: var(--tab-button-active-bg)
34 | cursor: default
35 |
36 | &:not(.active)
37 | &:hover
38 | border-top: 2px solid var(--tab-button-hover-bg)
39 | background: var(--tab-button-hover-bg)
40 |
41 | &.no-default
42 | & ~ .tab-to-top
43 | display: none
44 |
45 | > .tab-contents
46 | .tab-item-content
47 | position: relative
48 | display: none
49 | padding: 36px 24px 10px
50 |
51 | +maxWidth768()
52 | padding: 24px 14px
53 |
54 | &.active
55 | display: block
56 | animation: tabshow .5s
57 |
58 | > :last-child
59 | margin-bottom: 0
60 |
61 | > .tab-to-top
62 | padding: 0 16px 10px 0
63 | width: 100%
64 | text-align: right
65 |
66 | button
67 | color: $tab-to-top-color
68 |
69 | &:hover
70 | color: $tab-to-top-hover-color
71 |
72 | @keyframes tabshow
73 | 0%
74 | transform: translateY(15px)
75 |
76 | 100%
77 | transform: translateY(0)
78 |
--------------------------------------------------------------------------------
/source/css/_tags/timeline.styl:
--------------------------------------------------------------------------------
1 | .container
2 | .timeline
3 | margin: 0 10px 20px
4 | padding: 14px 0 5px 20px
5 | border-left: 2px solid var(--timeline-color, $theme-color)
6 |
7 | for $type in $color-types
8 | &.{$type}
9 | --timeline-color: lookup('$tagsP-' + $type + '-color')
10 | --timeline-bg: s('rgba(%s,%s,%s, 0.2)', red(lookup('$tagsP-' + $type + '-color')), green(lookup('$tagsP-' + $type + '-color')), blue(lookup('$tagsP-' + $type + '-color')))
11 |
12 | .timeline-item
13 | margin: 0 0 15px
14 |
15 | &:hover
16 | .item-circle
17 | &:before
18 | border-color: var(--timeline-color, $theme-color)
19 |
20 | &.headline
21 | .timeline-item-title
22 | .item-circle
23 | > p
24 | font-weight: 600
25 | font-size: 1.2em
26 |
27 | &:before
28 | left: -28px
29 | border: 4px solid var(--timeline-color, $theme-color)
30 |
31 | &:hover
32 | .item-circle
33 | &:before
34 | border-color: var(--pseudo-hover)
35 |
36 | .timeline-item-title
37 | position: relative
38 |
39 | .item-circle
40 | &:before
41 | position: absolute
42 | top: 50%
43 | left: -27px
44 | width: 6px
45 | height: 6px
46 | border: 3px solid var(--pseudo-hover)
47 | border-radius: 50%
48 | background: var(--card-bg)
49 | content: ''
50 | transition: all .3s
51 | transform: translate(0, -50%)
52 |
53 | > p
54 | margin: 0 0 8px
55 | font-weight: 500
56 |
57 | .timeline-item-content
58 | position: relative
59 | padding: 12px 15px
60 | border-radius: 8px
61 | background: var(--timeline-bg, lighten($theme-color, 85%))
62 | font-size: .93em
63 |
64 | & > :last-child
65 | margin-bottom: 0
66 |
67 | & + .timeline
68 | margin-top: -20px
--------------------------------------------------------------------------------
/source/css/index.styl:
--------------------------------------------------------------------------------
1 | if hexo-config('css_prefix')
2 | @import 'nib'
3 |
4 | @import '_third-party/normalize.min.css'
5 | // project
6 | @import 'var'
7 | @import '_global/*'
8 | @import '_highlight/highlight'
9 | @import '_page/*'
10 | @import '_layout/*'
11 | @import '_tags/*'
12 | @import '_mode/*'
13 |
14 | // search
15 | @import '_search/index'
--------------------------------------------------------------------------------
/source/img/404.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jerryc127/hexo-theme-butterfly/73de62a6e1c5cb7b633d07bdeb9921a8740e2d64/source/img/404.jpg
--------------------------------------------------------------------------------
/source/img/butterfly-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jerryc127/hexo-theme-butterfly/73de62a6e1c5cb7b633d07bdeb9921a8740e2d64/source/img/butterfly-icon.png
--------------------------------------------------------------------------------
/source/img/error-page.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jerryc127/hexo-theme-butterfly/73de62a6e1c5cb7b633d07bdeb9921a8740e2d64/source/img/error-page.png
--------------------------------------------------------------------------------
/source/img/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jerryc127/hexo-theme-butterfly/73de62a6e1c5cb7b633d07bdeb9921a8740e2d64/source/img/favicon.ico
--------------------------------------------------------------------------------
/source/img/friend_404.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jerryc127/hexo-theme-butterfly/73de62a6e1c5cb7b633d07bdeb9921a8740e2d64/source/img/friend_404.gif
--------------------------------------------------------------------------------