新增认证图标颜色自定义

This commit is contained in:
Yeban8090 2025-04-17 16:31:19 +08:00
parent 7ae27d710d
commit 4aa63b141f
5 changed files with 39 additions and 13 deletions

View file

@ -1,7 +1,7 @@
# Note to RED
一键将 Obsidian 笔记转换为小红书图片格式的插件。
![downloads](https://img.shields.io/badge/downloads-1K-brightgreen) ![version](https://img.shields.io/badge/version-1.0.5-blue) ![license](https://img.shields.io/badge/license-MIT-green) [![Buy Me a Coffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-支持作者-yellow)](https://ko-fi.com/bruceyeban)
![downloads](https://img.shields.io/badge/downloads-1K-brightgreen) ![version](https://img.shields.io/badge/version-1.0.6-blue) ![license](https://img.shields.io/badge/license-MIT-green) [![Buy Me a Coffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-支持作者-yellow)](https://ko-fi.com/bruceyeban)
## 功能特点
- 📝 使用二级标题分割内容,每个标题自动生成一张配图

View file

@ -1,7 +1,7 @@
{
"id": "note-to-red",
"name": "Note to RED",
"version": "1.0.5",
"version": "1.0.6",
"minAppVersion": "0.15.0",
"description": "Convert Markdown notes to RED (Xiaohongshu) style images",
"author": "Yeban",

4
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "note-to-red",
"version": "1.0.5",
"version": "1.0.6",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "note-to-red",
"version": "1.0.5",
"version": "1.0.6",
"license": "MIT",
"dependencies": {
"dom-to-image": "^2.6.0",

View file

@ -1,6 +1,6 @@
{
"name": "note-to-red",
"version": "1.0.5",
"version": "1.0.6",
"description": "一键将 Obsidian 笔记转换为小红书图片格式",
"main": "main.js",
"scripts": {

View file

@ -550,22 +550,48 @@ export class CreateThemeModal extends Modal {
const currentColor = styles.userName.match(/color:\s*(#[a-fA-F0-9]+)/)?.[1];
color.setValue(currentColor)
.onChange(value => {
// 更新所有颜色相关的样式
['userName', 'userId', 'postTime'].forEach(key => {
styles[key] = styles[key].replace(/color:\s*#[a-fA-F0-9]+/, `color: ${value}`);
});
// 更新验证图标
styles.verifiedIcon = styles.verifiedIcon
.replace(/background:\s*linear-gradient\([^)]+\)/, `background: linear-gradient(135deg, ${value}, ${value})`)
.replace(/border:\s*1px solid\s*#[a-fA-F0-9]+80/, `border: 1px solid ${value}80`);
// 更新头像容器
styles.avatar.container = styles.avatar.container
.replace(/box-shadow:\s*0\s*4px\s*16px\s*[^;]+/, `box-shadow: 0 4px 16px ${value}1a`)
.replace(/border:\s*1px solid\s*#[a-fA-F0-9]+80/, `border: 1px solid ${value}80`);
});
});
new Setting(headerSection)
.setName('认证图标颜色')
.setDesc('设置认证(已验证)图标的主色')
.addColorPicker(color => {
// 兼容 background: linear-gradient(...) 和 background-color: ...
let currentColor = '#b87333';
const bgMatch = styles.verifiedIcon.match(/background:\s*linear-gradient\([^,]+,\s*(#[a-fA-F0-9]+)/);
if (bgMatch) {
currentColor = bgMatch[1];
} else {
const colorMatch = styles.verifiedIcon.match(/background-color:\s*(#[a-fA-F0-9]+)/);
if (colorMatch) {
currentColor = colorMatch[1];
}
}
color.setValue(currentColor)
.onChange(value => {
// 先处理 linear-gradient
if (styles.verifiedIcon.includes('linear-gradient')) {
styles.verifiedIcon = styles.verifiedIcon
.replace(/background:\s*linear-gradient\([^)]+\)/, `background: linear-gradient(135deg, ${value}, ${value})`);
}
// 再处理 background-color
if (styles.verifiedIcon.includes('background-color')) {
styles.verifiedIcon = styles.verifiedIcon
.replace(/background-color:\s*#[a-fA-F0-9]+/, `background-color: ${value}`);
}
// 统一处理 border 和 box-shadow
styles.verifiedIcon = styles.verifiedIcon
.replace(/border:\s*1px solid\s*#[a-fA-F0-9]+80/, `border: 1px solid ${value}80`)
.replace(/box-shadow:\s*0 2px 8px [^;]+;/, `box-shadow: 0 2px 8px ${value}1a;`);
});
});
}
private addTitleSettings(container: HTMLElement, styles: any) {