1 line
17 KiB
JSON
1 line
17 KiB
JSON
{"repo": "attack-flower/obsidian-fastnote-clipper", "files": {"src/settings/settings.html": {"c00acd05678c4dd4ef83ba351b7311eebdd9255b": {"t": 1785746444.8392017, "n": 7682, "h": "9e7144477590b446", "c": "<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Obsidian Clipper 设置</title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n\n body {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n background: #0f0f1a;\n color: #e0e0e0;\n min-height: 100vh;\n }\n\n .container {\n max-width: 620px;\n margin: 0 auto;\n padding: 32px 24px;\n }\n\n .header {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 32px;\n }\n\n .logo {\n width: 36px;\n height: 36px;\n background: linear-gradient(135deg, #7c3aed, #4f46e5);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 20px;\n }\n\n .header h1 { font-size: 20px; font-weight: 700; color: #fff; }\n .header p { font-size: 12px; color: #666; margin-top: 2px; }\n\n .section {\n background: #16213e;\n border: 1px solid #2d2d4e;\n border-radius: 12px;\n padding: 20px;\n margin-bottom: 16px;\n }\n\n .section h2 {\n font-size: 13px;\n font-weight: 600;\n color: #a78bfa;\n text-transform: uppercase;\n letter-spacing: 0.08em;\n margin-bottom: 16px;\n }\n\n .field {\n margin-bottom: 16px;\n }\n\n .field:last-child { margin-bottom: 0; }\n\n .field label {\n display: block;\n font-size: 13px;\n font-weight: 500;\n color: #ccc;\n margin-bottom: 6px;\n }\n\n .field .hint {\n font-size: 11px;\n color: #666;\n margin-top: 4px;\n line-height: 1.4;\n }\n\n input[type=\"text\"], input[type=\"password\"] {\n width: 100%;\n background: #0f0f1a;\n border: 1px solid #2d2d4e;\n color: #e0e0e0;\n padding: 9px 12px;\n border-radius: 7px;\n font-size: 13px;\n outline: none;\n transition: border-color 0.2s;\n font-family: inherit;\n }\n\n input[type=\"text\"]:focus, input[type=\"password\"]:focus {\n border-color: #7c3aed;\n }\n\n .toggle-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .toggle-row .left { flex: 1; }\n .toggle-row .left label { margin-bottom: 2px; }\n\n .toggle {\n position: relative;\n width: 40px;\n height: 22px;\n flex-shrink: 0;\n }\n\n .toggle input { opacity: 0; width: 0; height: 0; }\n\n .toggle-slider {\n position: absolute;\n cursor: pointer;\n top: 0; left: 0; right: 0; bottom: 0;\n background: #2d2d4e;\n border-radius: 22px;\n transition: 0.2s;\n }\n\n .toggle-slider:before {\n content: '';\n position: absolute;\n width: 16px; height: 16px;\n left: 3px; top: 3px;\n background: #888;\n border-radius: 50%;\n transition: 0.2s;\n }\n\n input:checked + .toggle-slider { background: #7c3aed; }\n input:checked + .toggle-slider:before {\n transform: translateX(18px);\n background: #fff;\n }\n\n .ai-fields {\n display: none;\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #2d2d4e;\n }\n\n .ai-fields.visible { display: block; }\n\n .save-btn {\n width: 100%;\n background: linear-gradient(135deg, #7c3aed, #4f46e5);\n color: white;\n border: none;\n padding: 12px;\n border-radius: 8px;\n font-size: 14px;\n font-weight: 600;\n cursor: pointer;\n margin-top: 8px;\n transition: opacity 0.2s;\n }\n\n .save-btn:hover { opacity: 0.9; }\n\n .save-status {\n text-align: center;\n font-size: 13px;\n color: #86efac;\n margin-top: 10px;\n height: 20px;\n }\n\n .categories-input {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n margin-top: 8px;\n }\n\n .cat-tag {\n background: #2d1b69;\n color: #a78bfa;\n font-size: 12px;\n padding: 4px 10px;\n border-radius: 100px;\n display: flex;\n align-items: center;\n gap: 4px;\n }\n\n .cat-tag .remove {\n cursor: pointer;\n color: #888;\n font-size: 14px;\n line-height: 1;\n }\n\n .cat-tag .remove:hover { color: #f87171; }\n\n .add-cat-row {\n display: flex;\n gap: 8px;\n margin-top: 8px;\n }\n\n .add-cat-row input {\n flex: 1;\n }\n\n .add-cat-btn {\n background: #2d1b69;\n color: #a78bfa;\n border: 1px solid #4c1d95;\n padding: 8px 14px;\n border-radius: 7px;\n font-size: 13px;\n cursor: pointer;\n white-space: nowrap;\n }\n\n .add-cat-btn:hover { background: #3d2b79; }\n </style>\n</head>\n<body>\n <div class=\"container\">\n <div class=\"header\">\n <div class=\"logo\">📎</div>\n <div>\n <h1>Obsidian Clipper 设置</h1>\n <p>通过 Fast Note Sync API 同步到 Obsidian</p>\n </div>\n </div>\n\n <!-- Fast Note Sync API 配置 -->\n <div class=\"section\">\n <h2>🌐 Fast Note Sync API</h2>\n\n <div class=\"field\">\n <label>服务器地址</label>\n <input type=\"text\" id=\"serverUrl\" placeholder=\"https://your-server.example.com\">\n <p class=\"hint\">你的 Fast Note Sync 服务器地址，需要配置 HTTPS</p>\n </div>\n\n <div class=\"field\">\n <label>API Token</label>\n <input type=\"password\" id=\"apiToken\" placeholder=\"你的 Token\">\n <p class=\"hint\">在 Fast Note Sync 管理面板中生成 API Token</p>\n </div>\n\n <div class=\"field\">\n <label>Vault 名称</label>\n <input type=\"text\" id=\"vaultName\" placeholder=\"我的知识库\">\n <p class=\"hint\">在 Obsidian 中配置的 vault 名称</p>\n </div>\n </div>\n\n <!-- 剪藏配置 -->\n <div class=\"section\">\n <h2>📁 剪藏路径</h2>\n\n <div class=\"field\">\n <label>剪藏文件夹名</label>\n <input type=\"text\" id=\"clippingsFolder\" placeholder=\"Clippings\">\n <p class=\"hint\">相对于 vault 根目录的文件夹名，默认为 Clippings</p>\n </div>\n </div>\n\n <!-- 自定义分类 -->\n <div class=\"section\">\n <h2>🏷️ 自动分类</h2>\n\n <div class=\"field\">\n <label>内置分类</label>\n <p class=\"hint\" style=\"margin-top:0\">技术 · AI · 设计 · 产品 · 商业 · 知识 · 新闻 · 影音 · 人文 · 健康 · 生活 · 未分类</p>\n </div>\n\n <div class=\"field\">\n <label>自定义分类</label>\n <div class=\"categories-input\" id=\"categoryTags\"></div>\n <div class=\"add-cat-row\">\n <input type=\"text\" id=\"newCategoryInput\" placeholder=\"输入新分类名，按回车添加\">\n <button class=\"add-cat-btn\" id=\"addCategoryBtn\">添加</button>\n </div>\n </div>\n </div>\n\n <!-- AI 增强 -->\n <div class=\"section\">\n <h2>✨ AI 增强（可选）</h2>\n\n <div class=\"toggle-row\">\n <div class=\"left\">\n <label>启用 AI 摘要和标签</label>\n <p class=\"hint\" style=\"margin-top:0\">自动生成摘要、打标签，提升笔记质量</p>\n </div>\n <label class=\"toggle\">\n <input type=\"checkbox\" id=\"aiEnabled\">\n <span class=\"toggle-slider\"></span>\n </label>\n </div>\n\n <div class=\"ai-fields\" id=\"aiFields\">\n <div class=\"field\">\n <label>API Base URL</label>\n <input type=\"text\" id=\"aiBaseUrl\" placeholder=\"https://api.openai.com/v1\">\n <p class=\"hint\">兼容 OpenAI 格式的接口，支持 DeepSeek、Moonshot 等</p>\n </div>\n <div class=\"field\">\n <label>API Key</label>\n <input type=\"password\" id=\"aiApiKey\" placeholder=\"sk-...\">\n </div>\n <div class=\"field\">\n <label>模型</label>\n <input type=\"text\" id=\"aiModel\" placeholder=\"gpt-3.5-turbo\">\n <p class=\"hint\">推荐使用轻量模型降低费用，如 deepseek-chat</p>\n </div>\n </div>\n </div>\n\n <button class=\"save-btn\" id=\"saveBtn\">保存设置</button>\n <div class=\"save-status\" id=\"saveStatus\"></div>\n </div>\n\n <script src=\"settings.js\"></script>\n</body>\n</html>\n"}, "6e51c17f8a472c9f38099fa57cd8f6a1ea2a9938": {"t": 1785764319.4514718, "n": 7682, "h": "9e7144477590b446", "c": "<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Obsidian Clipper 设置</title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n\n body {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n background: #0f0f1a;\n color: #e0e0e0;\n min-height: 100vh;\n }\n\n .container {\n max-width: 620px;\n margin: 0 auto;\n padding: 32px 24px;\n }\n\n .header {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 32px;\n }\n\n .logo {\n width: 36px;\n height: 36px;\n background: linear-gradient(135deg, #7c3aed, #4f46e5);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 20px;\n }\n\n .header h1 { font-size: 20px; font-weight: 700; color: #fff; }\n .header p { font-size: 12px; color: #666; margin-top: 2px; }\n\n .section {\n background: #16213e;\n border: 1px solid #2d2d4e;\n border-radius: 12px;\n padding: 20px;\n margin-bottom: 16px;\n }\n\n .section h2 {\n font-size: 13px;\n font-weight: 600;\n color: #a78bfa;\n text-transform: uppercase;\n letter-spacing: 0.08em;\n margin-bottom: 16px;\n }\n\n .field {\n margin-bottom: 16px;\n }\n\n .field:last-child { margin-bottom: 0; }\n\n .field label {\n display: block;\n font-size: 13px;\n font-weight: 500;\n color: #ccc;\n margin-bottom: 6px;\n }\n\n .field .hint {\n font-size: 11px;\n color: #666;\n margin-top: 4px;\n line-height: 1.4;\n }\n\n input[type=\"text\"], input[type=\"password\"] {\n width: 100%;\n background: #0f0f1a;\n border: 1px solid #2d2d4e;\n color: #e0e0e0;\n padding: 9px 12px;\n border-radius: 7px;\n font-size: 13px;\n outline: none;\n transition: border-color 0.2s;\n font-family: inherit;\n }\n\n input[type=\"text\"]:focus, input[type=\"password\"]:focus {\n border-color: #7c3aed;\n }\n\n .toggle-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .toggle-row .left { flex: 1; }\n .toggle-row .left label { margin-bottom: 2px; }\n\n .toggle {\n position: relative;\n width: 40px;\n height: 22px;\n flex-shrink: 0;\n }\n\n .toggle input { opacity: 0; width: 0; height: 0; }\n\n .toggle-slider {\n position: absolute;\n cursor: pointer;\n top: 0; left: 0; right: 0; bottom: 0;\n background: #2d2d4e;\n border-radius: 22px;\n transition: 0.2s;\n }\n\n .toggle-slider:before {\n content: '';\n position: absolute;\n width: 16px; height: 16px;\n left: 3px; top: 3px;\n background: #888;\n border-radius: 50%;\n transition: 0.2s;\n }\n\n input:checked + .toggle-slider { background: #7c3aed; }\n input:checked + .toggle-slider:before {\n transform: translateX(18px);\n background: #fff;\n }\n\n .ai-fields {\n display: none;\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #2d2d4e;\n }\n\n .ai-fields.visible { display: block; }\n\n .save-btn {\n width: 100%;\n background: linear-gradient(135deg, #7c3aed, #4f46e5);\n color: white;\n border: none;\n padding: 12px;\n border-radius: 8px;\n font-size: 14px;\n font-weight: 600;\n cursor: pointer;\n margin-top: 8px;\n transition: opacity 0.2s;\n }\n\n .save-btn:hover { opacity: 0.9; }\n\n .save-status {\n text-align: center;\n font-size: 13px;\n color: #86efac;\n margin-top: 10px;\n height: 20px;\n }\n\n .categories-input {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n margin-top: 8px;\n }\n\n .cat-tag {\n background: #2d1b69;\n color: #a78bfa;\n font-size: 12px;\n padding: 4px 10px;\n border-radius: 100px;\n display: flex;\n align-items: center;\n gap: 4px;\n }\n\n .cat-tag .remove {\n cursor: pointer;\n color: #888;\n font-size: 14px;\n line-height: 1;\n }\n\n .cat-tag .remove:hover { color: #f87171; }\n\n .add-cat-row {\n display: flex;\n gap: 8px;\n margin-top: 8px;\n }\n\n .add-cat-row input {\n flex: 1;\n }\n\n .add-cat-btn {\n background: #2d1b69;\n color: #a78bfa;\n border: 1px solid #4c1d95;\n padding: 8px 14px;\n border-radius: 7px;\n font-size: 13px;\n cursor: pointer;\n white-space: nowrap;\n }\n\n .add-cat-btn:hover { background: #3d2b79; }\n </style>\n</head>\n<body>\n <div class=\"container\">\n <div class=\"header\">\n <div class=\"logo\">📎</div>\n <div>\n <h1>Obsidian Clipper 设置</h1>\n <p>通过 Fast Note Sync API 同步到 Obsidian</p>\n </div>\n </div>\n\n <!-- Fast Note Sync API 配置 -->\n <div class=\"section\">\n <h2>🌐 Fast Note Sync API</h2>\n\n <div class=\"field\">\n <label>服务器地址</label>\n <input type=\"text\" id=\"serverUrl\" placeholder=\"https://your-server.example.com\">\n <p class=\"hint\">你的 Fast Note Sync 服务器地址，需要配置 HTTPS</p>\n </div>\n\n <div class=\"field\">\n <label>API Token</label>\n <input type=\"password\" id=\"apiToken\" placeholder=\"你的 Token\">\n <p class=\"hint\">在 Fast Note Sync 管理面板中生成 API Token</p>\n </div>\n\n <div class=\"field\">\n <label>Vault 名称</label>\n <input type=\"text\" id=\"vaultName\" placeholder=\"我的知识库\">\n <p class=\"hint\">在 Obsidian 中配置的 vault 名称</p>\n </div>\n </div>\n\n <!-- 剪藏配置 -->\n <div class=\"section\">\n <h2>📁 剪藏路径</h2>\n\n <div class=\"field\">\n <label>剪藏文件夹名</label>\n <input type=\"text\" id=\"clippingsFolder\" placeholder=\"Clippings\">\n <p class=\"hint\">相对于 vault 根目录的文件夹名，默认为 Clippings</p>\n </div>\n </div>\n\n <!-- 自定义分类 -->\n <div class=\"section\">\n <h2>🏷️ 自动分类</h2>\n\n <div class=\"field\">\n <label>内置分类</label>\n <p class=\"hint\" style=\"margin-top:0\">技术 · AI · 设计 · 产品 · 商业 · 知识 · 新闻 · 影音 · 人文 · 健康 · 生活 · 未分类</p>\n </div>\n\n <div class=\"field\">\n <label>自定义分类</label>\n <div class=\"categories-input\" id=\"categoryTags\"></div>\n <div class=\"add-cat-row\">\n <input type=\"text\" id=\"newCategoryInput\" placeholder=\"输入新分类名，按回车添加\">\n <button class=\"add-cat-btn\" id=\"addCategoryBtn\">添加</button>\n </div>\n </div>\n </div>\n\n <!-- AI 增强 -->\n <div class=\"section\">\n <h2>✨ AI 增强（可选）</h2>\n\n <div class=\"toggle-row\">\n <div class=\"left\">\n <label>启用 AI 摘要和标签</label>\n <p class=\"hint\" style=\"margin-top:0\">自动生成摘要、打标签，提升笔记质量</p>\n </div>\n <label class=\"toggle\">\n <input type=\"checkbox\" id=\"aiEnabled\">\n <span class=\"toggle-slider\"></span>\n </label>\n </div>\n\n <div class=\"ai-fields\" id=\"aiFields\">\n <div class=\"field\">\n <label>API Base URL</label>\n <input type=\"text\" id=\"aiBaseUrl\" placeholder=\"https://api.openai.com/v1\">\n <p class=\"hint\">兼容 OpenAI 格式的接口，支持 DeepSeek、Moonshot 等</p>\n </div>\n <div class=\"field\">\n <label>API Key</label>\n <input type=\"password\" id=\"aiApiKey\" placeholder=\"sk-...\">\n </div>\n <div class=\"field\">\n <label>模型</label>\n <input type=\"text\" id=\"aiModel\" placeholder=\"gpt-3.5-turbo\">\n <p class=\"hint\">推荐使用轻量模型降低费用，如 deepseek-chat</p>\n </div>\n </div>\n </div>\n\n <button class=\"save-btn\" id=\"saveBtn\">保存设置</button>\n <div class=\"save-status\" id=\"saveStatus\"></div>\n </div>\n\n <script src=\"settings.js\"></script>\n</body>\n</html>\n"}}}} |