mirror of
https://github.com/jerryc127/hexo-theme-butterfly.git
synced 2026-04-10 21:17:07 +08:00
fix(tagcloud): independent tags page and card_tags, drop colormode, use inline css, keep tag-color classes
This commit is contained in:
@@ -1,3 +1,2 @@
|
|||||||
- let { colormode, custom_colors } = theme.aside.card_tags
|
|
||||||
.tag-cloud-list.text-center
|
.tag-cloud-list.text-center
|
||||||
!=cloudTags({source: site.tags, orderby: page.orderby || 'random', order: page.order || 1, minfontsize: 1.2, maxfontsize: 1.5, limit: 0, unit: 'em', colormode: colormode, custom_colors: custom_colors})
|
!=cloudTags({source: site.tags, orderby: page.orderby || 'random', order: page.order || 1, minfontsize: 1.2, maxfontsize: 1.5, limit: 0, unit: 'em', custom_colors: page.custom_colors})
|
||||||
|
|||||||
@@ -5,10 +5,10 @@ if theme.aside.card_tags.enable
|
|||||||
i.fas.fa-tags
|
i.fas.fa-tags
|
||||||
span= _p('aside.card_tags')
|
span= _p('aside.card_tags')
|
||||||
|
|
||||||
- let { limit, orderby, order, colormode, custom_colors } = theme.aside.card_tags
|
- let { limit, orderby, order, custom_colors } = theme.aside.card_tags
|
||||||
- limit = limit === 0 ? 0 : limit || 40
|
- limit = limit === 0 ? 0 : limit || 40
|
||||||
|
|
||||||
if theme.aside.card_tags.color
|
if theme.aside.card_tags.color
|
||||||
.card-tag-cloud!= cloudTags({source: site.tags, orderby: orderby, order: order, minfontsize: 1.15, maxfontsize: 1.45, limit: limit, unit: 'em', page: 'index', colormode: colormode, custom_colors: custom_colors})
|
.card-tag-cloud!= cloudTags({source: site.tags, orderby: orderby, order: order, minfontsize: 1.15, maxfontsize: 1.45, limit: limit, unit: 'em', page: 'index', custom_colors: custom_colors})
|
||||||
else
|
else
|
||||||
.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'})
|
.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'})
|
||||||
|
|||||||
@@ -179,6 +179,7 @@ module.exports = {
|
|||||||
enable: true,
|
enable: true,
|
||||||
limit: 40,
|
limit: 40,
|
||||||
color: false,
|
color: false,
|
||||||
|
custom_colors: null,
|
||||||
orderby: 'random',
|
orderby: 'random',
|
||||||
order: 1,
|
order: 1,
|
||||||
sort_order: null
|
sort_order: null
|
||||||
|
|||||||
@@ -19,7 +19,7 @@ hexo.extend.helper.register('postDesc', data => {
|
|||||||
|
|
||||||
hexo.extend.helper.register('cloudTags', function (options = {}) {
|
hexo.extend.helper.register('cloudTags', function (options = {}) {
|
||||||
const env = this
|
const env = this
|
||||||
let { source, minfontsize, maxfontsize, limit, unit = 'px', orderby, order, page = 'tags', colormode, custom_colors } = options
|
let { source, minfontsize, maxfontsize, limit, unit = 'px', orderby, order, page = 'tags', custom_colors } = options
|
||||||
|
|
||||||
if (limit > 0) {
|
if (limit > 0) {
|
||||||
source = source.limit(limit)
|
source = source.limit(limit)
|
||||||
@@ -60,8 +60,6 @@ hexo.extend.helper.register('cloudTags', function (options = {}) {
|
|||||||
|
|
||||||
const resolveColorClass = (idx) => `tag-color-${idx % userColors.length}`
|
const resolveColorClass = (idx) => `tag-color-${idx % userColors.length}`
|
||||||
|
|
||||||
const generateSizeStyle = (size, unit) => `font-size: ${parseFloat(size.toFixed(2))}${unit};`
|
|
||||||
|
|
||||||
const generateStyle = (size, unit, page, color) => {
|
const generateStyle = (size, unit, page, color) => {
|
||||||
const colorStyle = page === 'tags' ? `background-color: ${color};` : `color: ${color};`
|
const colorStyle = page === 'tags' ? `background-color: ${color};` : `color: ${color};`
|
||||||
return `font-size: ${parseFloat(size.toFixed(2))}${unit}; ${colorStyle}`
|
return `font-size: ${parseFloat(size.toFixed(2))}${unit}; ${colorStyle}`
|
||||||
@@ -71,9 +69,10 @@ hexo.extend.helper.register('cloudTags', function (options = {}) {
|
|||||||
const ratio = length ? sizeMap.get(tag.length) / length : 0
|
const ratio = length ? sizeMap.get(tag.length) / length : 0
|
||||||
const size = minfontsize + ((maxfontsize - minfontsize) * ratio)
|
const size = minfontsize + ((maxfontsize - minfontsize) * ratio)
|
||||||
|
|
||||||
if (colormode === 'custom' && userColors && userColors.length) {
|
if (userColors && userColors.length) {
|
||||||
const colorClass = resolveColorClass(idx)
|
const colorClass = resolveColorClass(idx)
|
||||||
const style = generateSizeStyle(size, unit)
|
const color = userColors[idx % userColors.length]
|
||||||
|
const style = generateStyle(size, unit, page, color)
|
||||||
return `<a href="${env.url_for(tag.path)}" class="tag-cloud-item ${colorClass}" style="${style}">${tag.name}</a>`
|
return `<a href="${env.url_for(tag.path)}" class="tag-cloud-item ${colorClass}" style="${style}">${tag.name}</a>`
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -89,16 +89,3 @@
|
|||||||
.page-title
|
.page-title
|
||||||
& + .tag-cloud-list
|
& + .tag-cloud-list
|
||||||
text-align: left
|
text-align: left
|
||||||
|
|
||||||
tag_colors = hexo-config('aside.card_tags.custom_colors')
|
|
||||||
|
|
||||||
.tag-cloud-list .tag-cloud-item
|
|
||||||
background-color var(--tag-cloud-color)
|
|
||||||
|
|
||||||
.card-tag-cloud .tag-cloud-item
|
|
||||||
color var(--tag-cloud-color)
|
|
||||||
|
|
||||||
if tag_colors && length(tag_colors) > 0
|
|
||||||
for c, i in tag_colors
|
|
||||||
.tag-cloud-item.tag-color-{i}
|
|
||||||
--tag-cloud-color convert(c)
|
|
||||||
|
|||||||
Reference in New Issue
Block a user