diff --git a/content.js b/content.js index afba523..ceae95d 100644 --- a/content.js +++ b/content.js @@ -22,49 +22,457 @@ var style = document.createElement('style'); style.id = 'magnet-panel-style'; style.textContent = [ - '#magnet-float-ball{position:fixed;bottom:18px;right:18px;width:56px;height:56px;background:linear-gradient(135deg,#2e7d32,#43a047);border-radius:18px;box-shadow:0 16px 30px rgba(46,125,50,.35);z-index:2147483647;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;font-size:26px;font-family:"Trebuchet MS","Segoe UI","Microsoft YaHei",sans-serif !important;transition:transform .18s ease,box-shadow .18s ease;}', - '#magnet-float-ball:hover{transform:translateY(-2px);box-shadow:0 18px 34px rgba(46,125,50,.42);}', - '#magnet-floating-panel{position:fixed;right:16px;bottom:16px;width:min(760px,calc(100vw - 20px));height:min(82vh,820px);background:linear-gradient(180deg,#f9fbff 0%,#f3f6fb 100%);border:1px solid rgba(133,151,178,.25);border-radius:18px;box-shadow:0 24px 54px rgba(15,23,42,.24);z-index:2147483647;font-family:"Trebuchet MS","Segoe UI","Microsoft YaHei",sans-serif;font-size:13px;color:#122033;display:none;flex-direction:column;overflow:hidden;backdrop-filter:blur(10px);}', - '#magnet-floating-panel .magnet-panel-header{display:flex;justify-content:space-between;align-items:flex-start;padding:18px 20px 14px;background:linear-gradient(135deg,#1f5f3e 0%,#2f7c52 58%,#4caf50 100%);color:#fff;gap:14px;}', - '#magnet-floating-panel .magnet-panel-brand{display:flex;flex-direction:column;gap:4px;min-width:0;}', - '#magnet-floating-panel .magnet-panel-title{font-size:20px;font-weight:700;letter-spacing:.3px;}', - '#magnet-floating-panel .magnet-panel-subtitle{font-size:12px;opacity:.88;line-height:1.45;}', - '#magnet-floating-panel .magnet-panel-head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;}', - '#magnet-floating-panel .magnet-panel-switch{padding:8px 14px;border:none;border-radius:999px;background:rgba(255,255,255,.16);color:#eff8f0;cursor:pointer;font-size:12px;font-weight:700;transition:background .18s ease,transform .18s ease;}', - '#magnet-floating-panel .magnet-panel-switch:hover{background:rgba(255,255,255,.24);transform:translateY(-1px);}', - '#magnet-floating-panel .magnet-panel-switch.is-active{background:#fff;color:#1f5f3e;box-shadow:0 10px 20px rgba(14,30,37,.18);}', - '#magnet-floating-panel .magnet-panel-close{width:34px;height:34px;border:none;border-radius:12px;background:rgba(255,255,255,.16);color:#fff;cursor:pointer;font-size:18px;line-height:1;}', - '#magnet-floating-panel .magnet-panel-close:hover{background:rgba(255,255,255,.24);}', - '#magnet-settings{padding:16px 18px;background:rgba(255,255,255,.88);border-bottom:1px solid rgba(214,223,235,.95);display:flex;flex-direction:column;gap:10px;}', - '#magnet-floating-panel .magnet-control-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}', + /* === 字体引入 === */ + '@import url("https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Noto+Sans+SC:wght@400;500;700&display=swap");', + + /* === CSS 变量 === */ + ':root {', + ' --m-bg-deep: #0a0e14;', + ' --m-bg-primary: #0f1419;', + ' --m-bg-secondary: #1a1f2e;', + ' --m-bg-card: rgba(26, 31, 46, 0.92);', + ' --m-bg-card-hover: rgba(35, 41, 58, 0.95);', + ' --m-accent: #00d4aa;', + ' --m-accent-glow: rgba(0, 212, 170, 0.4);', + ' --m-accent-secondary: #a78bfa;', + ' --m-text-primary: #f0f4f8;', + ' --m-text-secondary: #8892a4;', + ' --m-text-muted: #5c6578;', + ' --m-border: rgba(255, 255, 255, 0.06);', + ' --m-border-accent: rgba(0, 212, 170, 0.3);', + ' --m-success: #10b981;', + ' --m-error: #ef4444;', + ' --m-warning: #f59e0b;', + ' --m-font-display: "Rajdhani", "Microsoft YaHei", sans-serif;', + ' --m-font-body: "Noto Sans SC", "Microsoft YaHei", sans-serif;', + ' --m-radius-sm: 8px;', + ' --m-radius-md: 12px;', + ' --m-radius-lg: 16px;', + ' --m-radius-xl: 20px;', + ' --m-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);', + ' --m-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.4);', + ' --m-shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.5);', + ' --m-shadow-glow: 0 0 20px var(--m-accent-glow), 0 0 40px rgba(0, 212, 170, 0.15);', + '}', + + /* === 悬浮球 === */ + '#magnet-float-ball{', + ' position:fixed;bottom:24px;right:24px;', + ' width:60px;height:60px;', + ' background:linear-gradient(135deg, #0f1419 0%, #1a1f2e 100%);', + ' border:2px solid var(--m-accent);', + ' border-radius:50%;', + ' box-shadow:var(--m-shadow-glow), inset 0 0 20px rgba(0, 212, 170, 0.1);', + ' z-index:2147483647;', + ' cursor:pointer;', + ' display:flex;align-items:center;justify-content:center;', + ' color:var(--m-accent);', + ' font-size:24px;', + ' font-family:var(--m-font-display);', + ' font-weight:700;', + ' transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);', + ' animation:magnet-pulse 2.5s ease-in-out infinite;', + '}', + '#magnet-float-ball:hover{', + ' transform:scale(1.08);', + ' box-shadow:0 0 30px var(--m-accent-glow), 0 0 60px rgba(0, 212, 170, 0.2), inset 0 0 30px rgba(0, 212, 170, 0.15);', + '}', + '#magnet-float-ball:active{transform:scale(0.95);}', + + /* === 脉冲动画 === */ + '@keyframes magnet-pulse{', + ' 0%, 100%{box-shadow:var(--m-shadow-glow), inset 0 0 20px rgba(0, 212, 170, 0.1);}', + ' 50%{box-shadow:0 0 30px var(--m-accent-glow), 0 0 50px rgba(0, 212, 170, 0.2), inset 0 0 25px rgba(0, 212, 170, 0.15);}', + '}', + + /* === 主面板 === */ + '#magnet-floating-panel{', + ' position:fixed;right:20px;bottom:20px;', + ' width:min(800px, calc(100vw - 40px));', + ' height:min(85vh, 860px);', + ' background:var(--m-bg-primary);', + ' border:1px solid var(--m-border-accent);', + ' border-radius:var(--m-radius-xl);', + ' box-shadow:var(--m-shadow-lg), 0 0 80px rgba(0, 212, 170, 0.08);', + ' z-index:2147483647;', + ' font-family:var(--m-font-body);', + ' font-size:13px;', + ' color:var(--m-text-primary);', + ' display:none;flex-direction:column;', + ' overflow:hidden;', + ' backdrop-filter:blur(20px);', + ' animation:magnet-panel-in 0.4s cubic-bezier(0.4, 0, 0.2, 1);', + '}', + '@keyframes magnet-panel-in{', + ' from{opacity:0;transform:translateY(20px) scale(0.98);}', + ' to{opacity:1;transform:translateY(0) scale(1);}', + '}', + + /* === 面板头部 === */ + '#magnet-floating-panel .magnet-panel-header{', + ' display:flex;justify-content:space-between;align-items:flex-start;', + ' padding:20px 24px 16px;', + ' background:linear-gradient(180deg, rgba(0, 212, 170, 0.08) 0%, transparent 100%);', + ' border-bottom:1px solid var(--m-border);', + ' gap:16px;', + '}', + '#magnet-floating-panel .magnet-panel-brand{', + ' display:flex;flex-direction:column;gap:6px;min-width:0;', + '}', + '#magnet-floating-panel .magnet-panel-title{', + ' font-family:var(--m-font-display);', + ' font-size:24px;font-weight:700;', + ' letter-spacing:1px;', + ' background:linear-gradient(135deg, var(--m-accent) 0%, #00f5c4 50%, var(--m-accent-secondary) 100%);', + ' -webkit-background-clip:text;', + ' -webkit-text-fill-color:transparent;', + ' background-clip:text;', + '}', + '#magnet-floating-panel .magnet-panel-subtitle{', + ' font-size:12px;color:var(--m-text-secondary);line-height:1.5;', + '}', + '#magnet-floating-panel .magnet-panel-head-actions{', + ' display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;', + '}', + + /* === 切换按钮 === */ + '#magnet-floating-panel .magnet-panel-switch{', + ' padding:10px 18px;', + ' border:1px solid var(--m-border);', + ' border-radius:var(--m-radius-lg);', + ' background:var(--m-bg-card);', + ' color:var(--m-text-secondary);', + ' cursor:pointer;', + ' font-family:var(--m-font-display);', + ' font-size:13px;font-weight:600;', + ' letter-spacing:0.5px;', + ' transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);', + '}', + '#magnet-floating-panel .magnet-panel-switch:hover{', + ' background:var(--m-bg-card-hover);', + ' border-color:var(--m-accent);', + ' color:var(--m-text-primary);', + '}', + '#magnet-floating-panel .magnet-panel-switch.is-active{', + ' background:linear-gradient(135deg, rgba(0, 212, 170, 0.2) 0%, rgba(0, 212, 170, 0.1) 100%);', + ' border-color:var(--m-accent);', + ' color:var(--m-accent);', + ' box-shadow:0 0 15px rgba(0, 212, 170, 0.2);', + '}', + + /* === 关闭按钮 === */ + '#magnet-floating-panel .magnet-panel-close{', + ' width:36px;height:36px;', + ' border:1px solid var(--m-border);', + ' border-radius:var(--m-radius-md);', + ' background:var(--m-bg-card);', + ' color:var(--m-text-secondary);', + ' cursor:pointer;', + ' font-size:20px;line-height:1;', + ' transition:all 0.2s ease;', + '}', + '#magnet-floating-panel .magnet-panel-close:hover{', + ' background:rgba(239, 68, 68, 0.15);', + ' border-color:var(--m-error);', + ' color:var(--m-error);', + '}', + + /* === 设置区域 === */ + '#magnet-settings{', + ' padding:16px 20px;', + ' background:var(--m-bg-secondary);', + ' border-bottom:1px solid var(--m-border);', + ' display:flex;flex-direction:column;gap:12px;', + '}', + '#magnet-floating-panel .magnet-control-row{', + ' display:flex;gap:12px;align-items:center;flex-wrap:wrap;', + '}', '#magnet-floating-panel .magnet-control-row > *{min-width:0;}', - '#magnet-floating-panel .magnet-panel-content{flex:1;min-height:0;padding:16px 18px;background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(247,250,255,.95));}', - '#magnet-floating-panel .magnet-view{display:none;height:100%;flex-direction:column;gap:12px;min-height:0;}', + + /* === 输入框样式 === */ + '#magnet-settings input[type="text"],', + '#magnet-settings input[type="number"],', + '#magnet-settings select{', + ' padding:10px 14px;', + ' background:var(--m-bg-primary);', + ' border:1px solid var(--m-border);', + ' border-radius:var(--m-radius-md);', + ' color:var(--m-text-primary);', + ' font-family:var(--m-font-body);', + ' font-size:13px;', + ' transition:all 0.2s ease;', + '}', + '#magnet-settings input:focus,', + '#magnet-settings select:focus{', + ' outline:none;', + ' border-color:var(--m-accent);', + ' box-shadow:0 0 0 3px rgba(0, 212, 170, 0.15);', + '}', + '#magnet-settings input::placeholder{color:var(--m-text-muted);}', + + /* === 主按钮 === */ + '#magnet-settings button:not(.magnet-panel-switch){', + ' padding:10px 20px;', + ' background:linear-gradient(135deg, var(--m-accent) 0%, #00f5c4 100%);', + ' border:none;', + ' border-radius:var(--m-radius-md);', + ' color:var(--m-bg-deep);', + ' font-family:var(--m-font-display);', + ' font-size:14px;font-weight:700;', + ' letter-spacing:0.5px;', + ' cursor:pointer;', + ' transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);', + '}', + '#magnet-settings button:not(.magnet-panel-switch):hover{', + ' transform:translateY(-2px);', + ' box-shadow:0 8px 25px rgba(0, 212, 170, 0.4);', + '}', + '#magnet-settings button:not(.magnet-panel-switch):active{', + ' transform:translateY(0);', + '}', + + /* === 内容区域 === */ + '#magnet-floating-panel .magnet-panel-content{', + ' flex:1;min-height:0;', + ' padding:16px 20px;', + ' background:var(--m-bg-primary);', + ' overflow:hidden;', + '}', + '#magnet-floating-panel .magnet-view{', + ' display:none;height:100%;flex-direction:column;gap:14px;min-height:0;', + '}', '#magnet-floating-panel .magnet-view.is-active{display:flex;}', - '#magnet-floating-panel .magnet-view-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;background:#fff;border:1px solid #e4ebf5;border-radius:14px;box-shadow:0 10px 20px rgba(31,48,74,.06);}', - '#magnet-floating-panel .magnet-view-toolbar-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;}', - '#magnet-floating-panel .magnet-view-title{font-size:14px;font-weight:700;color:#19324d;}', - '#magnet-floating-panel .magnet-view-meta{font-size:12px;color:#5d6b82;}', - '#magnet-list{display:flex;flex-direction:column;gap:10px;min-height:0;overflow-y:auto;padding-right:4px;}', - '#magnet-cache-panel{flex:1;min-height:0;overflow-y:auto;padding-right:4px;}', - '#magnet-floating-panel .magnet-panel-footer{padding:14px 18px 18px;background:rgba(255,255,255,.96);border-top:1px solid rgba(214,223,235,.95);display:flex;flex-direction:column;gap:10px;}', - '#magnet-status{padding:10px 12px;border-radius:12px;font-size:12px;line-height:1.5;}', - '#magnet-copy-all{width:100%;padding:12px 14px;background:linear-gradient(135deg,#1e88e5,#42a5f5);color:#fff;border:none;border-radius:12px;cursor:pointer;font-size:13px;font-weight:700;box-shadow:0 10px 22px rgba(30,136,229,.25);}', - '#magnet-copy-all:hover{filter:brightness(1.03);}', - '.magnet-item{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;background:#fff;border:1px solid #e3eaf2;border-radius:14px;box-shadow:0 10px 18px rgba(31,48,74,.06);}', - '.magnet-title{flex:1;cursor:pointer;color:#20324d;min-width:0;font-size:12px;line-height:1.55;word-break:break-all;font-weight:600;}', - '.magnet-copy-btn{padding:8px 12px;background:linear-gradient(135deg,#43a047,#66bb6a);color:#fff;border:none;border-radius:10px;cursor:pointer;font-size:11px;font-weight:700;white-space:nowrap;flex-shrink:0;}', - '.magnet-copy-btn:hover{filter:brightness(1.03);}', - '.magnet-cache-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:12px;}', - '.magnet-cache-card{padding:12px;background:#fff;border:1px solid #e4ebf5;border-radius:14px;box-shadow:0 10px 18px rgba(31,48,74,.05);}', - '.magnet-cache-card-label{font-size:11px;color:#6b778c;margin-bottom:6px;}', - '.magnet-cache-card-value{font-size:18px;font-weight:700;color:#163049;}', - '.magnet-cache-section{margin-top:12px;}', - '.magnet-cache-section-title{font-size:12px;font-weight:700;color:#5c6b82;margin-bottom:8px;}', - '.magnet-cache-entry{padding:10px 12px;margin-top:8px;background:#fff;border:1px solid #e4ebf5;border-radius:12px;box-shadow:0 8px 14px rgba(31,48,74,.05);}', - '.magnet-cache-entry-title{font-size:12px;font-weight:700;color:#1b314b;line-height:1.5;word-break:break-all;}', - '.magnet-cache-entry-meta{font-size:11px;color:#6a768d;margin-top:4px;line-height:1.45;}', - '@media (max-width: 900px){#magnet-floating-panel{right:10px;bottom:10px;width:calc(100vw - 20px);height:min(84vh,760px);}#magnet-floating-panel .magnet-panel-header{padding:16px 16px 12px;}#magnet-settings,#magnet-floating-panel .magnet-panel-content,#magnet-floating-panel .magnet-panel-footer{padding-left:14px;padding-right:14px;}}' + + /* === 视图工具栏 === */ + '#magnet-floating-panel .magnet-view-toolbar{', + ' display:flex;justify-content:space-between;align-items:center;', + ' gap:12px;padding:14px 18px;', + ' background:var(--m-bg-card);', + ' border:1px solid var(--m-border);', + ' border-radius:var(--m-radius-lg);', + '}', + '#magnet-floating-panel .magnet-view-toolbar-actions{', + ' display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;', + '}', + '#magnet-floating-panel .magnet-view-title{', + ' font-family:var(--m-font-display);', + ' font-size:16px;font-weight:700;', + ' color:var(--m-text-primary);', + ' letter-spacing:0.5px;', + '}', + '#magnet-floating-panel .magnet-view-meta{', + ' font-size:12px;color:var(--m-text-secondary);', + '}', + + /* === 磁力列表 === */ + '#magnet-list{', + ' display:flex;flex-direction:column;gap:10px;', + ' min-height:0;overflow-y:auto;padding-right:6px;', + ' scrollbar-width:thin;scrollbar-color:var(--m-accent) var(--m-bg-secondary);', + '}', + '#magnet-list::-webkit-scrollbar{width:6px;}', + '#magnet-list::-webkit-scrollbar-track{background:var(--m-bg-secondary);border-radius:3px;}', + '#magnet-list::-webkit-scrollbar-thumb{background:var(--m-accent);border-radius:3px;}', + + /* === 列表项 === */ + '.magnet-item{', + ' display:flex;align-items:flex-start;gap:14px;', + ' padding:14px 16px;', + ' background:var(--m-bg-card);', + ' border:1px solid var(--m-border);', + ' border-radius:var(--m-radius-lg);', + ' transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);', + ' animation:magnet-item-in 0.3s ease forwards;', + ' opacity:0;', + '}', + '@keyframes magnet-item-in{', + ' from{opacity:0;transform:translateX(-10px);}', + ' to{opacity:1;transform:translateX(0);}', + '}', + '.magnet-item:hover{', + ' background:var(--m-bg-card-hover);', + ' border-color:var(--m-border-accent);', + ' transform:translateX(4px);', + '}', + '.magnet-title{', + ' flex:1;cursor:pointer;', + ' color:var(--m-text-primary);', + ' min-width:0;font-size:13px;line-height:1.6;', + ' word-break:break-all;font-weight:500;', + ' transition:color 0.2s ease;', + '}', + '.magnet-title:hover{color:var(--m-accent);}', + + /* === 复制按钮 === */ + '.magnet-copy-btn{', + ' padding:8px 16px;', + ' background:linear-gradient(135deg, var(--m-accent) 0%, #00f5c4 100%);', + ' color:var(--m-bg-deep);', + ' border:none;border-radius:var(--m-radius-md);', + ' cursor:pointer;', + ' font-family:var(--m-font-display);', + ' font-size:12px;font-weight:700;', + ' white-space:nowrap;flex-shrink:0;', + ' transition:all 0.2s ease;', + '}', + '.magnet-copy-btn:hover{', + ' transform:scale(1.05);', + ' box-shadow:0 4px 15px rgba(0, 212, 170, 0.4);', + '}', + '.magnet-copy-btn:active{transform:scale(0.98);}', + + /* === 缓存面板 === */ + '#magnet-cache-panel{', + ' flex:1;min-height:0;overflow-y:auto;padding-right:6px;', + ' scrollbar-width:thin;scrollbar-color:var(--m-accent) var(--m-bg-secondary);', + '}', + '#magnet-cache-panel::-webkit-scrollbar{width:6px;}', + '#magnet-cache-panel::-webkit-scrollbar-track{background:var(--m-bg-secondary);border-radius:3px;}', + '#magnet-cache-panel::-webkit-scrollbar-thumb{background:var(--m-accent);border-radius:3px;}', + + /* === 缓存网格 === */ + '.magnet-cache-grid{', + ' display:grid;', + ' grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));', + ' gap:12px;margin-bottom:16px;', + '}', + '.magnet-cache-card{', + ' padding:16px;', + ' background:var(--m-bg-card);', + ' border:1px solid var(--m-border);', + ' border-radius:var(--m-radius-lg);', + ' transition:all 0.2s ease;', + '}', + '.magnet-cache-card:hover{', + ' border-color:var(--m-border-accent);', + '}', + '.magnet-cache-card-label{', + ' font-size:11px;color:var(--m-text-muted);margin-bottom:8px;', + ' text-transform:uppercase;letter-spacing:0.5px;', + '}', + '.magnet-cache-card-value{', + ' font-family:var(--m-font-display);', + ' font-size:22px;font-weight:700;', + ' color:var(--m-accent);', + '}', + + /* === 缓存区块 === */ + '.magnet-cache-section{margin-top:16px;}', + '.magnet-cache-section-title{', + ' font-family:var(--m-font-display);', + ' font-size:13px;font-weight:700;', + ' color:var(--m-text-secondary);', + ' margin-bottom:10px;letter-spacing:0.5px;', + '}', + '.magnet-cache-entry{', + ' padding:12px 14px;margin-top:8px;', + ' background:var(--m-bg-card);', + ' border:1px solid var(--m-border);', + ' border-radius:var(--m-radius-md);', + ' transition:all 0.2s ease;', + '}', + '.magnet-cache-entry:hover{', + ' border-color:var(--m-border-accent);', + '}', + '.magnet-cache-entry-title{', + ' font-size:13px;font-weight:600;', + ' color:var(--m-text-primary);', + ' line-height:1.5;word-break:break-all;', + '}', + '.magnet-cache-entry-meta{', + ' font-size:11px;color:var(--m-text-muted);', + ' margin-top:6px;line-height:1.5;', + '}', + + /* === 底部 === */ + '#magnet-floating-panel .magnet-panel-footer{', + ' padding:16px 20px 20px;', + ' background:var(--m-bg-secondary);', + ' border-top:1px solid var(--m-border);', + ' display:flex;flex-direction:column;gap:12px;', + '}', + + /* === 状态栏 === */ + '#magnet-status{', + ' padding:12px 16px;border-radius:var(--m-radius-md);', + ' font-size:12px;line-height:1.6;', + ' background:var(--m-bg-card);', + ' border:1px solid var(--m-border);', + ' color:var(--m-text-secondary);', + '}', + '#magnet-status[data-type="loading"]{', + ' border-color:var(--m-warning);', + ' color:var(--m-warning);', + ' background:rgba(245, 158, 11, 0.1);', + '}', + '#magnet-status[data-type="error"]{', + ' border-color:var(--m-error);', + ' color:var(--m-error);', + ' background:rgba(239, 68, 68, 0.1);', + '}', + '#magnet-status[data-type="done"]{', + ' border-color:var(--m-success);', + ' color:var(--m-success);', + ' background:rgba(16, 185, 129, 0.1);', + '}', + + /* === 一键复制按钮 === */ + '#magnet-copy-all{', + ' width:100%;padding:14px 20px;', + ' background:linear-gradient(135deg, var(--m-accent) 0%, #00f5c4 100%);', + ' color:var(--m-bg-deep);', + ' border:none;border-radius:var(--m-radius-lg);', + ' cursor:pointer;', + ' font-family:var(--m-font-display);', + ' font-size:15px;font-weight:700;', + ' letter-spacing:0.5px;', + ' transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);', + '}', + '#magnet-copy-all:hover{', + ' transform:translateY(-2px);', + ' box-shadow:0 10px 30px rgba(0, 212, 170, 0.4);', + '}', + '#magnet-copy-all:active{transform:translateY(0);}', + + /* === 调试菜单 === */ + '#magnet-debug-menu{', + ' background:var(--m-bg-card) !important;', + ' border:1px solid var(--m-border-accent) !important;', + ' border-radius:var(--m-radius-md) !important;', + ' box-shadow:var(--m-shadow-lg) !important;', + '}', + '#magnet-debug-menu label{', + ' color:var(--m-text-primary) !important;', + '}', + '#magnet-debug-menu input[type="checkbox"]{', + ' accent-color:var(--m-accent);', + '}', + + /* === 响应式 === */ + '@media (max-width: 900px){', + ' #magnet-floating-panel{', + ' right:10px;bottom:10px;', + ' width:calc(100vw - 20px);', + ' height:min(88vh, 800px);', + ' }', + ' #magnet-floating-panel .magnet-panel-header{padding:16px 18px 14px;}', + ' #magnet-settings,', + ' #magnet-floating-panel .magnet-panel-content,', + ' #magnet-floating-panel .magnet-panel-footer{padding-left:16px;padding-right:16px;}', + '}', + + /* === 空状态 === */ + '.magnet-empty-state{', + ' display:flex;flex-direction:column;align-items:center;justify-content:center;', + ' padding:40px 20px;text-align:center;', + ' color:var(--m-text-muted);', + '}', + '.magnet-empty-state-icon{', + ' font-size:48px;margin-bottom:16px;opacity:0.5;', + '}', + '.magnet-empty-state-text{', + ' font-size:14px;line-height:1.6;', + '}' ].join(''); document.head.appendChild(style); } @@ -94,15 +502,15 @@ var ball = document.createElement('div'); ball.id = 'magnet-float-ball'; - ball.innerHTML = '⚡'; + ball.innerHTML = ''; ball.oncontextmenu = function(e) { e.preventDefault(); var menu = document.getElementById('magnet-debug-menu'); if (menu) menu.remove(); menu = document.createElement('div'); menu.id = 'magnet-debug-menu'; - menu.style.cssText = 'position:fixed;bottom:80px;right:20px;background:#fff;border-radius:4px;box-shadow:0 2px 10px rgba(0,0,0,0.3);z-index:999999;padding:5px 0;font-size:12px'; - menu.innerHTML = ''; + menu.style.cssText = 'position:fixed;bottom:90px;right:28px;background:var(--m-bg-card);border:1px solid var(--m-border-accent);border-radius:12px;box-shadow:0 16px 48px rgba(0,0,0,0.5);z-index:999999;padding:8px 0;font-size:12px;font-family:var(--m-font-body);'; + menu.innerHTML = ''; document.body.appendChild(menu); menu.querySelector('input').onchange = function() { DEBUG_MODE = this.checked; @@ -119,7 +527,7 @@ var panel = document.createElement('div'); panel.id = 'magnet-floating-panel'; - panel.innerHTML = '
磁力链接助手
更大的面板、更清晰的缓存视图、智能增量搜索
搜索结果
当前关键词命中的磁链会显示在这里
共 0 条磁链
缓存总览
查看当前板块与全部缓存的占用、快照和最近命中
输入页码范围获取磁力
'; + panel.innerHTML = '
MAGNET LINKS
智能抓取 · 缓存加速 · 一键复制
搜索结果
关键词命中的磁力链接
共 0 条
缓存总览
数据统计与快照管理
设置参数后开始抓取
'; document.body.appendChild(panel); setPanelView('results'); diff --git a/manifest.json b/manifest.json index 5d44c18..026964c 100644 --- a/manifest.json +++ b/manifest.json @@ -1,10 +1,10 @@ { "manifest_version": 3, "name": "涩花塘磁力助手", - "version": "1.2", - "description": "一键获取当前页所有帖子的磁力链接", + "version": "1.3", + "description": "一键获取磁力链接 - 暗色科技风UI", "permissions": [ - "activeTab", + "activeTab", "clipboardWrite", "storage", "unlimitedStorage" diff --git a/popup.html b/popup.html index 891ef6d..a55d398 100644 --- a/popup.html +++ b/popup.html @@ -1,27 +1,133 @@ - + + + -

磁力链接复制助手

-

在论坛页面提取当前页磁力链接并复制到剪贴板

- +
+
+ + + +
+
MAGNET
+
+ +

提取当前页面的磁力链接并复制到剪贴板

+ + + +
+ 仅支持涩花塘论坛页面 +
+