Hermes Skills Manager
6770bc9b9d
- Trading skills (OKX, dividend, lottery, quantitative) - Creative skills (ASCII art, diagrams, video) - Development skills (GitHub, debugging, TDD) - Research skills (arXiv, blog monitoring) - Productivity skills (email, documents, notes) - MCP integration skills - Custom user skills
85 lines
5.8 KiB
HTML
85 lines
5.8 KiB
HTML
<!DOCTYPE html>
|
|
<html><head><meta charset="utf-8"><style>
|
|
*{margin:0;padding:0;box-sizing:border-box}
|
|
body{background:#0d1117;display:flex;flex-direction:column;align-items:center;padding:20px;font-family:-apple-system,'PingFang SC','Noto Sans SC',sans-serif}
|
|
.card{width:420px;background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);border-radius:24px;padding:36px 28px;color:#fff;position:relative;overflow:hidden;margin-bottom:30px}
|
|
.card::before{content:'';position:absolute;top:-50%;right:-50%;width:100%;height:100%;background:radial-gradient(circle,rgba(0,212,170,0.08) 0%,transparent 70%)}
|
|
.tag{display:inline-block;background:rgba(0,212,170,0.15);color:#00d4aa;padding:4px 12px;border-radius:20px;font-size:12px;margin-bottom:16px}
|
|
h1{font-size:22px;line-height:1.4;margin-bottom:20px;color:#f0f0f0}
|
|
.section{margin:18px 0;padding:16px;background:rgba(255,255,255,0.04);border-radius:14px;border-left:3px solid #f0c040}
|
|
.section-title{color:#f0c040;font-size:14px;font-weight:700;margin-bottom:10px}
|
|
.row{display:flex;justify-content:space-between;align-items:center;padding:6px 0}
|
|
.label{color:#8b949e;font-size:13px}
|
|
.value{color:#00d4aa;font-size:15px;font-weight:700}
|
|
.value-warn{color:#f0c040;font-size:15px;font-weight:700}
|
|
.big-num{text-align:center;margin:20px 0}
|
|
.big-num .num{font-size:52px;font-weight:900;background:linear-gradient(135deg,#00d4aa,#f0c040);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
|
|
.big-num .unit{font-size:16px;color:#8b949e;margin-top:4px}
|
|
.ladder{display:flex;gap:8px;margin:12px 0}
|
|
.step{flex:1;text-align:center;padding:12px 4px;border-radius:12px;background:rgba(255,255,255,0.06)}
|
|
.step-n{font-size:11px;color:#8b949e;margin-bottom:4px}
|
|
.step-pct{font-size:22px;font-weight:900;color:#f0c040}
|
|
.step-label{font-size:11px;color:#666;margin-top:4px}
|
|
.divider{height:1px;background:rgba(255,255,255,0.08);margin:16px 0}
|
|
.footer{font-size:10px;color:#555;line-height:1.6;margin-top:20px}
|
|
.stock-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
|
|
.stock-item{padding:10px;background:rgba(255,255,255,0.04);border-radius:10px;text-align:center}
|
|
.stock-flag{font-size:20px}
|
|
.stock-name{font-size:12px;color:#ccc;margin-top:2px}
|
|
.stock-yield{font-size:18px;font-weight:900;color:#00d4aa}
|
|
.stock-sub{font-size:10px;color:#666}
|
|
</style></head><body>
|
|
|
|
<!-- 卡片1: 数据主题卡 -->
|
|
<div class="card">
|
|
<div class="tag">💰 懒人收息法</div>
|
|
<h1>月投7500港币<br>高息股阶梯买入</h1>
|
|
<div class="big-num"><div class="num">7.5%</div><div class="unit">平均股息率</div></div>
|
|
<div class="ladder">
|
|
<div class="step"><div class="step-n">第1档</div><div class="step-pct">40%</div><div class="step-label">现价买入</div></div>
|
|
<div class="step" style="border:1px solid rgba(240,192,64,0.3)"><div class="step-n">第2档</div><div class="step-pct">30%</div><div class="step-label">小跌加仓</div></div>
|
|
<div class="step"><div class="step-n">第3档</div><div class="step-pct">30%</div><div class="step-label">大跌抄底</div></div>
|
|
</div>
|
|
<div class="divider"></div>
|
|
<div class="section">
|
|
<div class="section-title">📊 收息预估</div>
|
|
<div class="row"><span class="label">年投</span><span class="value">90,000 港币</span></div>
|
|
<div class="row"><span class="label">第二年起年息</span><span class="value-warn">≈ 6,300</span></div>
|
|
<div class="row"><span class="label">第五年累计股息</span><span class="value-warn">≈ 22,000+</span></div>
|
|
</div>
|
|
<div class="footer">⚠️ 个人记录，不构成投资建议 · 股市有风险</div>
|
|
</div>
|
|
|
|
<!-- 卡片2: 持仓清单卡 -->
|
|
<div class="card">
|
|
<div class="tag">📋 我的DCA组合</div>
|
|
<h1>7只标的 · 3档阶梯</h1>
|
|
<div style="color:#f0c040;font-size:13px;font-weight:700;margin:16px 0 8px">🇭🇰 港股（防守型）</div>
|
|
<div class="stock-grid">
|
|
<div class="stock-item"><div class="stock-flag">🏦</div><div class="stock-name">某保险龙头</div><div class="stock-yield">5.4%</div><div class="stock-sub">PE<7 破净</div></div>
|
|
<div class="stock-item"><div class="stock-flag">🏛️</div><div class="stock-name">某银行龙头</div><div class="stock-yield">6.9%</div><div class="stock-sub">PE 7 破净</div></div>
|
|
</div>
|
|
<div class="stock-grid" style="margin-top:8px">
|
|
<div class="stock-item"><div class="stock-flag">📡</div><div class="stock-name">某电信央企</div><div class="stock-yield">6.1%</div><div class="stock-sub">破净</div></div>
|
|
<div></div>
|
|
</div>
|
|
<div class="divider"></div>
|
|
<div style="color:#f0c040;font-size:13px;font-weight:700;margin:16px 0 8px">🇺🇸 美股（收息型）</div>
|
|
<div class="stock-grid">
|
|
<div class="stock-item"><div class="stock-flag">🏠</div><div class="stock-name">某mREIT</div><div class="stock-yield">13.2%</div><div class="stock-sub">PE 7.7</div></div>
|
|
<div class="stock-item"><div class="stock-flag">🚀</div><div class="stock-name">某科技BDC</div><div class="stock-yield">10.5%</div><div class="stock-sub">PE 8.5</div></div>
|
|
</div>
|
|
<div class="stock-grid" style="margin-top:8px">
|
|
<div class="stock-item"><div class="stock-flag">💼</div><div class="stock-name">某最大BDC</div><div class="stock-yield">10.2%</div><div class="stock-sub">PE 11.7</div></div>
|
|
<div class="stock-item"><div class="stock-flag">📱</div><div class="stock-name">某电信巨头</div><div class="stock-yield">4.9%</div><div class="stock-sub">PE 7.5</div></div>
|
|
</div>
|
|
<div class="divider"></div>
|
|
<div class="section" style="border-left-color:#00d4aa">
|
|
<div class="section-title" style="color:#00d4aa">🎯 5条纪律</div>
|
|
<div style="font-size:13px;color:#ccc;line-height:2">① 每月固定操作 ② 没到价位不动<br>③ 股息复投 ④ 只选盈利高分红<br>⑤ 港美股各半</div>
|
|
</div>
|
|
<div class="footer">⚠️ 个人记录，不构成投资建议 · 💬 评论区交流</div>
|
|
</div>
|
|
|
|
</body></html>
|