Add files via upload

This commit is contained in:
ZhangJia
2026-01-18 21:56:39 +08:00
committed by GitHub
parent 47b5bb0eff
commit cef44fcea6
12 changed files with 1846 additions and 2 deletions

216
assets/card.html Normal file
View File

@@ -0,0 +1,216 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=1080">
<title>小红书卡片</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700;900&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Noto Sans SC', 'Source Han Sans CN', 'PingFang SC', 'Microsoft YaHei', sans-serif;
width: 1080px;
min-height: 1440px;
overflow: hidden;
background: transparent;
}
.card-container {
width: 1080px;
min-height: 1440px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
position: relative;
padding: 50px;
overflow: hidden;
}
.card-inner {
background: rgba(255, 255, 255, 0.95);
border-radius: 20px;
padding: 60px;
min-height: calc(1440px - 100px);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(10px);
}
/* Markdown 内容样式 */
.card-content {
color: #475569;
font-size: 42px;
line-height: 1.7;
}
.card-content h1 {
font-size: 72px;
font-weight: 700;
color: #1e293b;
margin-bottom: 40px;
line-height: 1.3;
}
.card-content h2 {
font-size: 56px;
font-weight: 600;
color: #334155;
margin: 50px 0 25px 0;
line-height: 1.4;
}
.card-content h3 {
font-size: 48px;
font-weight: 600;
color: #475569;
margin: 40px 0 20px 0;
}
.card-content p {
margin-bottom: 35px;
}
.card-content strong {
font-weight: 700;
color: #1e293b;
}
.card-content em {
font-style: italic;
color: #6366f1;
}
.card-content a {
color: #6366f1;
text-decoration: none;
border-bottom: 2px solid #6366f1;
}
.card-content ul,
.card-content ol {
margin: 30px 0;
padding-left: 60px;
}
.card-content li {
margin-bottom: 20px;
line-height: 1.6;
}
.card-content blockquote {
border-left: 8px solid #6366f1;
padding-left: 40px;
background: #f1f5f9;
padding-top: 25px;
padding-bottom: 25px;
padding-right: 30px;
margin: 35px 0;
color: #64748b;
font-style: italic;
border-radius: 0 12px 12px 0;
}
.card-content blockquote p {
margin: 0;
}
.card-content code {
background: #f1f5f9;
padding: 6px 16px;
border-radius: 8px;
font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;
font-size: 38px;
color: #6366f1;
}
.card-content pre {
background: #1e293b;
color: #e2e8f0;
padding: 40px;
border-radius: 16px;
margin: 35px 0;
overflow-x: visible;
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-all;
white-space: pre-wrap;
font-size: 36px;
line-height: 1.5;
}
.card-content pre code {
background: transparent;
color: inherit;
padding: 0;
font-size: inherit;
}
.card-content img {
max-width: 100%;
height: auto;
border-radius: 16px;
margin: 35px auto;
display: block;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.card-content hr {
border: none;
height: 2px;
background: #e2e8f0;
margin: 50px 0;
}
/* Tags 标签样式 */
.tags-container {
margin-top: 50px;
padding-top: 30px;
border-top: 2px solid #e2e8f0;
}
.tag {
display: inline-block;
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
color: white;
padding: 12px 28px;
border-radius: 30px;
font-size: 34px;
margin: 10px 15px 10px 0;
font-weight: 500;
}
/* 信息卡片样式 */
.info-card {
margin: 40px 0;
padding: 40px 50px;
background: linear-gradient(135deg, rgba(99, 102, 241, 0.12) 0%, rgba(139, 92, 246, 0.12) 100%);
border: 2px solid rgba(99, 102, 241, 0.2);
border-radius: 20px;
box-shadow: 0 4px 20px rgba(99, 102, 241, 0.1);
}
/* 页码样式 */
.page-number {
position: absolute;
bottom: 80px;
right: 80px;
font-size: 36px;
color: rgba(255, 255, 255, 0.8);
font-weight: 500;
}
</style>
</head>
<body>
<div class="card-container">
<div class="card-inner">
<div class="card-content">
{{CONTENT}}
</div>
</div>
<div class="page-number">{{PAGE_NUMBER}}</div>
</div>
</body>
</html>

82
assets/cover.html Normal file
View File

@@ -0,0 +1,82 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=1080, height=1440">
<title>小红书封面</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700;900&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Noto Sans SC', 'Source Han Sans CN', 'PingFang SC', 'Microsoft YaHei', sans-serif;
width: 1080px;
height: 1440px;
overflow: hidden;
}
.cover-container {
width: 1080px;
height: 1440px;
background: linear-gradient(180deg, #3450E4 0%, #D266DA 100%);
position: relative;
overflow: hidden;
}
.cover-inner {
position: absolute;
width: 950px;
height: 1310px;
left: 65px;
top: 65px;
background: #F3F3F3;
border-radius: 25px;
display: flex;
flex-direction: column;
padding: 80px 85px;
}
.cover-emoji {
font-size: 180px;
line-height: 1.2;
margin-bottom: 50px;
}
.cover-title {
font-weight: 900;
font-size: 130px;
line-height: 1.4;
background: linear-gradient(180deg, #2E67B1 0%, #4C4C4C 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
flex: 1;
display: flex;
align-items: flex-start;
word-break: break-all;
}
.cover-subtitle {
font-weight: 350;
font-size: 72px;
line-height: 1.4;
color: #000000;
margin-top: auto;
}
</style>
</head>
<body>
<div class="cover-container">
<div class="cover-inner">
<div class="cover-emoji">{{EMOJI}}</div>
<div class="cover-title">{{TITLE}}</div>
<div class="cover-subtitle">{{SUBTITLE}}</div>
</div>
</div>
</body>
</html>

57
assets/example.md Normal file
View File

@@ -0,0 +1,57 @@
---
emoji: "🚀"
title: "5个效率神器"
subtitle: "让工作效率翻倍"
---
## 神器一Notion 📝
全能型笔记工具,支持数据库、看板、日历等多种视图。
> 一个工具替代十个 App笔记、任务、项目管理全搞定
**核心功能:**
- 📊 灵活的数据库视图
- 🔗 双向链接
- 🎨 丰富的模板库
- 👥 团队协作
---
## 神器二Raycast ⚡
Mac 上的效率启动器,比 Spotlight 强大 100 倍!
**必装插件推荐:**
- 剪贴板历史
- 窗口管理
- 快捷短语
- API 调试工具
一键搜索、快速启动,让你的 Mac 飞起来 ✈️
---
## 神器三Arc 浏览器 🌈
重新定义浏览器体验:
- 侧边栏标签管理
- 空间分组功能
- 内置笔记和画板
- 极简无干扰模式
告别标签栏焦虑,专注当下任务!
---
## 总结 🎯
效率提升不在于工具多少,而在于是否**真正用起来**。
选择 2-3 个适合自己的工具,持续使用,形成习惯,你就能:
✅ 节省 50% 的时间
✅ 减少 80% 的焦虑
✅ 提升 100% 的专注力
#效率工具 #生产力 #Mac软件 #工作技巧 #神器推荐 #Notion #Raycast #Arc浏览器

318
assets/styles.css Normal file
View File

@@ -0,0 +1,318 @@
/* 小红书卡片样式 */
/* CSS 变量定义 */
:root {
--primary-color: #ff2442;
--primary-light: #ff6b81;
--text-primary: #1e293b;
--text-secondary: #334155;
--text-muted: #64748b;
--text-light: #475569;
--background-light: #f8fafc;
--background-gray: #f1f5f9;
--border-color: #e2e8f0;
--border-radius: 25px;
--card-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
--font-family: 'Source Han Sans CN', 'PingFang SC', 'Microsoft YaHei', -apple-system, sans-serif;
}
/* 全局样式重置 */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: var(--font-family);
background: transparent;
color: var(--text-secondary);
line-height: 1.6;
}
/* ========================
封面卡片样式
======================== */
.cover-container {
width: 1080px;
height: 1440px;
background: linear-gradient(180deg, #3450E4 0%, #D266DA 100%);
position: relative;
overflow: hidden;
}
.cover-inner {
position: absolute;
width: 950px;
height: 1310px;
left: 65px;
top: 65px;
background: #F3F3F3;
border-radius: var(--border-radius);
display: flex;
flex-direction: column;
padding: 60px 85px;
}
.cover-emoji {
font-size: 180px;
line-height: 1.2;
margin-bottom: 40px;
}
.cover-title {
font-weight: 900;
font-size: 130px;
line-height: 1.35;
background: linear-gradient(180deg, #2E67B1 0%, #4C4C4C 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
margin-bottom: auto;
word-break: break-all;
}
.cover-subtitle {
font-weight: 350;
font-size: 72px;
line-height: 1.4;
color: #000000;
margin-top: auto;
padding-bottom: 20px;
}
/* ========================
正文卡片样式
======================== */
.card-container {
width: 1080px;
min-height: 1440px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
position: relative;
padding: 50px;
overflow: hidden;
}
.card-inner {
background: rgba(255, 255, 255, 0.95);
border-radius: 20px;
padding: 60px;
min-height: calc(1440px - 100px);
box-shadow: var(--card-shadow);
backdrop-filter: blur(10px);
}
/* Markdown 内容样式 */
.card-content {
color: var(--text-light);
font-size: 42px;
line-height: 1.7;
}
.card-content h1 {
font-size: 72px;
font-weight: 700;
color: var(--text-primary);
margin-bottom: 40px;
line-height: 1.3;
}
.card-content h2 {
font-size: 56px;
font-weight: 600;
color: var(--text-secondary);
margin: 50px 0 25px 0;
line-height: 1.4;
}
.card-content h3 {
font-size: 48px;
font-weight: 600;
color: var(--text-light);
margin: 40px 0 20px 0;
}
.card-content p {
margin-bottom: 35px;
}
.card-content strong {
font-weight: 700;
color: var(--text-primary);
}
.card-content em {
font-style: italic;
color: var(--primary-color);
}
.card-content a {
color: var(--primary-color);
text-decoration: none;
border-bottom: 2px solid var(--primary-color);
}
.card-content ul,
.card-content ol {
margin: 30px 0;
padding-left: 60px;
}
.card-content li {
margin-bottom: 20px;
line-height: 1.6;
}
.card-content blockquote {
border-left: 8px solid var(--primary-color);
padding-left: 40px;
background: var(--background-gray);
padding-top: 25px;
padding-bottom: 25px;
margin: 35px 0;
color: var(--text-muted);
font-style: italic;
border-radius: 0 12px 12px 0;
}
.card-content blockquote p {
margin: 0;
}
.card-content code {
background: var(--background-gray);
padding: 6px 16px;
border-radius: 8px;
font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;
font-size: 38px;
color: var(--primary-color);
}
.card-content pre {
background: var(--text-primary);
color: #e2e8f0;
padding: 40px;
border-radius: 16px;
margin: 35px 0;
overflow-x: visible;
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-all;
white-space: pre-wrap;
font-size: 36px;
line-height: 1.5;
}
.card-content pre code {
background: transparent;
color: inherit;
padding: 0;
font-size: inherit;
}
.card-content img {
max-width: 100%;
height: auto;
border-radius: 16px;
margin: 35px auto;
display: block;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.card-content hr {
border: none;
height: 2px;
background: var(--border-color);
margin: 50px 0;
}
/* Tags 标签样式 */
.card-content .tags {
margin-top: 50px;
padding-top: 30px;
border-top: 2px solid var(--border-color);
}
.card-content .tag {
display: inline-block;
background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-light) 100%);
color: white;
padding: 12px 28px;
border-radius: 30px;
font-size: 34px;
margin: 10px 15px 10px 0;
font-weight: 500;
}
/* 信息卡片样式 */
.info-card {
margin: 40px 0;
padding: 40px 50px;
background: linear-gradient(135deg, rgba(99, 102, 241, 0.12) 0%, rgba(139, 92, 246, 0.12) 100%);
border: 2px solid rgba(99, 102, 241, 0.2);
border-radius: 20px;
box-shadow: 0 4px 20px rgba(99, 102, 241, 0.1);
}
.info-card.success {
background: linear-gradient(135deg, rgba(16, 185, 129, 0.12) 0%, rgba(5, 150, 105, 0.12) 100%);
border-color: rgba(16, 185, 129, 0.2);
}
.info-card.warning {
background: linear-gradient(135deg, rgba(245, 158, 11, 0.12) 0%, rgba(217, 119, 6, 0.12) 100%);
border-color: rgba(245, 158, 11, 0.2);
}
.info-card.error {
background: linear-gradient(135deg, rgba(239, 68, 68, 0.12) 0%, rgba(220, 38, 38, 0.12) 100%);
border-color: rgba(239, 68, 68, 0.2);
}
/* 页码样式 */
.page-number {
position: absolute;
bottom: 80px;
right: 80px;
font-size: 36px;
color: rgba(255, 255, 255, 0.8);
font-weight: 500;
}
/* ========================
渐变背景预设
======================== */
.bg-gradient-1 {
background: linear-gradient(180deg, #3450E4 0%, #D266DA 100%);
}
.bg-gradient-2 {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.bg-gradient-3 {
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}
.bg-gradient-4 {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}
.bg-gradient-5 {
background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
}
.bg-gradient-6 {
background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
}
.bg-gradient-7 {
background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%);
}
.bg-gradient-8 {
background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
}