Bun Bun
101 lines
4.3 KiB
HTML
101 lines
4.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>TaskDecay Settings</title>
|
|
<style>
|
|
* { box-sizing: border-box; }
|
|
body {
|
|
max-width: 640px;
|
|
margin: 40px auto;
|
|
padding: 20px;
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
|
background: #0f0f0f;
|
|
color: #e0e0e0;
|
|
}
|
|
h1 { font-size: 22px; margin: 0 0 20px; }
|
|
h2 { font-size: 16px; margin: 24px 0 12px; border-bottom: 1px solid #222; padding-bottom: 8px; }
|
|
.section { background: #161616; border-radius: 8px; padding: 16px; margin-bottom: 16px; }
|
|
label { display: block; font-size: 13px; color: #888; margin-bottom: 4px; }
|
|
input[type="text"], input[type="number"], input[type="password"] {
|
|
width: 100%;
|
|
padding: 10px 12px;
|
|
border-radius: 6px;
|
|
border: 1px solid #333;
|
|
background: #0f0f0f;
|
|
color: #e0e0e0;
|
|
font-size: 13px;
|
|
margin-bottom: 12px;
|
|
}
|
|
input:focus { outline: none; border-color: #2ecc71; }
|
|
.row { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
|
|
input[type="checkbox"] { width: 18px; height: 18px; accent-color: #2ecc71; }
|
|
.btn {
|
|
padding: 10px 16px;
|
|
border-radius: 6px;
|
|
border: none;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
}
|
|
.btn-primary { background: #2ecc71; color: #0f0f0f; }
|
|
.btn-secondary { background: #1a1a1a; color: #ccc; border: 1px solid #333; }
|
|
.status { font-size: 13px; margin-top: 10px; }
|
|
.success { color: #2ecc71; }
|
|
.error { color: #e74c3c; }
|
|
.hint { font-size: 12px; color: #666; margin-top: -8px; margin-bottom: 12px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>TaskDecay Settings</h1>
|
|
<div class="section">
|
|
<h2>Providers</h2>
|
|
<div class="row">
|
|
<input type="checkbox" id="todoistEnabled" />
|
|
<label for="todoistEnabled" style="margin:0">Enable Todoist</label>
|
|
</div>
|
|
<label for="todoistToken">Todoist API Token</label>
|
|
<input type="password" id="todoistToken" placeholder="Paste your Todoist API token" />
|
|
<div class="hint">Get token at <a href="https://todoist.com/app/settings/integrations/developer" target="_blank" style="color:#58a6ff">Settings → Integrations</a></div>
|
|
|
|
<div class="row">
|
|
<input type="checkbox" id="ticktickEnabled" />
|
|
<label for="ticktickEnabled" style="margin:0">Enable TickTick</label>
|
|
</div>
|
|
<label for="ticktickToken">TickTick Access Token</label>
|
|
<input type="password" id="ticktickToken" placeholder="Paste your TickTick token" />
|
|
<div class="hint">Get token from <a href="https://developer.ticktick.com" target="_blank" style="color:#58a6ff">TickTick Developer Portal</a></div>
|
|
|
|
<div class="row">
|
|
<input type="checkbox" id="notionEnabled" />
|
|
<label for="notionEnabled" style="margin:0">Enable Notion</label>
|
|
</div>
|
|
<label for="notionToken">Notion Integration Token</label>
|
|
<input type="password" id="notionToken" placeholder="Paste your Notion integration token" />
|
|
<div class="hint">Create at <a href="https://www.notion.so/my-integrations" target="_blank" style="color:#58a6ff">Notion Integrations</a></div>
|
|
<label for="notionDbs">Notion Database IDs (comma-separated)</label>
|
|
<input type="text" id="notionDbs" placeholder="db-id-1, db-id-2" />
|
|
</div>
|
|
|
|
<div class="section">
|
|
<h2>Behavior</h2>
|
|
<label for="decayThreshold">Decay threshold (days)</label>
|
|
<input type="number" id="decayThreshold" min="1" max="365" />
|
|
<label for="reviewInterval">Review interval (days)</label>
|
|
<input type="number" id="reviewInterval" min="1" max="90" />
|
|
<label for="maxTasks">Max tasks per review</label>
|
|
<input type="number" id="maxTasks" min="5" max="100" />
|
|
<label for="autoArchive">Auto-archive after (days)</label>
|
|
<input type="number" id="autoArchive" min="7" max="365" />
|
|
</div>
|
|
|
|
<button class="btn btn-primary" id="saveBtn">Save Settings</button>
|
|
<button class="btn btn-secondary" id="testBtn" style="margin-left:8px">Test Connection</button>
|
|
<button class="btn btn-secondary" id="clearBtn" style="margin-left:8px">Clear Data</button>
|
|
<div id="status" class="status"></div>
|
|
|
|
<script type="module" src="options.ts"></script>
|
|
</body>
|
|
</html>
|