feat(style): make theme variant configurable
This commit is contained in:
parent
285267e44c
commit
46acd4fae9
|
@ -0,0 +1,13 @@
|
||||||
|
/**
|
||||||
|
* Add resolved variables to the theme config for stylus.
|
||||||
|
*/
|
||||||
|
module.exports = function (hexo) {
|
||||||
|
hexo.extend.filter.register('template_locals', locals => {
|
||||||
|
const fontcdn = hexo.extend.helper.get('fontcdn').bind(hexo);
|
||||||
|
hexo.theme.config['@fontface'] = {
|
||||||
|
default: fontcdn('Ubuntu:wght@400;600&family=Source+Code+Pro', 'css2'),
|
||||||
|
cyberpunk: fontcdn('Oxanium:wght@300;400;600&family=Roboto+Mono', 'css2')
|
||||||
|
};
|
||||||
|
return locals;
|
||||||
|
});
|
||||||
|
};
|
|
@ -3,6 +3,7 @@ const logger = require('hexo-log')();
|
||||||
module.exports = hexo => {
|
module.exports = hexo => {
|
||||||
logger.info('=== Registering Hexo extensions ===');
|
logger.info('=== Registering Hexo extensions ===');
|
||||||
require('hexo-component-inferno/lib/hexo/filter/locals')(hexo);
|
require('hexo-component-inferno/lib/hexo/filter/locals')(hexo);
|
||||||
|
require('./hexo/filter/stylus')(hexo);
|
||||||
require('./hexo/generator/category')(hexo);
|
require('./hexo/generator/category')(hexo);
|
||||||
require('./hexo/generator/insight')(hexo);
|
require('./hexo/generator/insight')(hexo);
|
||||||
require('hexo-component-inferno/lib/hexo/generator/categories')(hexo);
|
require('hexo-component-inferno/lib/hexo/generator/categories')(hexo);
|
||||||
|
|
|
@ -9,6 +9,15 @@
|
||||||
"description": "Version of the configuration file",
|
"description": "Version of the configuration file",
|
||||||
"default": "3.0.0"
|
"default": "3.0.0"
|
||||||
},
|
},
|
||||||
|
"variant": {
|
||||||
|
"type": "string",
|
||||||
|
"description": "Icarus theme variant, can be \"default\" or \"cyberpunk\"",
|
||||||
|
"enum": [
|
||||||
|
"default",
|
||||||
|
"cyberpunk"
|
||||||
|
],
|
||||||
|
"default": "default"
|
||||||
|
},
|
||||||
"logo": {
|
"logo": {
|
||||||
"type": [
|
"type": [
|
||||||
"string",
|
"string",
|
||||||
|
|
|
@ -30,13 +30,14 @@ function getPageTitle(page, siteTitle, helper) {
|
||||||
module.exports = class extends Component {
|
module.exports = class extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { env, site, config, helper, page } = this.props;
|
const { env, site, config, helper, page } = this.props;
|
||||||
const { url_for, cdn, iconcdn, fontcdn, is_post } = helper;
|
const { url_for, cdn, iconcdn, is_post } = helper;
|
||||||
const {
|
const {
|
||||||
url,
|
url,
|
||||||
meta_generator = true,
|
meta_generator = true,
|
||||||
head = {},
|
head = {},
|
||||||
article,
|
article,
|
||||||
highlight
|
highlight,
|
||||||
|
variant = 'default'
|
||||||
} = config;
|
} = config;
|
||||||
const {
|
const {
|
||||||
meta = [],
|
meta = [],
|
||||||
|
@ -137,10 +138,9 @@ module.exports = class extends Component {
|
||||||
{rss ? <link rel="alternative" href={url_for(rss)} title={config.title} type="application/atom+xml" /> : null}
|
{rss ? <link rel="alternative" href={url_for(rss)} title={config.title} type="application/atom+xml" /> : null}
|
||||||
{favicon ? <link rel="icon" href={url_for(favicon)} /> : null}
|
{favicon ? <link rel="icon" href={url_for(favicon)} /> : null}
|
||||||
<link rel="stylesheet" href={iconcdn()} />
|
<link rel="stylesheet" href={iconcdn()} />
|
||||||
<link rel="stylesheet" href={fontcdn('Ubuntu:400,600|Source+Code+Pro')} />
|
|
||||||
{hlTheme ? <link rel="stylesheet" href={cdn('highlight.js', '9.12.0', 'styles/' + hlTheme + '.css')} /> : null}
|
{hlTheme ? <link rel="stylesheet" href={cdn('highlight.js', '9.12.0', 'styles/' + hlTheme + '.css')} /> : null}
|
||||||
|
<link rel="stylesheet" href={url_for('/css/' + variant + '.css')} />
|
||||||
<Plugins site={site} config={config} helper={helper} page={page} head={true} />
|
<Plugins site={site} config={config} helper={helper} page={page} head={true} />
|
||||||
<link rel="stylesheet" href={url_for('/css/style.css')} />
|
|
||||||
|
|
||||||
{adsenseClientId ? <script data-ad-client={adsenseClientId}
|
{adsenseClientId ? <script data-ad-client={adsenseClientId}
|
||||||
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" async={true}></script> : null}
|
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" async={true}></script> : null}
|
||||||
|
|
|
@ -22,7 +22,7 @@ BackToTop.Cacheable = cacheComponent(BackToTop, 'plugin.backtotop', props => {
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
title: helper.__('plugin.backtotop'),
|
title: helper.__('plugin.backtotop'),
|
||||||
jsUrl: helper.url_for('/js/back-to-top.js')
|
jsUrl: helper.url_for('/js/back_to_top.js')
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@300;400;600&display=swap')
|
@import url(hexo-config('@fontface.cyberpunk'))
|
||||||
|
|
||||||
$family-sans-serif ?= 'Oxanium', Ubuntu, Roboto, 'Open Sans', 'Microsoft YaHei', sans-serif
|
$family-sans-serif ?= 'Oxanium', Ubuntu, Roboto, 'Open Sans', 'Microsoft YaHei', sans-serif
|
||||||
|
$family-code ?= 'Roboto Mono', monospace, 'Microsoft YaHei'
|
||||||
// shadow and radius
|
// shadow and radius
|
||||||
$shadow ?= none
|
$shadow ?= none
|
||||||
$radius ?= 0
|
$radius ?= 0
|
||||||
|
|
|
@ -0,0 +1,3 @@
|
||||||
|
@import url(hexo-config('@fontface.default'))
|
||||||
|
|
||||||
|
@import 'style'
|
Loading…
Reference in New Issue