Merge branch 'develop' of github.com:vuepress-reco/vuepress-theme-reco into develop
This commit is contained in:
luanhewei
commit
338c0b1fea
@ -2,7 +2,7 @@
|
|||||||
"packages": [
|
"packages": [
|
||||||
"packages/*"
|
"packages/*"
|
||||||
],
|
],
|
||||||
"version": "1.5.2",
|
"version": "1.5.3",
|
||||||
"npmClient": "yarn",
|
"npmClient": "yarn",
|
||||||
"useWorkspaces": true
|
"useWorkspaces": true
|
||||||
}
|
}
|
||||||
|
|||||||
@ -31,8 +31,8 @@ const modeOptions = {
|
|||||||
'--default-color-2': 'rgba(0, 0, 0, .2)',
|
'--default-color-2': 'rgba(0, 0, 0, .2)',
|
||||||
'--default-color-1': 'rgba(0, 0, 0, .1)',
|
'--default-color-1': 'rgba(0, 0, 0, .1)',
|
||||||
'--background-color': '#181818',
|
'--background-color': '#181818',
|
||||||
'--box-shadow': '0 1px 6px 0 rgba(0, 0, 0, .9)',
|
'--box-shadow': '0 1px 8px 0 rgba(0, 0, 0, .6)',
|
||||||
'--box-shadow-hover': '0 2px 26px 0 rgba(0, 0, 0, .9)',
|
'--box-shadow-hover': '0 2px 16px 0 rgba(0, 0, 0, .7)',
|
||||||
'--text-color': 'rgba(255, 255, 255, .8)',
|
'--text-color': 'rgba(255, 255, 255, .8)',
|
||||||
'--text-color-sub': '#8B8B8B',
|
'--text-color-sub': '#8B8B8B',
|
||||||
'--border-color': 'rgba(0, 0, 0, .3)',
|
'--border-color': 'rgba(0, 0, 0, .3)',
|
||||||
|
|||||||
@ -41,8 +41,8 @@ export default {
|
|||||||
.personal-img {
|
.personal-img {
|
||||||
display block
|
display block
|
||||||
margin 2rem auto 1rem
|
margin 2rem auto 1rem
|
||||||
width 5rem
|
width 6rem
|
||||||
height 5rem
|
height 6rem
|
||||||
border-radius 50%
|
border-radius 50%
|
||||||
}
|
}
|
||||||
.name {
|
.name {
|
||||||
@ -56,7 +56,7 @@ export default {
|
|||||||
width 80%
|
width 80%
|
||||||
> div {
|
> div {
|
||||||
text-align center
|
text-align center
|
||||||
flex auto
|
flex 0 0 50%
|
||||||
&:first-child {
|
&:first-child {
|
||||||
border-right 1px solid #333
|
border-right 1px solid #333
|
||||||
}
|
}
|
||||||
|
|||||||
@ -31,8 +31,9 @@ export default {
|
|||||||
padding 0
|
padding 0
|
||||||
margin 0
|
margin 0
|
||||||
list-style-type none
|
list-style-type none
|
||||||
> li
|
&.sidebar-links
|
||||||
background $accentColor
|
> li
|
||||||
|
background $accentColor
|
||||||
a
|
a
|
||||||
display inline-block
|
display inline-block
|
||||||
.nav-links
|
.nav-links
|
||||||
|
|||||||
@ -114,7 +114,7 @@ export default {
|
|||||||
position absolute
|
position absolute
|
||||||
top 0
|
top 0
|
||||||
bottom 0
|
bottom 0
|
||||||
right 0.5em
|
right 1em
|
||||||
margin auto
|
margin auto
|
||||||
&.clickable
|
&.clickable
|
||||||
&.active
|
&.active
|
||||||
|
|||||||
@ -2,8 +2,23 @@ import postMixin from '@theme/mixins/posts'
|
|||||||
import localMixin from '@theme/mixins/locales'
|
import localMixin from '@theme/mixins/locales'
|
||||||
|
|
||||||
export default ({
|
export default ({
|
||||||
Vue
|
Vue,
|
||||||
|
siteData,
|
||||||
|
isServer
|
||||||
}) => {
|
}) => {
|
||||||
Vue.mixin(postMixin)
|
Vue.mixin(postMixin)
|
||||||
Vue.mixin(localMixin)
|
Vue.mixin(localMixin)
|
||||||
|
if (!isServer) {
|
||||||
|
_registerCodeThemeCss(siteData.themeConfig.codeTheme)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _registerCodeThemeCss (theme = 'tomorrow') {
|
||||||
|
const themeArr = ['tomorrow', 'funky', 'okaidia', 'solarizedlight', 'default']
|
||||||
|
|
||||||
|
const link = document.createElement('link')
|
||||||
|
link.rel = 'stylesheet'
|
||||||
|
link.href = `//prismjs.com/themes/prism${themeArr.indexOf(theme) > -1 ? `-${theme}` : ''}.css`
|
||||||
|
|
||||||
|
document.head.append(link)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -45,10 +45,9 @@ import pagination from '@theme/mixins/pagination'
|
|||||||
import { sortPostsByStickyAndDate, filterPosts } from '@theme/helpers/postData'
|
import { sortPostsByStickyAndDate, filterPosts } from '@theme/helpers/postData'
|
||||||
import { getOneColor } from '@theme/helpers/other'
|
import { getOneColor } from '@theme/helpers/other'
|
||||||
import moduleTransitonMixin from '@theme/mixins/moduleTransiton'
|
import moduleTransitonMixin from '@theme/mixins/moduleTransiton'
|
||||||
import codeTheme from '@theme/mixins/codeTheme'
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
mixins: [pagination, moduleTransitonMixin, codeTheme],
|
mixins: [pagination, moduleTransitonMixin],
|
||||||
components: { Common, NoteAbstract, ModuleTransition },
|
components: { Common, NoteAbstract, ModuleTransition },
|
||||||
|
|
||||||
data () {
|
data () {
|
||||||
|
|||||||
@ -13,11 +13,9 @@ import Page from '@theme/components/Page'
|
|||||||
import Footer from '@theme/components/Footer'
|
import Footer from '@theme/components/Footer'
|
||||||
import Common from '@theme/components/Common'
|
import Common from '@theme/components/Common'
|
||||||
import { resolveSidebarItems } from '@theme/helpers/utils'
|
import { resolveSidebarItems } from '@theme/helpers/utils'
|
||||||
import codeTheme from '@theme/mixins/codeTheme'
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: { HomeBlog, Home, Page, Common, Footer },
|
components: { HomeBlog, Home, Page, Common, Footer },
|
||||||
mixins: [codeTheme],
|
|
||||||
computed: {
|
computed: {
|
||||||
sidebarItems () {
|
sidebarItems () {
|
||||||
return resolveSidebarItems(
|
return resolveSidebarItems(
|
||||||
|
|||||||
@ -39,10 +39,9 @@ import pagination from '@theme/mixins/pagination'
|
|||||||
import ModuleTransition from '@theme/components/ModuleTransition'
|
import ModuleTransition from '@theme/components/ModuleTransition'
|
||||||
import { sortPostsByStickyAndDate, filterPosts } from '@theme/helpers/postData'
|
import { sortPostsByStickyAndDate, filterPosts } from '@theme/helpers/postData'
|
||||||
import moduleTransitonMixin from '@theme/mixins/moduleTransiton'
|
import moduleTransitonMixin from '@theme/mixins/moduleTransiton'
|
||||||
import codeTheme from '@theme/mixins/codeTheme'
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
mixins: [pagination, moduleTransitonMixin, codeTheme],
|
mixins: [pagination, moduleTransitonMixin],
|
||||||
components: { Common, NoteAbstract, TagList, ModuleTransition },
|
components: { Common, NoteAbstract, TagList, ModuleTransition },
|
||||||
|
|
||||||
data () {
|
data () {
|
||||||
|
|||||||
@ -1,31 +0,0 @@
|
|||||||
export default {
|
|
||||||
created () {
|
|
||||||
const { codeTheme = 'tomorrow' } = this.$themeConfig
|
|
||||||
switch (codeTheme) {
|
|
||||||
case 'coy':
|
|
||||||
import('prismjs/themes/prism-coy.css')
|
|
||||||
break
|
|
||||||
case 'dark':
|
|
||||||
import('prismjs/themes/prism-dark.css')
|
|
||||||
break
|
|
||||||
case 'funky':
|
|
||||||
import('prismjs/themes/prism-funky.css')
|
|
||||||
break
|
|
||||||
case 'okaidia':
|
|
||||||
import('prismjs/themes/prism-okaidia.css')
|
|
||||||
break
|
|
||||||
case 'solarizedlight':
|
|
||||||
import('prismjs/themes/prism-solarizedlight.css')
|
|
||||||
break
|
|
||||||
case 'tomorrow':
|
|
||||||
import('prismjs/themes/prism-tomorrow.css')
|
|
||||||
break
|
|
||||||
case 'twilight':
|
|
||||||
import('prismjs/themes/prism-twilight.css')
|
|
||||||
break
|
|
||||||
default:
|
|
||||||
import('prismjs/themes/prism.css')
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "vuepress-theme-reco",
|
"name": "vuepress-theme-reco",
|
||||||
"version": "1.5.2",
|
"version": "1.5.3",
|
||||||
"description": "A simple and beautiful vuepress Blog & Doc theme.",
|
"description": "A simple and beautiful vuepress Blog & Doc theme.",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"vuepress",
|
"vuepress",
|
||||||
|
|||||||
@ -1,135 +1,135 @@
|
|||||||
//.content__default
|
.content__default
|
||||||
// code
|
code
|
||||||
// color lighten($textColor, 20%)
|
color lighten($textColor, 20%)
|
||||||
// padding 0.25rem 0.5rem
|
padding 0.25rem 0.5rem
|
||||||
// margin 0
|
margin 0
|
||||||
// font-size 0.85em
|
font-size 0.85em
|
||||||
// background-color var(--code-color)
|
background-color var(--code-color)
|
||||||
// border-radius 3px
|
border-radius 3px
|
||||||
// .token
|
.token
|
||||||
// &.deleted
|
&.deleted
|
||||||
// color #EC5975
|
color #EC5975
|
||||||
// &.inserted
|
&.inserted
|
||||||
// color $accentColor
|
color $accentColor
|
||||||
//
|
|
||||||
//.content__default
|
.content__default
|
||||||
// pre, pre[class*="language-"]
|
pre, pre[class*="language-"]
|
||||||
// line-height 1.4
|
line-height 1.4
|
||||||
// padding 1.25rem 1.5rem
|
padding 1.25rem 1.5rem
|
||||||
// margin 0.85rem 0
|
margin 0.85rem 0
|
||||||
// background-color $codeBgColor
|
background-color $codeBgColor
|
||||||
// border-radius 6px
|
border-radius 6px
|
||||||
// overflow auto
|
overflow auto
|
||||||
// code
|
code
|
||||||
// color #fff
|
color #fff
|
||||||
// padding 0
|
padding 0
|
||||||
// background-color transparent
|
background-color transparent
|
||||||
// border-radius 0
|
border-radius 0
|
||||||
//
|
|
||||||
//div[class*="language-"]
|
div[class*="language-"]
|
||||||
// position relative
|
position relative
|
||||||
// background-color $codeBgColor
|
background-color $codeBgColor
|
||||||
// border-radius 6px
|
border-radius 6px
|
||||||
// .highlight-lines
|
.highlight-lines
|
||||||
// user-select none
|
user-select none
|
||||||
// padding-top 1.3rem
|
padding-top 1.3rem
|
||||||
// position absolute
|
position absolute
|
||||||
// top 0
|
top 0
|
||||||
// left 0
|
left 0
|
||||||
// width 100%
|
width 100%
|
||||||
// line-height 1.4
|
line-height 1.4
|
||||||
// .highlighted
|
.highlighted
|
||||||
// background-color rgba(0, 0, 0, 66%)
|
background-color rgba(0, 0, 0, 66%)
|
||||||
// pre, pre[class*="language-"]
|
pre, pre[class*="language-"]
|
||||||
// background transparent
|
background transparent
|
||||||
// position relative
|
position relative
|
||||||
// z-index 1
|
z-index 1
|
||||||
// &::before
|
&::before
|
||||||
// position absolute
|
position absolute
|
||||||
// z-index 3
|
z-index 3
|
||||||
// top 0.8em
|
top 0.8em
|
||||||
// right 1em
|
right 1em
|
||||||
// font-size 0.75rem
|
font-size 0.75rem
|
||||||
// color rgba(255, 255, 255, 0.4)
|
color rgba(255, 255, 255, 0.4)
|
||||||
// &:not(.line-numbers-mode)
|
&:not(.line-numbers-mode)
|
||||||
// .line-numbers-wrapper
|
.line-numbers-wrapper
|
||||||
// display none
|
display none
|
||||||
// &.line-numbers-mode
|
&.line-numbers-mode
|
||||||
// .highlight-lines .highlighted
|
.highlight-lines .highlighted
|
||||||
// position relative
|
position relative
|
||||||
// &:before
|
&:before
|
||||||
// content ' '
|
content ' '
|
||||||
// position absolute
|
position absolute
|
||||||
// z-index 3
|
z-index 3
|
||||||
// left 0
|
left 0
|
||||||
// top 0
|
top 0
|
||||||
// display block
|
display block
|
||||||
// width $lineNumbersWrapperWidth
|
width $lineNumbersWrapperWidth
|
||||||
// height 100%
|
height 100%
|
||||||
// background-color rgba(0, 0, 0, 66%)
|
background-color rgba(0, 0, 0, 66%)
|
||||||
// pre
|
pre
|
||||||
// padding-left $lineNumbersWrapperWidth + 1 rem
|
padding-left $lineNumbersWrapperWidth + 1 rem
|
||||||
// vertical-align middle
|
vertical-align middle
|
||||||
// .line-numbers-wrapper
|
.line-numbers-wrapper
|
||||||
// position absolute
|
position absolute
|
||||||
// top 0
|
top 0
|
||||||
// width $lineNumbersWrapperWidth
|
width $lineNumbersWrapperWidth
|
||||||
// text-align center
|
text-align center
|
||||||
// color rgba(255, 255, 255, 0.3)
|
color rgba(255, 255, 255, 0.3)
|
||||||
// padding 1.25rem 0
|
padding 1.25rem 0
|
||||||
// line-height 1.4
|
line-height 1.4
|
||||||
// br
|
br
|
||||||
// user-select none
|
user-select none
|
||||||
// .line-number
|
.line-number
|
||||||
// position relative
|
position relative
|
||||||
// z-index 4
|
z-index 4
|
||||||
// user-select none
|
user-select none
|
||||||
// font-size 0.85em
|
font-size 0.85em
|
||||||
// &::after
|
&::after
|
||||||
// content ''
|
content ''
|
||||||
// position absolute
|
position absolute
|
||||||
// z-index 2
|
z-index 2
|
||||||
// top 0
|
top 0
|
||||||
// left 0
|
left 0
|
||||||
// width $lineNumbersWrapperWidth
|
width $lineNumbersWrapperWidth
|
||||||
// height 100%
|
height 100%
|
||||||
// border-radius 6px 0 0 6px
|
border-radius 6px 0 0 6px
|
||||||
// border-right 1px solid rgba(0, 0, 0, 66%)
|
border-right 1px solid rgba(0, 0, 0, 66%)
|
||||||
// background-color $codeBgColor
|
background-color $codeBgColor
|
||||||
//
|
|
||||||
//
|
|
||||||
//for lang in $codeLang
|
for lang in $codeLang
|
||||||
// div{'[class~="language-' + lang + '"]'}
|
div{'[class~="language-' + lang + '"]'}
|
||||||
// &:before
|
&:before
|
||||||
// content ('' + lang)
|
content ('' + lang)
|
||||||
//
|
|
||||||
//div[class~="language-javascript"]
|
div[class~="language-javascript"]
|
||||||
// &:before
|
&:before
|
||||||
// content "js"
|
content "js"
|
||||||
//
|
|
||||||
//div[class~="language-typescript"]
|
div[class~="language-typescript"]
|
||||||
// &:before
|
&:before
|
||||||
// content "ts"
|
content "ts"
|
||||||
//
|
|
||||||
//div[class~="language-markup"]
|
div[class~="language-markup"]
|
||||||
// &:before
|
&:before
|
||||||
// content "html"
|
content "html"
|
||||||
//
|
|
||||||
//div[class~="language-markdown"]
|
div[class~="language-markdown"]
|
||||||
// &:before
|
&:before
|
||||||
// content "md"
|
content "md"
|
||||||
//
|
|
||||||
//div[class~="language-json"]:before
|
div[class~="language-json"]:before
|
||||||
// content "json"
|
content "json"
|
||||||
//
|
|
||||||
//div[class~="language-ruby"]:before
|
div[class~="language-ruby"]:before
|
||||||
// content "rb"
|
content "rb"
|
||||||
//
|
|
||||||
//div[class~="language-python"]:before
|
div[class~="language-python"]:before
|
||||||
// content "py"
|
content "py"
|
||||||
//
|
|
||||||
//div[class~="language-bash"]:before
|
div[class~="language-bash"]:before
|
||||||
// content "sh"
|
content "sh"
|
||||||
//
|
|
||||||
//div[class~="language-php"]:before
|
div[class~="language-php"]:before
|
||||||
// content "php"
|
content "php"
|
||||||
|
|||||||
@ -28,9 +28,9 @@ $backgroundColor ?= #fff
|
|||||||
$backgroundColorDark ?= #181818
|
$backgroundColorDark ?= #181818
|
||||||
|
|
||||||
$boxShadow = 0 1px 8px 0 $darkColor1
|
$boxShadow = 0 1px 8px 0 $darkColor1
|
||||||
$boxShadowHover = 0 2px 16px 0 $darkColor1
|
$boxShadowHover = 0 2px 16px 0 $darkColor2
|
||||||
$boxShadowDark = 0 1px 6px 0 $darkColor6
|
$boxShadowDark = 0 1px 8px 0 $darkColor6
|
||||||
$boxShadowHoverDark = 0 2px 16px 0 $darkColor6
|
$boxShadowHoverDark = 0 2px 16px 0 $darkColor7
|
||||||
|
|
||||||
$textColor ?= #242424
|
$textColor ?= #242424
|
||||||
$textColorDark ?= $lightColor8
|
$textColorDark ?= $lightColor8
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user