diff --git a/README.MD b/README.MD index 2aa415e..8c1ce70 100644 --- a/README.MD +++ b/README.MD @@ -8,7 +8,7 @@ npm GitHub stars - +

@@ -16,7 +16,7 @@ -[文档 (github源)](https://xugaoyi.github.io/vuepress-theme-vdoing-doc/) | [文档 (国内源)](https://doc.xugaoyi.com/vuepress-theme-vdoing-doc/) | [效果:Evan's blog](https://xugaoyi.com/) +[文档 (github源)](https://xugaoyi.github.io/vuepress-theme-vdoing-doc/) | [文档 (国内源)](https://doc.xugaoyi.com/vuepress-theme-vdoing-doc/) | [效果:Evan's blog](https://xugaoyi.com/) ## 介绍 1. 这个主题的初衷是打造一个好用的、面向程序员的`知识管理工具` @@ -57,8 +57,7 @@ npm run dev # or yarn dev ## :sparkling_heart:支持这个项目 -我尽己所能地进行开源,并且我尽量回复每个在使用项目时需要帮助的人。很明显,这需要时间,但你可以免费享受这些。 -然而, 如果你正在使用这个项目并感觉良好,或只是想要支持我继续开发,你可以通过如下方式支持我: +如果你正在使用这个项目并感觉良好,或只是想要支持我继续开发,你可以通过如下任意方式支持我: - **Star** 并 分享这个项目 :rocket: - 保留主题 footer(页脚) 的主题链接 :D diff --git a/docs/.vuepress/config.js b/docs/.vuepress/config.js index 14c58e8..f4e85a0 100644 --- a/docs/.vuepress/config.js +++ b/docs/.vuepress/config.js @@ -174,7 +174,7 @@ module.exports = { options: { clientID: 'a6e1355287947096b88b', clientSecret: 'f0e77d070fabfcd5af95bebb82b2d574d7248d71', - repo: 'vuepress-theme-vdoing', // GitHub 仓库 + repo: 'blog-gitalk-comment', // GitHub 仓库 owner: 'xugaoyi', // GitHub仓库所有者 admin: ['xugaoyi'], // 对仓库有写权限的人 // distractionFreeMode: true, diff --git a/docs/05.关于/01.关于.md b/docs/05.关于/01.关于.md index bacb52d..63b5bb4 100644 --- a/docs/05.关于/01.关于.md +++ b/docs/05.关于/01.关于.md @@ -23,7 +23,8 @@ article: false ### 🐼Me -落魄Web前端工程师 +web前端小学生 + #### 技能 * 熟悉 JavaScript、HTML、CSS、Vue 的拼写 * 了解 Linux、windows、macOS 的开关机方式 @@ -39,7 +40,8 @@ article: false - **WeChat or QQ**: 894072666 - **Email**: 894072666@qq.com - **GitHub**: -- **Vdoing官方交流QQ群**:694387113 +- **Vdoing主题文档:** +- **Vdoing交流QQ群**:694387113 diff --git a/theme-vdoing/components/Catalogue.vue b/theme-vdoing/components/Catalogue.vue index 5621f2d..929a6ae 100644 --- a/theme-vdoing/components/Catalogue.vue +++ b/theme-vdoing/components/Catalogue.vue @@ -4,27 +4,45 @@
{{pageData.title}}
-
+
-
+
目录
@@ -34,16 +52,14 @@ diff --git a/theme-vdoing/components/CategoriesBar.vue b/theme-vdoing/components/CategoriesBar.vue index a062062..7e5c548 100644 --- a/theme-vdoing/components/CategoriesBar.vue +++ b/theme-vdoing/components/CategoriesBar.vue @@ -1,12 +1,14 @@ @@ -38,7 +42,7 @@ export default { } }, computed: { - categories() { + categories () { if (this.length === 'all') { return this.categoriesData } else { @@ -50,54 +54,53 @@ export default { diff --git a/theme-vdoing/components/CategoriesPage.vue b/theme-vdoing/components/CategoriesPage.vue index b84fa8c..b952291 100644 --- a/theme-vdoing/components/CategoriesPage.vue +++ b/theme-vdoing/components/CategoriesPage.vue @@ -38,7 +38,7 @@ import Pagination from '@theme/components/Pagination' import CategoriesBar from '@theme/components/CategoriesBar' export default { - data(){ + data () { return { category: '', total: 0, // 总长 @@ -47,7 +47,7 @@ export default { } }, components: { MainLayout, PostList, Pagination, CategoriesBar }, - mounted() { + mounted () { const queryCategory = this.$route.query.category if (queryCategory) { this.category = queryCategory @@ -70,12 +70,12 @@ export default { } }, methods: { - handlePagination(i) { // 分页 + handlePagination (i) { // 分页 this.currentPage = i } }, watch: { - '$route.query.category'() { + '$route.query.category' () { this.category = this.$route.query.category if (this.category) { this.total = this.$groupPosts.categories[this.category].length @@ -91,41 +91,40 @@ export default { diff --git a/theme-vdoing/components/Footer.vue b/theme-vdoing/components/Footer.vue index c99e959..9935fc1 100644 --- a/theme-vdoing/components/Footer.vue +++ b/theme-vdoing/components/Footer.vue @@ -1,6 +1,9 @@ @@ -24,10 +33,10 @@ diff --git a/theme-vdoing/components/Sidebar.vue b/theme-vdoing/components/Sidebar.vue index 73092c0..a7c69ff 100644 --- a/theme-vdoing/components/Sidebar.vue +++ b/theme-vdoing/components/Sidebar.vue @@ -1,11 +1,17 @@ @@ -38,9 +44,9 @@ export default { components: { SidebarLinks, NavLinks }, props: ['items'], - + computed: { - blogger() { + blogger () { return this.$themeConfig.blogger } } @@ -73,7 +79,7 @@ export default { line-height 1.7 font-weight bold & > li:not(:first-child) - margin-top .75rem + margin-top 0.75rem .blogger display none border-bottom 1px solid var(--borderColor) @@ -81,17 +87,17 @@ export default { width 60px height 60px border-radius 5px - margin .75rem 1rem + margin 0.75rem 1rem .blogger-info flex 1 h3 - margin .95rem 0 .7rem + margin 0.95rem 0 0.7rem font-size 1.1rem .icons .iconfont font-size 1.2rem - padding-right .6rem + padding-right 0.6rem color #777 -@media (max-width: $MQMobile) +@media (max-width $MQMobile) .sidebar .blogger display flex diff --git a/theme-vdoing/components/SidebarButton.vue b/theme-vdoing/components/SidebarButton.vue index 0b64744..e4c3fbe 100644 --- a/theme-vdoing/components/SidebarButton.vue +++ b/theme-vdoing/components/SidebarButton.vue @@ -1,7 +1,21 @@ @@ -16,14 +30,13 @@ padding 0.6rem top 0.6rem left 1rem - @media (max-width: $MQMobile) + @media (max-width $MQMobile) display block .icon display block width 1.25rem height 1.25rem - -@media (min-width: ($MQMobile + 1px)) +@media (min-width ($MQMobile + 1px)) $mobileSidebarWidth = $sidebarWidth * 0.82 .sidebar-button width 40px @@ -38,7 +51,7 @@ color #888 border-radius 50% padding 0 - transition left .2s ease + transition left 0.2s ease &:hover background $accentColor color #fff diff --git a/theme-vdoing/components/SidebarGroup.vue b/theme-vdoing/components/SidebarGroup.vue index c0cef48..5f2b0a4 100644 --- a/theme-vdoing/components/SidebarGroup.vue +++ b/theme-vdoing/components/SidebarGroup.vue @@ -23,8 +23,8 @@ - + :class="open ? 'down' : 'right'" + >

- + :class="open ? 'down' : 'right'" + >

@@ -90,15 +90,14 @@ export default { & > .sidebar-group-items padding-left 1rem & > li > .sidebar-link - font-size: 0.95em; + font-size 0.95em border-left none &.depth-2 & > .sidebar-heading border-left none - .sidebar-heading color var(--textColor) - transition color .15s ease + transition color 0.15s ease cursor pointer font-size 1.1em font-weight bold @@ -121,9 +120,8 @@ export default { border-left-color $accentColor &:hover color $accentColor - .sidebar-group-items - transition height .1s ease-out + transition height 0.1s ease-out font-size 0.95em overflow hidden diff --git a/theme-vdoing/components/SidebarLink.vue b/theme-vdoing/components/SidebarLink.vue index a0b9ac0..adbdad7 100644 --- a/theme-vdoing/components/SidebarLink.vue +++ b/theme-vdoing/components/SidebarLink.vue @@ -97,7 +97,6 @@ function renderExternal (h, to, text) { .sidebar .sidebar-sub-headers padding-left 1rem font-size 0.95em - a.sidebar-link font-size 1em font-weight 400 @@ -106,8 +105,8 @@ a.sidebar-link border-left 0.25rem solid transparent padding 0.35rem 1rem 0.35rem 1.25rem line-height 1.4 - width: 100% - box-sizing: border-box + width 100% + box-sizing border-box &:hover color $accentColor &.active diff --git a/theme-vdoing/components/SidebarLinks.vue b/theme-vdoing/components/SidebarLinks.vue index d6b5ff7..bf7fef2 100644 --- a/theme-vdoing/components/SidebarLinks.vue +++ b/theme-vdoing/components/SidebarLinks.vue @@ -3,7 +3,10 @@ class="sidebar-links" v-if="items.length" > -
  • +
  • - - {{ length === 'all' ? '全部标签' : '热门标签' }} - + {{ length === 'all' ? '全部标签' : '热门标签' }}
    - @@ -38,19 +39,19 @@ export default { default: 'all' } }, - data() { + data () { return { tagBgColor: ['#11a8cd', '#F8B26A', '#67CC86', '#E15B64', '#F47E60', '#849B87'], tagStyleList: [] } }, - created() { + created () { for (let i = 0, tagH = this.tags.length; i < tagH; i++) { this.tagStyleList.push(this.getTagStyle()) } }, computed: { - tags() { + tags () { if (this.length === 'all') { return this.tagsData } else { @@ -59,7 +60,7 @@ export default { } }, methods: { - getTagStyle() { + getTagStyle () { const tagBgColor = this.tagBgColor const randomColor = tagBgColor[Math.floor(Math.random() * tagBgColor.length)] return `background: ${randomColor};--randomColor:${randomColor};` @@ -69,36 +70,36 @@ export default { - diff --git a/theme-vdoing/components/Timeline(弃用).vue b/theme-vdoing/components/Timeline(弃用).vue deleted file mode 100644 index 90ff257..0000000 --- a/theme-vdoing/components/Timeline(弃用).vue +++ /dev/null @@ -1,226 +0,0 @@ - - - - - diff --git a/theme-vdoing/components/UpdateArticle.vue b/theme-vdoing/components/UpdateArticle.vue index b0433f1..64b6907 100644 --- a/theme-vdoing/components/UpdateArticle.vue +++ b/theme-vdoing/components/UpdateArticle.vue @@ -1,25 +1,35 @@ @@ -34,19 +44,19 @@ export default { }, moreArticle: String }, - data() { + data () { return { posts: [], currentPath: '' } }, - created() { + created () { this.posts = this.$site.pages this.currentPath = this.$page.path }, computed: { - topPublishPosts() { - return this.$sortPostsByDate ? this.$sortPostsByDate.filter( post => { + topPublishPosts () { + return this.$sortPostsByDate ? this.$sortPostsByDate.filter(post => { const { path } = post return path !== this.currentPath }).slice(0, this.length) : [] @@ -58,15 +68,15 @@ export default { } }, methods: { - getNum(index) { + getNum (index) { return index < 9 ? '0' + (index + 1) : index + 1 }, - getDate(item) { - return item.frontmatter.date ? item.frontmatter.date.split(" ")[0].slice(5,10) : '' + getDate (item) { + return item.frontmatter.date ? item.frontmatter.date.split(" ")[0].slice(5, 10) : '' } }, watch: { - $route() { + $route () { this.currentPath = this.$page.path } } @@ -74,68 +84,68 @@ export default { diff --git a/theme-vdoing/enhanceApp.js b/theme-vdoing/enhanceApp.js index 2c5a333..d9db394 100644 --- a/theme-vdoing/enhanceApp.js +++ b/theme-vdoing/enhanceApp.js @@ -9,7 +9,7 @@ export default ({ // 修复ISO8601时间格式为普通时间格式,以及添加作者信息 siteData.pages.map(item => { const { frontmatter: { date, author } } = item - if (typeof date === 'string' && date.charAt(date.length-1) === 'Z') { + if (typeof date === 'string' && date.charAt(date.length - 1) === 'Z') { item.frontmatter.date = repairUTCDate(date) } if (author) { @@ -26,14 +26,14 @@ export default ({ } - // 修复ISO8601时间格式为普通时间格式 -function repairUTCDate(date) { +// 修复ISO8601时间格式为普通时间格式 +function repairUTCDate (date) { if (!(date instanceof Date)) { date = new Date(date) } - return `${date.getUTCFullYear()}-${zero(date.getUTCMonth()+1)}-${zero(date.getUTCDate())} ${zero(date.getUTCHours())}:${zero(date.getUTCMinutes())}:${zero(date.getUTCSeconds())}`; + return `${date.getUTCFullYear()}-${zero(date.getUTCMonth() + 1)}-${zero(date.getUTCDate())} ${zero(date.getUTCHours())}:${zero(date.getUTCMinutes())}:${zero(date.getUTCSeconds())}`; } // 小于10补0 -function zero(d){ - return d.toString().padStart(2,'0') -} \ No newline at end of file +function zero (d) { + return d.toString().padStart(2, '0') +} diff --git a/theme-vdoing/global-components/Badge.vue b/theme-vdoing/global-components/Badge.vue index 8255293..c89600d 100644 --- a/theme-vdoing/global-components/Badge.vue +++ b/theme-vdoing/global-components/Badge.vue @@ -36,7 +36,7 @@ export default { &.tip, &.green background-color #42b983 &.error - background-color #DA5961 //#f66 + background-color #DA5961 // #f66 &.warning, &.warn, &.yellow background-color darken(#ffe564, 35%) & + & diff --git a/theme-vdoing/index.js b/theme-vdoing/index.js index 1c4f8d1..fa2413c 100644 --- a/theme-vdoing/index.js +++ b/theme-vdoing/index.js @@ -1,28 +1,28 @@ const path = require('path') const setFrontmatter = require('./node_utils/setFrontmatter') const getSidebarData = require('./node_utils/getSidebarData') -const {createPage, deletePage} = require('./node_utils/handlePage') +const { createPage, deletePage } = require('./node_utils/handlePage') const chalk = require('chalk') // 命令行打印美化 const yaml = require('js-yaml') // yaml转js const log = console.log // md容器名 const CARD_LIST = 'cardList' -const CARD_IMG_LIST = 'cardImgList' +const CARD_IMG_LIST = 'cardImgList' // Theme API. module.exports = (options, ctx) => { const { sourceDir, themeConfig, siteConfig } = ctx - + // 自动设置front matter setFrontmatter(sourceDir, themeConfig) // 自动生成结构化侧边栏 const sidebar = themeConfig.sidebar - if(sidebar === 'structuring' || sidebar && sidebar.mode === 'structuring') { + if (sidebar === 'structuring' || sidebar && sidebar.mode === 'structuring') { const collapsable = themeConfig.sidebar.collapsable === false ? false : true const sidebarData = getSidebarData(sourceDir, collapsable) - if(sidebarData) { + if (sidebarData) { themeConfig.sidebar = sidebarData log(chalk.blue('tip ') + chalk.green('add sidebar data. 侧边栏数据成功生成。')) } else { @@ -44,7 +44,7 @@ module.exports = (options, ctx) => { } else { deletePage(sourceDir, 'tagsPage') } - + // 归档页 if (themeConfig.archive !== false) { createPage(sourceDir, 'archivesPage') @@ -56,8 +56,8 @@ module.exports = (options, ctx) => { const isAlgoliaSearch = ( themeConfig.algolia || Object - .keys(siteConfig.locales && themeConfig.locales || {}) - .some(base => themeConfig.locales[base].algolia) + .keys(siteConfig.locales && themeConfig.locales || {}) + .some(base => themeConfig.locales[base].algolia) ) const enableSmoothScroll = themeConfig.smoothScroll === true @@ -77,6 +77,13 @@ module.exports = (options, ctx) => { '@vuepress/plugin-nprogress', ['smooth-scroll', enableSmoothScroll], + ['container', { + type: 'note', + defaultTitle: { + '/': '笔记', + '/en/': 'NOTE' + } + }], ['container', { type: 'tip', defaultTitle: { @@ -129,7 +136,7 @@ module.exports = (options, ctx) => { 'container', { type: CARD_LIST, - render: (tokens, idx) => { + render: (tokens, idx) => { // tokens 是整个md文件的虚拟dom结构数组 // idx 是tokens中':::' 所在的索引,而且是当前指定type的':::',分别有开始和结束两次的idx // if (tokens[idx].nesting === 1) { // 开头的 ':::' 标记 @@ -146,33 +153,33 @@ module.exports = (options, ctx) => { 'container', { type: CARD_IMG_LIST, - render: (tokens, idx) => { + render: (tokens, idx) => { return renderCardList(tokens, idx, CARD_IMG_LIST) } }, ], - + ] } } // 渲染md容器的卡片列表 -function renderCardList(tokens, idx, type) { +function renderCardList (tokens, idx, type) { const END_TYPE = `container_${type}_close`, - _tokens$idx = tokens[idx], - nesting = _tokens$idx.nesting, - info = _tokens$idx.info; + _tokens$idx = tokens[idx], + nesting = _tokens$idx.nesting, + info = _tokens$idx.info; if (nesting === 1) { // 渲染开头的 ':::' 标记 let yamlStr = ''; for (let i = idx; i < tokens.length; i++) { let _tokens$i = tokens[i], - type = _tokens$i.type, - content = _tokens$i.content, - _info = _tokens$i.info; + type = _tokens$i.type, + content = _tokens$i.content, + _info = _tokens$i.info; if (type === END_TYPE) break; // 遇到结束的 ':::' 时 if (!content) continue; if (type === 'fence' && _info === 'yaml') { // 是代码块类型,并且是yaml代码 @@ -188,7 +195,7 @@ function renderCardList(tokens, idx, type) { dataList = Array.isArray(dataObj) ? dataObj : dataObj.list } - if (dataList && dataList.length) { // 有列表数据 + if (dataList && dataList.length) { // 有列表数据 // 每行显示几个 let row = Number(info.split(' ').pop()) @@ -198,12 +205,12 @@ function renderCardList(tokens, idx, type) { let listDOM = '' if (type === CARD_LIST) { // 普通卡片列表 - listDOM = getCardListDOM(dataList, row) + listDOM = getCardListDOM(dataList, row) } else if (type === CARD_IMG_LIST) { // 卡片图片列表 - listDOM = getCardImgListDOM(dataList, row) + listDOM = getCardImgListDOM(dataList, row) } - - return `
    ${ listDOM }
    ` + + return `
    ${listDOM}
    ` } } } else { // 渲染':::' 结尾 @@ -213,14 +220,14 @@ function renderCardList(tokens, idx, type) { // 将数据解析成DOM结构 - 普通卡片列表 -function getCardListDOM(dataList, row) { +function getCardListDOM (dataList, row) { let listDOM = '' dataList.forEach(item => { listDOM += ` - <${item.link ? 'a href="' + item.link +'" target="_blank"' : 'span' } class="card-item ${ row ? 'row-' + row : '' }" - style="${ item.bgColor ? 'background-color:' + item.bgColor + ';--randomColor:'+ item.bgColor +';': '--randomColor: var(--bodyBg);' }${ item.textColor ? 'color:' + item.textColor + ';': '' }" + <${item.link ? 'a href="' + item.link + '" target="_blank"' : 'span'} class="card-item ${row ? 'row-' + row : ''}" + style="${item.bgColor ? 'background-color:' + item.bgColor + ';--randomColor:' + item.bgColor + ';' : '--randomColor: var(--bodyBg);'}${item.textColor ? 'color:' + item.textColor + ';' : ''}" > - ${ item.avatar ? '' : '' } + ${item.avatar ? '' : ''}

    ${item.name}

    ${item.desc}

    @@ -233,34 +240,27 @@ function getCardListDOM(dataList, row) { // 将数据解析成DOM结构 - 图文卡片列表 -function getCardImgListDOM(dataList, row) { +function getCardImgListDOM (dataList, row) { let listDOM = '' dataList.forEach(item => { listDOM += ` -
    -
    - - - -
    - - - ${item.avatar || item.author - ? `` - : '' - } + ` }) return listDOM -} \ No newline at end of file +} diff --git a/theme-vdoing/layouts/Layout.vue b/theme-vdoing/layouts/Layout.vue index 4af3bff..2aa05f8 100644 --- a/theme-vdoing/layouts/Layout.vue +++ b/theme-vdoing/layouts/Layout.vue @@ -29,18 +29,18 @@ #bottom /> - + - + - + - + - + - @@ -97,10 +97,10 @@ export default { themeMode: 'light' } }, - beforeMount(){ + beforeMount () { // 引入图标库 const social = this.$themeConfig.social - if(social && social.iconfontCssFile ) { + if (social && social.iconfontCssFile) { let linkElm = document.createElement("link") linkElm.setAttribute('rel', 'stylesheet'); linkElm.setAttribute("type", "text/css") @@ -109,7 +109,7 @@ export default { } }, computed: { - showRightMenu() { + showRightMenu () { const { headers } = this.$page return ( !this.$frontmatter.home @@ -169,16 +169,16 @@ export default { ] } }, - created() { + created () { const sidebarOpen = this.$themeConfig.sidebarOpen if (sidebarOpen === false) { - this.isSidebarOpen = sidebarOpen + this.isSidebarOpen = sidebarOpen } }, - beforeMount() { + beforeMount () { this.isSidebarOpenOfclientWidth() const mode = storage.get('mode') // 不放在created是因为vuepress不能在created访问浏览器api,如window - if(!mode || mode === 'auto') { // 当未切换过模式,或模式处于'跟随系统'时 + if (!mode || mode === 'auto') { // 当未切换过模式,或模式处于'跟随系统'时 this._autoMode() } else { this.themeMode = mode @@ -196,7 +196,7 @@ export default { } // 解决移动端初始化页面时侧边栏闪现的问题 - this.showSidebar = true + this.showSidebar = true this.$router.afterEach(() => { this.isSidebarOpenOfclientWidth() }) @@ -204,30 +204,30 @@ export default { // 向下滚动收起导航栏 let p = 0, t = 0; window.addEventListener('scroll', _.throttle(() => { - if(!this.isSidebarOpen) { // 侧边栏关闭时 + if (!this.isSidebarOpen) { // 侧边栏关闭时 p = this.getScrollTop() - if(t < p && p > NAVBAR_HEIGHT) { // 向下滚动 + if (t < p && p > NAVBAR_HEIGHT) { // 向下滚动 this.hideNavbar = true } else { // 向上 this.hideNavbar = false } - setTimeout(() => {t = p},0) + setTimeout(() => { t = p }, 0) } }, 300)) }, watch: { - isSidebarOpen() { - if(this.isSidebarOpen) { // 侧边栏打开时,恢复导航栏显示 + isSidebarOpen () { + if (this.isSidebarOpen) { // 侧边栏打开时,恢复导航栏显示 this.hideNavbar = false } }, - themeMode() { + themeMode () { this.setBodyClass() } }, methods: { - setBodyClass() { + setBodyClass () { document.body.className = 'theme-mode-' + this.themeMode }, getScrollTop () { @@ -235,7 +235,7 @@ export default { || document.documentElement.scrollTop || document.body.scrollTop || 0 }, - isSidebarOpenOfclientWidth() { + isSidebarOpenOfclientWidth () { if (document.documentElement.clientWidth < MOBILE_DESKTOP_BREAKPOINT) { this.isSidebarOpen = false } @@ -245,21 +245,21 @@ export default { this.$emit('toggle-sidebar', this.isSidebarOpen) }, _autoMode () { - if(window.matchMedia('(prefers-color-scheme: dark)').matches){ // 系统处于深色模式 + if (window.matchMedia('(prefers-color-scheme: dark)').matches) { // 系统处于深色模式 this.themeMode = 'dark' } else { this.themeMode = 'light' } }, toggleThemeMode (key) { - if(key === 'auto') { + if (key === 'auto') { this._autoMode() } else { this.themeMode = key } storage.set('mode', key) }, - + // side swipe onTouchStart (e) { this.touchStart = { diff --git a/theme-vdoing/mixins/encodeUrl.js b/theme-vdoing/mixins/encodeUrl.js deleted file mode 100644 index 0459270..0000000 --- a/theme-vdoing/mixins/encodeUrl.js +++ /dev/null @@ -1,9 +0,0 @@ -export default { - methods: { - encodeUrl(str) { - str = str + '' - str = str.replace(/ |((?=[\x21-\x7e]+)[^A-Za-z0-9])/g, '-') - return str - }, - } -} \ No newline at end of file diff --git a/theme-vdoing/mixins/posts.js b/theme-vdoing/mixins/posts.js index 2e6fa76..2dec307 100644 --- a/theme-vdoing/mixins/posts.js +++ b/theme-vdoing/mixins/posts.js @@ -2,20 +2,20 @@ import { filterPosts, sortPosts, sortPostsByDate, groupPosts, categoriesAndTags export default { computed: { - $filterPosts() { // 过滤非文章页和首页的文章数据 + $filterPosts () { // 过滤非文章页和首页的文章数据 return filterPosts(this.$site.pages) }, - $sortPosts() { // 按置顶和时间排序的文章数据 + $sortPosts () { // 按置顶和时间排序的文章数据 return sortPosts(this.$filterPosts) }, - $sortPostsByDate() { // 仅按时间排序的文章数据 + $sortPostsByDate () { // 仅按时间排序的文章数据 return sortPostsByDate(this.$filterPosts) }, - $groupPosts() { // 按分类和标签分组的文章数据 + $groupPosts () { // 按分类和标签分组的文章数据 return groupPosts(this.$sortPosts) }, - $categoriesAndTags() { // 所有分类和标签数据 + $categoriesAndTags () { // 所有分类和标签数据 return categoriesAndTags(this.$groupPosts) } } -} \ No newline at end of file +} diff --git a/theme-vdoing/mixins/titleBadge.js b/theme-vdoing/mixins/titleBadge.js index 101b9f6..224f0c0 100644 --- a/theme-vdoing/mixins/titleBadge.js +++ b/theme-vdoing/mixins/titleBadge.js @@ -1,5 +1,5 @@ export default { - data() { + data () { return { badges: [ 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAABGpJREFUSA3tVVtoXFUU3fvOI53UlmCaKIFmwEhsE7QK0ipFEdHEKpXaZGrp15SINsXUWvBDpBgQRKi0+KKoFeJHfZA+ED9KKoIU2gYD9UejTW4rVIzm0VSTziPzuNu1z507dibTTjL4U/DAzLn3nL3X2o91ziX6f9wMFdh6Jvbm9nNSV0msViVO6tN1Rm7NMu2OpeJ9lWBUTDxrJbYTS0hInuwciu9eLHlFxCLCZEk3MegsJmZ5K/JD6t7FkFdEvGUo1g7qJoG3MHImqRIn8/nzY1K9UPKKiJmtnUqHVE3Gbuay6vJE/N2FEmuxFjW2nUuE0yQXRRxLiTUAzs36zhZvOXJPdX850EVnnLZkB8prodQoM5JGj7Xk2mvC7JB8tG04Ef5PiXtG0UtxupRQSfTnBoCy554x18yJHI6I+G5Eru4LHmPJZEQsrvPUbMiA8G/WgMK7w7I+ez7++o2ANfbrjvaOl1tFMs+htG3IrZH9/hDX1Pr8Tc0UvH8tcX29KzAgIGcEkINyW5BF9x891hw6VYqgJHEk0huccS7vh3C6gTiODL+26huuBtbct8eZnqLML8PkxGYpuPZBqtqwkSjgc4mB5gbgig5i+y0UDK35LMxXisn9xQtK+nd26gTIHsHe/oblK/b29fUmN/8Y+9jAQrnBp56m1LcDlDp9irKTExSKduXJVWSqdBMA08pEJnEIOB3FPPMybu/oeV8zFeYN3xx576Q6RH+VmplE4ncQV5v+5rzSoyOU7PuEAg8g803PwBJ0CExno/jcMbN8tONYeOmHiuUNryvm3fRUy4tMPVLdAGkUhNWuggGrJcXPv+ouCjz0MKUHz1J2/E8IC9nqTabcxgaBYM0hPhD5Y65FsbxRQKxCQrDjDctW7PUM3HuZunFyifSAqEfuzCp48Il24luWUWZoyJCaPR82jE0+kFA643wRFVni4RYSq3ohJO2pZ7B5dO4xkDWbEpossJPLSrPjYID8rS2UHTlvyNxqIGsg674XJJ7vnh5L7PNwC4hh2sjCI96mzszOTpxLF0T7l88Yz7lAuK6OnL8gXLOnTvpzSb22YG8W7us3jSebFHeeqnXRG1vt+MoUM84LQIBmMsCTAcOauTh0T0l0neQK7m2bLMt2mGxU3HYssS0J2cdv5wljlPsrIuZLAG/2DOZIXgCYT8uMGZN+e2kSirfxZOPCsC0f24nTZzspnVn9VePS1Z5vubmAGGXG8ZFno9Hel0yfA5ZPhF7Dh972BQJ2qCpgH67lmWtBYbvk6sz02wjky2vXyz0XErP/kFB619js1BtwfOV4OPRqOQBjy3Qbk18vigUPPSD5ceHnwck7W9bhAqZdd7SuG7w4/P2F/GaJh8c7e9qgow+Q7cGBo+98WsLkuktFqiZabtXuQTu/Y5ETbR0v7tNSFnvrmu6pjdoan2KjMu8q/Hmj1EfCO2ZGfEIbIXKUlw8qaX9/b2oeSJmFksSeT/Fn0V3nSypChh4Gjh74ybO9aeZ/AN2dwciu2/MhAAAAAElFTkSuQmCC', @@ -9,20 +9,20 @@ export default { currentBadge: '' } }, - created() { + created () { if (this.$themeConfig.titleBadgeIcons) { this.badges = this.$themeConfig.titleBadgeIcons } this.currentBadge = this.getBadge() }, watch: { - '$route.path'() { + '$route.path' () { this.currentBadge = this.getBadge() } }, methods: { - getBadge() { + getBadge () { return this.badges[Math.floor(Math.random() * this.badges.length)] } } -} \ No newline at end of file +} diff --git a/theme-vdoing/node_utils/getSidebarData.js b/theme-vdoing/node_utils/getSidebarData.js index 738e1d5..1b954b0 100644 --- a/theme-vdoing/node_utils/getSidebarData.js +++ b/theme-vdoing/node_utils/getSidebarData.js @@ -11,14 +11,14 @@ let catalogueData = {}; // 目录页数据 * @param {String} sourceDir .md文件所在源目录(一般是docs目录) * @param {Boolean} collapsable 是否可折叠 */ -function createSidebarData(sourceDir, collapsable){ +function createSidebarData (sourceDir, collapsable) { const sidebarData = {}; const tocs = readTocs(sourceDir); tocs.forEach(toc => { // toc是每个目录的绝对路径 const tocArr = toc.split('\\') - if (tocArr[tocArr.length -1] === '_posts') { // 碎片化文章 - + if (tocArr[tocArr.length - 1] === '_posts') { // 碎片化文章 + // 注释说明:碎片化文章不需要生成结构化侧边栏 2020.05.01 // const sidebarArr = mapTocToPostSidebar(toc); // sidebarData[`/${path.basename(toc)}/`] = sidebarArr @@ -44,7 +44,7 @@ module.exports = createSidebarData; * 读取指定目录下的文件绝对路径 * @param {String} root 指定的目录 */ -function readTocs(root){ +function readTocs (root) { const result = []; const files = fs.readdirSync(root); // 读取目录,返回数组,成员是root底下所有的目录名 (包含文件夹和文件) files.forEach(name => { @@ -59,9 +59,9 @@ function readTocs(root){ /** * 将碎片化文章目录(_posts)映射为对应的侧边栏配置数据 - * @param {String} root + * @param {String} root */ -function mapTocToPostSidebar(root){ +function mapTocToPostSidebar (root) { let postSidebar = [] // 碎片化文章数据 const files = fs.readdirSync(root); // 读取目录(文件和文件夹),返回数组 @@ -74,10 +74,10 @@ function mapTocToPostSidebar(root){ log(chalk.yellow(`warning: 该文件 "${file}" 在_posts文件夹中,不应有序号,且文件名中间不应有'.'`)) return } - if(stat.isDirectory()){ // 是文件夹目录 + if (stat.isDirectory()) { // 是文件夹目录 // log(chalk.yellow(`warning: 该目录 "${file}" 内文件无法生成侧边栏,_posts文件夹里面不能有二级目录。`)) return - } + } let [title, type] = filename.split('.'); if (type !== 'md') { @@ -88,7 +88,7 @@ function mapTocToPostSidebar(root){ const contentStr = fs.readFileSync(file, 'utf8') // 读取md文件内容,返回字符串 const { data } = matter(contentStr) // 解析出front matter数据 const permalink = data.permalink || '' - postSidebar.push([filename, title, permalink ]); // [<路径>, <文件标题>, <永久链接>] + postSidebar.push([filename, title, permalink]); // [<路径>, <文件标题>, <永久链接>] }) return postSidebar @@ -97,12 +97,12 @@ function mapTocToPostSidebar(root){ /** * 将目录映射为对应的侧边栏配置数据 - * @param {String} root + * @param {String} root * @param {Boolean} collapsable * @param {String} prefix */ -function mapTocToSidebar(root, collapsable, prefix){ +function mapTocToSidebar (root, collapsable, prefix) { prefix = prefix || ''; let sidebar = []; const files = fs.readdirSync(root); // 读取目录(文件和文件夹),返回数组 @@ -119,7 +119,7 @@ function mapTocToSidebar(root, collapsable, prefix){ if (sidebar[order]) { // 判断序号是否已经存在 log(chalk.yellow(`warning: 该文件 "${file}" 的序号在同一级别中重复出现,将会被覆盖`)) } - if(stat.isDirectory()){ // 是文件夹目录 + if (stat.isDirectory()) { // 是文件夹目录 sidebar[order] = { title, collapsable, // 是否可折叠,默认true @@ -133,7 +133,7 @@ function mapTocToSidebar(root, collapsable, prefix){ const contentStr = fs.readFileSync(file, 'utf8') // 读取md文件内容,返回字符串 const { data } = matter(contentStr) // 解析出front matter数据 const permalink = data.permalink || '' - sidebar[order] = [prefix + filename, title, permalink ]; // [<路径>, <文件标题>, <永久链接>] + sidebar[order] = [prefix + filename, title, permalink]; // [<路径>, <文件标题>, <永久链接>] // 目录页和永久链接,用于给面包屑提供数据 const pageComponent = data.pageComponent @@ -148,4 +148,4 @@ function mapTocToSidebar(root, collapsable, prefix){ sidebar, catalogueData }; -} \ No newline at end of file +} diff --git a/theme-vdoing/node_utils/handlePage.js b/theme-vdoing/node_utils/handlePage.js index fc9a191..5268653 100644 --- a/theme-vdoing/node_utils/handlePage.js +++ b/theme-vdoing/node_utils/handlePage.js @@ -6,7 +6,7 @@ const chalk = require('chalk') // 命令行打印美化 const { type } = require('./modules/fn'); const log = console.log -function createPage(sourceDir, page) { +function createPage (sourceDir, page) { const dirPath = path.join(sourceDir, '@pages') // 生成的文件夹路径 // 文件夹不存在时 @@ -21,30 +21,30 @@ function createPage(sourceDir, page) { return } -// 注意:反引号字符串的格式会映射到文件 -let content = '' -if (page.indexOf('categories') > -1) { - content = `--- + // 注意:反引号字符串的格式会映射到文件 + let content = '' + if (page.indexOf('categories') > -1) { + content = `--- categoriesPage: true title: 分类 permalink: /categories/ article: false ---` -} else if (page.indexOf('tags') > -1){ - content = `--- + } else if (page.indexOf('tags') > -1) { + content = `--- tagsPage: true title: 标签 permalink: /tags/ article: false ---` -} else if (page.indexOf('archives') > -1){ - content = `--- + } else if (page.indexOf('archives') > -1) { + content = `--- archivesPage: true title: 归档 permalink: /archives/ article: false ---` -} + } if (content) { fs.writeFileSync(pagePath, content) @@ -53,7 +53,7 @@ article: false } // 删除页面文件 -function deletePage(sourceDir, page) { +function deletePage (sourceDir, page) { const dirPath = path.join(sourceDir, '@pages') // 文件夹路径 const pagePath = path.join(dirPath, `${page}.md`) // 文件路径 @@ -66,10 +66,10 @@ function deletePage(sourceDir, page) { } // 删除文件夹 -function deleteDir(dirPath) { +function deleteDir (dirPath) { if (fs.existsSync(dirPath)) { const files = fs.readdirSync(dirPath) - if( type(files) === 'array' && files.length === 0) { + if (type(files) === 'array' && files.length === 0) { fs.rmdirSync(dirPath) log(chalk.blue('tip ') + chalk.green(`delete dir(删除目录): ${dirPath}`)) } @@ -79,4 +79,4 @@ function deleteDir(dirPath) { module.exports = { createPage, deletePage -} \ No newline at end of file +} diff --git a/theme-vdoing/node_utils/modules/fn.js b/theme-vdoing/node_utils/modules/fn.js index 48cbbd1..1528498 100644 --- a/theme-vdoing/node_utils/modules/fn.js +++ b/theme-vdoing/node_utils/modules/fn.js @@ -1,21 +1,21 @@ // 类型判断 -exports.type = function (o){ +exports.type = function (o) { var s = Object.prototype.toString.call(o) return s.match(/\[object (.*?)\]/)[1].toLowerCase() } - // 修复date时区格式的问题 - exports.repairDate = function (date) { +// 修复date时区格式的问题 +exports.repairDate = function (date) { date = new Date(date); - return `${date.getUTCFullYear()}-${zero(date.getUTCMonth()+1)}-${zero(date.getUTCDate())} ${zero(date.getUTCHours())}:${zero(date.getUTCMinutes())}:${zero(date.getUTCSeconds())}`; + return `${date.getUTCFullYear()}-${zero(date.getUTCMonth() + 1)}-${zero(date.getUTCDate())} ${zero(date.getUTCHours())}:${zero(date.getUTCMinutes())}:${zero(date.getUTCSeconds())}`; } // 日期的格式 exports.dateFormat = function (date) { - return `${date.getFullYear()}-${zero(date.getMonth()+1)}-${zero(date.getDate())} ${zero(date.getHours())}:${zero(date.getMinutes())}:${zero(date.getSeconds())}` + return `${date.getFullYear()}-${zero(date.getMonth() + 1)}-${zero(date.getDate())} ${zero(date.getHours())}:${zero(date.getMinutes())}:${zero(date.getSeconds())}` } // 小于10补0 -function zero(d){ - return d.toString().padStart(2,'0') -} \ No newline at end of file +function zero (d) { + return d.toString().padStart(2, '0') +} diff --git a/theme-vdoing/node_utils/modules/readFileList.js b/theme-vdoing/node_utils/modules/readFileList.js index f1b6610..7472296 100644 --- a/theme-vdoing/node_utils/modules/readFileList.js +++ b/theme-vdoing/node_utils/modules/readFileList.js @@ -6,38 +6,38 @@ const path = require('path'); // 路径模块 const chalk = require('chalk') // 命令行打印美化 const log = console.log -function readFileList(dir, filesList = []) { +function readFileList (dir, filesList = []) { const files = fs.readdirSync(dir); - files.forEach( (item, index) => { - let filePath = path.join(dir, item); - const stat = fs.statSync(filePath); - if (stat.isDirectory() && item !== '.vuepress' && item !== '@pages') { - readFileList(path.join(dir, item), filesList); //递归读取文件 - } else { - if(path.basename(dir) !== 'docs'){ // 过滤docs目录级下的文件 + files.forEach((item, index) => { + let filePath = path.join(dir, item); + const stat = fs.statSync(filePath); + if (stat.isDirectory() && item !== '.vuepress' && item !== '@pages') { + readFileList(path.join(dir, item), filesList); //递归读取文件 + } else { + if (path.basename(dir) !== 'docs') { // 过滤docs目录级下的文件 - const fileNameArr = path.basename(filePath).split('.') - let name = null, type = null; - if (fileNameArr.length === 2) { // 没有序号的文件 - name = fileNameArr[0] - type = fileNameArr[1] - } else if (fileNameArr.length === 3) { // 有序号的文件 - name = fileNameArr[1] - type = fileNameArr[2] - } else { // 超过两个‘.’的 - log(chalk.yellow(`warning: 该文件 "${filePath}" 没有按照约定命名,将忽略生成相应数据。`)) - return - } - if(type === 'md'){ // 过滤非md文件 - filesList.push({ - name, - filePath - }); - } + const fileNameArr = path.basename(filePath).split('.') + let name = null, type = null; + if (fileNameArr.length === 2) { // 没有序号的文件 + name = fileNameArr[0] + type = fileNameArr[1] + } else if (fileNameArr.length === 3) { // 有序号的文件 + name = fileNameArr[1] + type = fileNameArr[2] + } else { // 超过两个‘.’的 + log(chalk.yellow(`warning: 该文件 "${filePath}" 没有按照约定命名,将忽略生成相应数据。`)) + return } - } + if (type === 'md') { // 过滤非md文件 + filesList.push({ + name, + filePath + }); + } + } + } }); return filesList; } -module.exports = readFileList; \ No newline at end of file +module.exports = readFileList; diff --git a/theme-vdoing/node_utils/setFrontmatter.js b/theme-vdoing/node_utils/setFrontmatter.js index c1a2693..fb985f5 100644 --- a/theme-vdoing/node_utils/setFrontmatter.js +++ b/theme-vdoing/node_utils/setFrontmatter.js @@ -4,7 +4,7 @@ const jsonToYaml = require('json2yaml') const chalk = require('chalk') // 命令行打印美化 // const arg = process.argv.splice(2)[0]; // 获取命令行传入的参数 const readFileList = require('./modules/readFileList'); -const { type, repairDate, dateFormat} = require('./modules/fn'); +const { type, repairDate, dateFormat } = require('./modules/fn'); const log = console.log const path = require('path'); @@ -14,7 +14,7 @@ const PREFIX = '/pages/' /** * 给.md文件设置frontmatter(标题、日期、永久链接等数据) */ -function setFrontmatter(sourceDir, themeConfig) { +function setFrontmatter (sourceDir, themeConfig) { const isCategory = themeConfig.category const isTag = themeConfig.tag @@ -33,16 +33,16 @@ function setFrontmatter(sourceDir, themeConfig) { const dateStr = dateFormat(getBirthtime(stat));// 文件的创建时间 const categories = getCategories(file, categoryText) -// 注意下面这些反引号字符串的格式会映射到文件 -const cateStr = isCategory === false ? '' : ` -categories: - - ${categories[0]}${categories[1] ? '\r\n - '+ categories[1] : ''}`; + // 注意下面这些反引号字符串的格式会映射到文件 + const cateStr = isCategory === false ? '' : ` +categories: + - ${categories[0]}${categories[1] ? '\r\n - ' + categories[1] : ''}`; -const tagsStr = isTag === false ? '' : ` -tags: + const tagsStr = isTag === false ? '' : ` +tags: - `; -const fmData = `--- + const fmData = `--- title: ${file.name} date: ${dateStr} permalink: ${getPermalink()}${file.filePath.indexOf('_posts') > -1 ? '\r\nsidebar: auto' : ''}${cateStr}${tagsStr} @@ -71,18 +71,18 @@ permalink: ${getPermalink()}${file.filePath.indexOf('_posts') > -1 ? '\r\nsideba matterData.permalink = getPermalink(); mark = true; } - + if (file.filePath.indexOf('_posts') > -1 && !matterData.hasOwnProperty('sidebar')) { // auto侧边栏,_posts文件夹特有 matterData.sidebar = "auto"; mark = true; } - if ( !matterData.hasOwnProperty('pageComponent') && matterData.article !== false ) { // 是文章页才添加分类和标签 + if (!matterData.hasOwnProperty('pageComponent') && matterData.article !== false) { // 是文章页才添加分类和标签 if (isCategory !== false && !matterData.hasOwnProperty('categories')) { // 分类 matterData.categories = getCategories(file, categoryText) mark = true; } - + if (isTag !== false && !matterData.hasOwnProperty('tags')) { // 标签 matterData.tags = ['']; mark = true; @@ -90,20 +90,20 @@ permalink: ${getPermalink()}${file.filePath.indexOf('_posts') > -1 ? '\r\nsideba } if (mark) { - if(matterData.date && type(matterData.date) === 'date') { + if (matterData.date && type(matterData.date) === 'date') { matterData.date = repairDate(matterData.date) // 修复时间格式 } - const newData = jsonToYaml.stringify(matterData).replace(/\n\s{2}/g,"\n").replace(/"/g,"") + '---\r\n' + fileMatterObj.content; + const newData = jsonToYaml.stringify(matterData).replace(/\n\s{2}/g, "\n").replace(/"/g, "") + '---\r\n' + fileMatterObj.content; fs.writeFileSync(file.filePath, newData); // 写入 log(chalk.blue('tip ') + chalk.green(`write frontmatter(写入frontmatter):${file.filePath} `)) } - + } }) } // 获取分类数据 -function getCategories(file, categoryText) { +function getCategories (file, categoryText) { let categories = [] if (file.filePath.indexOf('_posts') === -1) { // 不在_posts文件夹 @@ -120,13 +120,13 @@ function getCategories(file, categoryText) { } // 获取文件创建时间 -function getBirthtime(stat){ +function getBirthtime (stat) { // 在一些系统下无法获取birthtime属性的正确时间,使用atime代替 return stat.birthtime.getFullYear() != 1970 ? stat.birthtime : stat.atime } // 定义永久链接数据 -function getPermalink() { +function getPermalink () { return `${PREFIX + (Math.random() + Math.random()).toString(16).slice(2, 8)}/` } diff --git a/theme-vdoing/package.json b/theme-vdoing/package.json index ec06bce..fb1edf4 100644 --- a/theme-vdoing/package.json +++ b/theme-vdoing/package.json @@ -1,6 +1,6 @@ { "name": "vuepress-theme-vdoing", - "version": "1.4.4", + "version": "1.5.0", "description": "Vdoing theme for VuePress. 一个基于VuePress的知识管理兼博客主题。", "author": { "name": "gaoyi(Evan) Xu" @@ -19,7 +19,7 @@ "@vuepress/plugin-active-header-links": "^1.2.0", "@vuepress/plugin-nprogress": "^1.2.0", "@vuepress/plugin-search": "^1.2.0", - "chalk": "^4.0.0", + "chalk": "^4.0.0", "json2yaml": "^1.1.0", "js-yaml": "^3.13.1", "docsearch.js": "^2.5.2", @@ -40,10 +40,8 @@ ], "license": "MIT", "main": "index.js", - "maintainers": [ - { - "name": "Evan xu", - "email": "894072666@qq.com" - } - ] + "maintainers": [{ + "name": "Evan xu", + "email": "894072666@qq.com" + }] } diff --git a/theme-vdoing/styles/custom-blocks.styl b/theme-vdoing/styles/custom-blocks.styl index d05d034..e212779 100644 --- a/theme-vdoing/styles/custom-blocks.styl +++ b/theme-vdoing/styles/custom-blocks.styl @@ -4,7 +4,7 @@ margin-bottom .2rem p margin 0 - &.tip, &.warning, &.danger + &.tip, &.warning, &.danger, &.note padding .5rem 1.5rem border-left-width .5rem border-left-style solid @@ -29,6 +29,10 @@ color darken(red, 40%) a color var(--textColor) + &.note + background-color #E8F5FA + border-color #157BAE + color darken(#157BAE, 40%) &.right color var(--textColor) font-size 0.9rem @@ -66,7 +70,7 @@ .theme-mode-dark .custom-block &.warning - background-color rgba(255, 247, 208, .2) + background-color rgba(255, 247, 208, .2) color darken(#ffe564, 35%) .custom-block-title color darken(#ffe564, 15%) @@ -77,4 +81,7 @@ background-color rgba(255, 230, 230, .4) color darken(red, 50%) a - color $accentColor \ No newline at end of file + color $accentColor + &.note + background-color rgba(243, 245, 247, .2) + color darken(#157BAE, 0%) diff --git a/theme-vdoing/styles/markdown-container.styl b/theme-vdoing/styles/markdown-container.styl index f48c1d2..7255c97 100644 --- a/theme-vdoing/styles/markdown-container.styl +++ b/theme-vdoing/styles/markdown-container.styl @@ -13,7 +13,7 @@ h1, h2, h3, h4, h5, h6 float none padding-right: 0 margin-left: -.9rem - + // 普通卡片列表 .cardListContainer @@ -31,14 +31,14 @@ h1, h2, h3, h4, h5, h6 background var(--bodyBg) border-radius 3px color var(--textColor) - display flex + display flex box-shadow 1px 1px 2px 0 rgba(0,0,0,.06) transition all .4s &:hover text-decoration none box-shadow: 0 10px 20px -10px var(--randomColor, rgba(0,0,0,0.15)); - transform: translateY(-5px) - img + transform: translateY(-3px) scale(1.01, 1.01) + img // transform rotate(8deg) scale(1.1, 1.1) box-shadow 3px 2px 7px rgba(0, 0, 0, 0.15) div p @@ -55,7 +55,7 @@ h1, h2, h3, h4, h5, h6 div flex 1 display inline-block - float right + float right padding 1rem 0 p margin 0 @@ -96,20 +96,21 @@ h1, h2, h3, h4, h5, h6 width calc(100%/3 - 1rem) margin .5rem background var(--mainBg) - border 1px solid rgba(0,0,0,0.08) + border 1px solid rgba(0,0,0,0.1) box-sizing: border-box border-radius 3px overflow hidden color var(--textColor) box-shadow 2px 2px 10px rgba(0,0,0,.04) - display flex + display flex flex-direction: column; justify-content: flex-start; align-items: stretch; align-content: stretch; - transition: box-shadow .3s + transition: all .4s &:hover - box-shadow 1px 1px 20px rgba(0,0,0,.07) + box-shadow 1px 1px 20px rgba(0,0,0,.1) + transform: translateY(-3px) .box-img overflow hidden position relative @@ -119,15 +120,15 @@ h1, h2, h3, h4, h5, h6 width 100% height auto transition: all .3s - &:hover - img - transform: scale(1.1, 1.1) - opacity .75 + // &:hover + // img + // transform: scale(1.1, 1.1) + // opacity .75 a color var(--textColor) transition: color .3s &:hover - color $accentColor + // color $accentColor text-decoration none .box-info padding: .8rem 1rem @@ -141,13 +142,13 @@ h1, h2, h3, h4, h5, h6 .box-footer overflow hidden padding: .8rem 1rem - border-top: 1px solid rgba(0,0,0,0.05) + border-top: 1px solid rgba(0,0,0,0.1) img width 1.8rem height 1.8rem border-radius 50% float left - span + span line-height 1.8rem float left margin-left: .6rem @@ -168,9 +169,9 @@ h1, h2, h3, h4, h5, h6 border-color: var(--borderColor) .box-footer border-color: var(--borderColor) - + // 卡片列表的响应 -@media (max-width: 900px) +@media (max-width: 900px) .cardListContainer .card-list .card-item.row-4 @@ -180,7 +181,7 @@ h1, h2, h3, h4, h5, h6 .card-item.row-4 width calc(100%/3 - 1rem) -@media (max-width: 720px) +@media (max-width: 720px) .cardListContainer .card-list .card-item.row-3, .card-item.row-4 @@ -191,8 +192,8 @@ h1, h2, h3, h4, h5, h6 .card-list .card-item.row-3, .card-item.row-4 width calc(100%/2 - 1rem) - -@media (max-width: 500px) + +@media (max-width: 500px) .cardListContainer .card-list .card-item.row-1, .card-item.row-2, .card-item.row-3, .card-item.row-4 @@ -202,4 +203,4 @@ h1, h2, h3, h4, h5, h6 .cardImgListContainer .card-list .card-item.row-1, .card-item.row-2, .card-item.row-3, .card-item.row-4 - width calc(100% - 1rem) \ No newline at end of file + width calc(100% - 1rem) diff --git a/theme-vdoing/util/getArticleDate(弃用).js b/theme-vdoing/util/getArticleDate(弃用).js deleted file mode 100644 index 68f3526..0000000 --- a/theme-vdoing/util/getArticleDate(弃用).js +++ /dev/null @@ -1,118 +0,0 @@ -const re = /.*\/(.*?)\.(html|md)/ - -export function getPagesList(posts) { - let pagesList = {} - let tagGroup = {} - - // 过滤非文章页 - posts = filterNotArticle(posts) - - // 对页面数据二次处理和排序 - const pages = posts.map(post => { - // const execs = re.exec(post.relativePath) - const date = new Date(post.frontmatter.date || post.lastUpdated) - const pathArr = post.relativePath.split('/') - - return { - // ...post, - title: post.title, - path: post.path, - // lastUpdated: post.lastUpdated, - updateTimestamp: date.getTime(), // 更新日期的时间戳 - // filename: execs ? execs['1'] : '', - formatDay: formatDate(date), - year: date.getFullYear(), - tag: /\./g.test(pathArr[0]) ? pathArr[1].split('.')[1] : pathArr[0] // 区分是单独合集的笔记还是文章 - } - }).sort((a, b) => b.updateTimestamp - a.updateTimestamp) - - - // 根据年份对数据分组 - let pageYearArr = [] - let pageYearObj = {} - pages.forEach( page => { - // 全部 - if (!pageYearObj[page.year]){ - pageYearArr.push({ - year: page.year, - pageList: [page] - }) - pageYearObj[page.year] = page - } else { - pageYearArr.forEach(ele => { - if (ele.year == page.year){ - ele.pageList.push(page) - } - }) - } - - // 加入标签属性 - if (!tagGroup[page.tag]) { - tagGroup[page.tag] = [] - } - }) - - // 根据标签分组 - for (let item in tagGroup) { // 循环标签 - - for(let i in pageYearArr) { // 循环全部 - const filterTag = pageYearArr[i].pageList.filter(page => { // 按标签过滤 - return page.tag === item - }) - if (filterTag.length) { // 该年份中有数据才加入 - tagGroup[item].push({ - year: pageYearArr[i].year, - pageList: filterTag - }) - } - } - } - pagesList.tagGroup = tagGroup - pagesList.allPage = pageYearArr // 加入全部 - - return pagesList -} - - - -export function getTopKPosts(posts, len, currentPath) { - return filterNotArticle(posts, currentPath) - .map(post => { - const execs = re.exec(post.relativePath) - return { - ...post, - updateTimestamp: (new Date(post.frontmatter.date || post.lastUpdated)).getTime(), // 更新日期的时间戳 - filename: execs ? execs['1'] : '', - formatDay: formatDate(new Date(post.frontmatter.date || post.lastUpdated)) - } - }) - .sort((a, b) => b.updateTimestamp - a.updateTimestamp) - .slice(0,len) -} - - // 过滤没有frontmatter数据的 和 非文章页面的, -function filterNotArticle(posts, currentPath){ - return posts.filter(post => { - const { frontmatter, path } = post; - if (currentPath) { // 过滤是当前页面的 - return frontmatter && frontmatter.permalink && frontmatter.title && frontmatter.article !== false && path !== currentPath; - } else { - return frontmatter && frontmatter.permalink && frontmatter.title && frontmatter.article !== false; - } - - }) -} - -// 日期格式化 -function formatDate(date) { - if (!(date instanceof Date)) { - return - } - // return `${date.getFullYear()}/${zero(date.getMonth() + 1)}/${zero(date.getDate())}` - return `${zero(date.getMonth() + 1)}-${zero(date.getDate())}` -} - -// 补0 -function zero(d) { - return d.toString().padStart(2,'0') -} \ No newline at end of file diff --git a/theme-vdoing/util/index.js b/theme-vdoing/util/index.js index b3897a3..04ffe22 100644 --- a/theme-vdoing/util/index.js +++ b/theme-vdoing/util/index.js @@ -246,22 +246,22 @@ function resolveItem (item, pages, base, groupDepth = 1) { // 类型判断 -export function type(o){ +export function type (o) { const s = Object.prototype.toString.call(o) return s.match(/\[object (.*?)\]/)[1].toLowerCase() } // 日期格式化(只获取年月日) -export function dateFormat(date) { +export function dateFormat (date) { if (!(date instanceof Date)) { date = new Date(date) } - return `${date.getUTCFullYear()}-${zero(date.getUTCMonth()+1)}-${zero(date.getUTCDate())}` + return `${date.getUTCFullYear()}-${zero(date.getUTCMonth() + 1)}-${zero(date.getUTCDate())}` } // 小于10补0 -export function zero(d){ - return d.toString().padStart(2,'0') +export function zero (d) { + return d.toString().padStart(2, '0') } // 获取时间的时间戳 @@ -280,8 +280,8 @@ export function compareDate (a, b) { } // 将特殊符号编码(应用于url) -export function encodeUrl(str) { +export function encodeUrl (str) { str = str + '' str = str.replace(/ |((?=[\x21-\x7e]+)[^A-Za-z0-9])/g, '-') return str -} \ No newline at end of file +} diff --git a/theme-vdoing/util/postData.js b/theme-vdoing/util/postData.js index 93efaff..91eba96 100644 --- a/theme-vdoing/util/postData.js +++ b/theme-vdoing/util/postData.js @@ -1,4 +1,4 @@ -import { type, compareDate, encodeUrl } from './index' +import { type, compareDate } from './index' /** * 过滤非文章页 @@ -6,7 +6,7 @@ import { type, compareDate, encodeUrl } from './index' */ export function filterPosts (posts) { posts = posts.filter(item => { - const { frontmatter: { pageComponent, article, home }} = item + const { frontmatter: { pageComponent, article, home } } = item return !(pageComponent || article === false || home === true) // 存在页面组件、article字段为false,以及首页 }) return posts @@ -47,31 +47,29 @@ export function sortPostsByDate (posts) { * 按分类和标签分组 * @param {Array} posts 按时间排序之后的文章数据 */ -export function groupPosts(posts) { +export function groupPosts (posts) { const categoriesObj = {} const tagsObj = {} for (let i = 0, postsL = posts.length; i < postsL; i++) { - const { frontmatter: { categories, tags }} = posts[i] + const { frontmatter: { categories, tags } } = posts[i] if (type(categories) === 'array') { categories.forEach(item => { if (item) { // 分类值是有效的 - const encodeItem = encodeUrl(item) - if (!categoriesObj[encodeItem]) { - categoriesObj[encodeItem] = [] + if (!categoriesObj[item]) { + categoriesObj[item] = [] } - categoriesObj[encodeItem].push(posts[i]) + categoriesObj[item].push(posts[i]) } }) } if (type(tags) === 'array') { tags.forEach(item => { if (item) { // 标签值是有效的 - const encodeItem = encodeUrl(item) - if (!tagsObj[encodeItem]) { - tagsObj[encodeItem] = [] + if (!tagsObj[item]) { + tagsObj[item] = [] } - tagsObj[encodeItem].push(posts[i]) + tagsObj[item].push(posts[i]) } }) } @@ -86,18 +84,18 @@ export function groupPosts(posts) { * 获取所有分类和标签 * @param {Object} groupPosts 按分类和标签分组之后的文章数据 */ -export function categoriesAndTags(groupPosts) { +export function categoriesAndTags (groupPosts) { const categoriesArr = [] const tagsArr = [] - for(let key in groupPosts.categories) { + for (let key in groupPosts.categories) { categoriesArr.push({ key, length: groupPosts.categories[key].length }) } - for(let key in groupPosts.tags) { + for (let key in groupPosts.tags) { tagsArr.push({ key, length: groupPosts.tags[key].length