mirror of
https://github.com/momenbasel/keyFinder.git
synced 2026-07-23 21:20:52 +02:00
Compare commits
17 Commits
v2.0.0-firefox
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
 momenbasel
|
4a3ff3c957 | ||
|
momenbasel
|
1bbd19f155 | ||
|
momenbasel
|
524bffdaec | ||
|
momenbasel
|
ef5b0ba8a2 | ||
|
momenbasel
|
d32a4d789c | ||
|
momenbasel
|
e4b77ae871 | ||
|
momenbasel
|
948337cbb5 | ||
|
momenbasel
|
c70db2b677 | ||
|
momenbasel
|
4d8e4df8fc | ||
|
momenbasel
|
882e298d85 | ||
|
Moamen Basel
|
5d606109dc | ||
|
moamen
|
50a2f8b482 | ||
|
moamen
|
72f324adae | ||
|
Moamen Basel
|
806e0a4a7d | ||
|
Moamen Basel
|
fdd3be3d99 | ||
|
moamen
|
8d2f3fc1e4 | ||
|
moamen
|
99e54bb93a |
@@ -0,0 +1,10 @@
|
||||
version: 2
|
||||
updates:
|
||||
- package-ecosystem: "github-actions"
|
||||
directory: "/"
|
||||
schedule:
|
||||
interval: "weekly"
|
||||
open-pull-requests-limit: 5
|
||||
groups:
|
||||
actions-minor:
|
||||
update-types: ["minor", "patch"]
|
||||
@@ -0,0 +1,32 @@
|
||||
name: CI
|
||||
|
||||
on:
|
||||
push:
|
||||
branches: [master]
|
||||
pull_request:
|
||||
|
||||
jobs:
|
||||
validate:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
|
||||
- name: Validate manifest JSON
|
||||
run: |
|
||||
python3 -c "import json,sys; json.load(open('manifest.json'))"
|
||||
python3 -c "import json,sys; json.load(open('manifest.firefox.json'))"
|
||||
|
||||
- name: Manifest versions must match
|
||||
run: |
|
||||
C=$(python3 -c "import json; print(json.load(open('manifest.json'))['version'])")
|
||||
F=$(python3 -c "import json; print(json.load(open('manifest.firefox.json'))['version'])")
|
||||
[ "$C" = "$F" ] || { echo "Chrome=$C Firefox=$F"; exit 1; }
|
||||
|
||||
- name: Build runs cleanly
|
||||
run: bash scripts/build.sh
|
||||
|
||||
- name: Install web-ext
|
||||
run: npm install -g web-ext
|
||||
|
||||
- name: web-ext lint (Firefox)
|
||||
run: web-ext lint --source-dir dist/firefox --self-hosted
|
||||
@@ -0,0 +1,71 @@
|
||||
name: Release
|
||||
|
||||
on:
|
||||
push:
|
||||
tags:
|
||||
- "v*"
|
||||
workflow_dispatch:
|
||||
inputs:
|
||||
tag:
|
||||
description: "Tag to build (e.g. v2.1.0). Leave blank to build current ref."
|
||||
required: false
|
||||
|
||||
permissions:
|
||||
contents: write
|
||||
|
||||
jobs:
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
ref: ${{ github.event.inputs.tag || github.ref }}
|
||||
|
||||
- name: Read version from manifest
|
||||
id: meta
|
||||
run: |
|
||||
VERSION=$(grep '"version"' manifest.json | head -1 | sed 's/.*: *"\([^"]*\)".*/\1/')
|
||||
echo "version=$VERSION" >> "$GITHUB_OUTPUT"
|
||||
echo "tag=v$VERSION" >> "$GITHUB_OUTPUT"
|
||||
|
||||
- name: Verify tag matches manifest version
|
||||
if: startsWith(github.ref, 'refs/tags/v')
|
||||
run: |
|
||||
TAG="${GITHUB_REF#refs/tags/}"
|
||||
if [ "$TAG" != "${{ steps.meta.outputs.tag }}" ] && [ "$TAG" != "${{ steps.meta.outputs.tag }}-firefox" ]; then
|
||||
echo "Tag $TAG does not match manifest version ${{ steps.meta.outputs.tag }}"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
- name: Build Chrome + Firefox zips
|
||||
run: bash scripts/build.sh
|
||||
|
||||
- name: Compute checksums
|
||||
working-directory: dist
|
||||
run: |
|
||||
shasum -a 256 keyfinder-v${{ steps.meta.outputs.version }}-chrome.zip > keyfinder-v${{ steps.meta.outputs.version }}-chrome.zip.sha256
|
||||
shasum -a 256 keyfinder-v${{ steps.meta.outputs.version }}-firefox.zip > keyfinder-v${{ steps.meta.outputs.version }}-firefox.zip.sha256
|
||||
|
||||
- name: Upload build artifacts
|
||||
uses: actions/upload-artifact@v4
|
||||
with:
|
||||
name: keyfinder-v${{ steps.meta.outputs.version }}
|
||||
path: |
|
||||
dist/keyfinder-v${{ steps.meta.outputs.version }}-chrome.zip
|
||||
dist/keyfinder-v${{ steps.meta.outputs.version }}-firefox.zip
|
||||
dist/keyfinder-v${{ steps.meta.outputs.version }}-chrome.zip.sha256
|
||||
dist/keyfinder-v${{ steps.meta.outputs.version }}-firefox.zip.sha256
|
||||
if-no-files-found: error
|
||||
|
||||
- name: Attach to GitHub Release
|
||||
if: startsWith(github.ref, 'refs/tags/v')
|
||||
uses: softprops/action-gh-release@v2
|
||||
with:
|
||||
files: |
|
||||
dist/keyfinder-v${{ steps.meta.outputs.version }}-chrome.zip
|
||||
dist/keyfinder-v${{ steps.meta.outputs.version }}-firefox.zip
|
||||
dist/keyfinder-v${{ steps.meta.outputs.version }}-chrome.zip.sha256
|
||||
dist/keyfinder-v${{ steps.meta.outputs.version }}-firefox.zip.sha256
|
||||
generate_release_notes: true
|
||||
fail_on_unmatched_files: true
|
||||
@@ -2,6 +2,7 @@
|
||||
*.crx
|
||||
*.pem
|
||||
*.zip
|
||||
dist/
|
||||
.idea/
|
||||
.vscode/
|
||||
*.swp
|
||||
|
||||
@@ -0,0 +1,77 @@
|
||||
# Changelog
|
||||
|
||||
All notable changes to KeyFinder are documented here. Format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/). Versioning follows [SemVer](https://semver.org/spec/v2.0.0.html).
|
||||
|
||||
## [2.2.1] - 2026-07-18
|
||||
|
||||
### Changed
|
||||
- Anti-slop UI refinement: removed scanline/vignette overlays, colored glows, gradient washes, and card grids in favor of flat value-step surfaces, segmented stat strips with hairline dividers, sharp corners, reverse-video active states and hover emphasis, and a titled-border (`findings.log`) table shell — stricter terminal discipline throughout
|
||||
- Store listing screenshots regenerated from the flattened UI
|
||||
|
||||
## [2.2.0] - 2026-07-18
|
||||
|
||||
### Added
|
||||
- Ops-console UI redesign of the popup and findings dashboard: radar-sweep brand mark, ARMED/PASSIVE status LEDs, scanline texture, monospace UI chrome, and a semantic color system (amber = actions, teal = recovered secrets, red/orange/yellow/teal severity scale)
|
||||
- Popup: count-up stat numerals, numbered watchlist entries, command-prompt keyword input with glowing focus ring, and a terminal status line typed with the live keyword/finding counts
|
||||
- Dashboard: clickable severity stat tiles that filter the table, LATEST ticker for the most recent finding, `findings.log` table shell with severity-coded row edges, LED severity badges, click-to-copy match chips, relative timestamps (absolute on hover), skeleton loading rows, staggered first-paint rows, and an animated radar empty state that distinguishes "no findings yet" from "filters hide everything"
|
||||
- Keyboard shortcuts on the dashboard: `/` focuses search, `Esc` clears and blurs it
|
||||
- `prefers-reduced-motion` support across all animations
|
||||
|
||||
### Fixed
|
||||
- Severity sort treated `critical` as lowest priority (`severityOrder[s] || 5` maps `critical: 0` to the fallback), so critical findings rendered last; they now lead the table
|
||||
- Latest-finding ticker no longer stays visible when storage is empty (`display: flex` was overriding the `hidden` attribute)
|
||||
|
||||
## [2.1.1] - 2026-05-14
|
||||
|
||||
### Added
|
||||
- `SECURITY.md` with threat model, disclosure policy, and known limitations of the MAIN <-> ISOLATED nonce bridge
|
||||
- `.github/dependabot.yml` for weekly GitHub Actions version bumps
|
||||
- `CHANGELOG.md`
|
||||
|
||||
### Changed
|
||||
- CSV export sanitiser now also prefixes cells starting with LF (`\n`), not just `=`, `+`, `-`, `@`, tab, CR
|
||||
- Popup and results page version label is now read from the manifest at runtime instead of being hardcoded
|
||||
|
||||
### Fixed
|
||||
- Window-global scan in `js/interceptor.js` now runs at `document_start`, `DOMContentLoaded`, and `load`, with per-name dedupe. The previous implementation only scanned at `document_start` when page globals had not yet been assigned, making the entire pass dead code on most real pages
|
||||
|
||||
## [2.1.0] - 2026-04-14
|
||||
|
||||
### Added
|
||||
- Per-session nonce validation between MAIN-world interceptor and ISOLATED content script to prevent forged finding injection
|
||||
- CSV formula-injection sanitiser on findings export
|
||||
- Serialised storage writes to eliminate cross-tab race conditions
|
||||
- 5000-finding cap with FIFO eviction
|
||||
- Per-tab alert badge with red-dot icon overlay when secrets are detected
|
||||
- MutationObserver scans dynamically-injected DOM nodes for SPA coverage
|
||||
- Explicit Content Security Policy in Chrome and Firefox manifests
|
||||
- `js/interceptor-loader.js` for both browsers, replacing direct MAIN-world content script on Firefox so the nonce handoff actually works
|
||||
- GitHub Actions release pipeline (`.github/workflows/release.yml`): on `v*` tag, build Chrome + Firefox zips, compute SHA256, attach to GitHub Release
|
||||
- GitHub Actions CI pipeline (`.github/workflows/ci.yml`): manifest JSON validation, Chrome <-> Firefox version parity check, build verification, `web-ext lint` on the Firefox bundle
|
||||
|
||||
### Changed
|
||||
- Keyword input validation: 50 character maximum, 50 keyword maximum
|
||||
- Findings are now deleted by unique ID instead of URL substring match
|
||||
- URL parameter scanner uses exact match instead of substring (was matching `author` as `auth`)
|
||||
- Keyword scanner enforces word boundaries (was matching `key` inside `hotkey`, `monkey`)
|
||||
- camelCase JS identifiers are now skipped in keyword value matches
|
||||
- Sentry DSN downgraded from `high` to `low` severity (public by design)
|
||||
|
||||
### Fixed
|
||||
- Stored finding race conditions across concurrent tabs
|
||||
- False positives from GitHub localStorage caches (`ref-selector:*`, `jump_to:*`, `soft-nav:*`, `COPILOT_*`)
|
||||
- False positives from common CSRF tokens (`authenticity_token`, `csrf_token`, `__RequestVerificationToken`)
|
||||
- False positives from keyboard shortcut data attributes (`data-hotkey`, `data-hotkey-scope`)
|
||||
|
||||
## [2.0.0] - 2026-04-07
|
||||
|
||||
### Added
|
||||
- Complete rewrite to Manifest V3
|
||||
- Enterprise-grade secret detection with 80+ regex patterns covering AWS, GCP, Azure, GitHub, GitLab, Stripe, PayPal, Square, Slack, Discord, and more
|
||||
- Firefox support (MV3, Firefox 128+)
|
||||
- Privacy policy
|
||||
- Replaced demo gifs with professional logo
|
||||
|
||||
### Removed
|
||||
- Manifest V2 background page
|
||||
- Legacy jQuery dependency
|
||||
@@ -5,12 +5,13 @@
|
||||
<h1 align="center">KeyFinder</h1>
|
||||
|
||||
<p align="center">
|
||||
<strong>Passive API key and secret discovery for Chrome</strong>
|
||||
<strong>Passive API key and secret discovery for Chrome and Firefox</strong>
|
||||
</p>
|
||||
|
||||
<p align="center">
|
||||
<img src="https://img.shields.io/badge/manifest-v3-blue"/>
|
||||
<img src="https://img.shields.io/badge/Chrome-Extension-green"/>
|
||||
<a href="https://chromewebstore.google.com/detail/keyfinder/oogbljkilkfgdlkbmajlolpanilnnkim"><img src="https://img.shields.io/badge/Chrome-Extension-green"/></a>
|
||||
<a href="https://addons.mozilla.org/en-US/firefox/addon/keyfinder-original/"><img src="https://img.shields.io/badge/Firefox-Add--on-orange"/></a>
|
||||
<img src="https://img.shields.io/github/license/momenbasel/keyFinder"/>
|
||||
<img src="https://img.shields.io/github/v/release/momenbasel/keyFinder"/>
|
||||
<img src="https://img.shields.io/github/downloads/momenbasel/keyFinder/total.svg"/>
|
||||
@@ -18,7 +19,11 @@
|
||||
|
||||
<hr>
|
||||
|
||||
KeyFinder is a Chrome extension that passively scans every page you visit for leaked API keys, tokens, secrets, and credentials. It runs silently in the background with zero configuration required.
|
||||
KeyFinder is a browser extension for Chrome and Firefox that passively scans every page you visit for leaked API keys, tokens, secrets, and credentials. It runs silently in the background with zero configuration required.
|
||||
|
||||
<p align="center">
|
||||
<video src="https://cdn.jsdelivr.net/gh/momenbasel/keyFinder@master/store/store-demo.mp4" poster="https://raw.githubusercontent.com/momenbasel/keyFinder/master/store/store-1-dashboard.png" controls muted playsinline></video>
|
||||
</p>
|
||||
|
||||
## What It Detects
|
||||
|
||||
@@ -57,23 +62,26 @@ Additionally, **Shannon entropy analysis** is applied to detect random high-entr
|
||||
## Features
|
||||
|
||||
- **Zero dependencies** - Pure vanilla JavaScript, no jQuery, no external libraries
|
||||
- **Manifest V3** - Built for modern Chrome with service worker architecture
|
||||
- **Manifest V3** - Built for modern Chrome and Firefox with service worker architecture
|
||||
- **Passive scanning** - Runs automatically on every page load
|
||||
- **Custom keywords** - Add your own search terms to scan for
|
||||
- **Dashboard** - Professional results page with filtering, sorting, and search
|
||||
- **Export** - Download findings as JSON or CSV
|
||||
- **Badge counter** - Shows finding count on the extension icon
|
||||
- **SPA-aware** - MutationObserver re-scans dynamically injected DOM
|
||||
- **Per-tab alert badge** - Red-dot icon overlay when a tab has findings
|
||||
- **Custom keywords** - Add your own search terms to scan for (validated, 50 max)
|
||||
- **Ops-console dashboard** - Flat terminal UI: severity-sorted findings, click-to-filter severity tiles, latest-finding ticker, and live search (`/` focuses, `Esc` clears)
|
||||
- **One-click triage** - Click any match chip to copy the secret, relative timestamps with absolute on hover, per-finding delete
|
||||
- **Export** - Download filtered findings as JSON or CSV (with formula-injection sanitiser)
|
||||
- **Hardened bridge** - Per-page nonce on MAIN <-> ISOLATED CustomEvent channel
|
||||
- **Bounded storage** - 5000-finding cap with FIFO eviction; serialised writes across tabs
|
||||
- **Low footprint** - Minimal CPU and memory usage
|
||||
- **All frames** - Scans iframes and embedded content
|
||||
|
||||
## Installation
|
||||
|
||||
### From Release (Recommended)
|
||||
### Chrome
|
||||
- [Install from Chrome Web Store](https://chromewebstore.google.com/detail/keyfinder/oogbljkilkfgdlkbmajlolpanilnnkim)
|
||||
|
||||
1. Go to [Releases](https://github.com/momenbasel/keyFinder/releases) and download the latest `.crx` file
|
||||
2. Open Chrome and navigate to `chrome://extensions`
|
||||
3. Enable **Developer mode** (top right toggle)
|
||||
4. Drag and drop the `.crx` file onto the page
|
||||
### Firefox
|
||||
- [Install from Firefox Add-ons](https://addons.mozilla.org/en-US/firefox/addon/keyfinder-original/)
|
||||
|
||||
### From Source
|
||||
|
||||
@@ -81,17 +89,23 @@ Additionally, **Shannon entropy analysis** is applied to detect random high-entr
|
||||
git clone https://github.com/momenbasel/keyFinder.git
|
||||
```
|
||||
|
||||
1. Open Chrome and go to `chrome://extensions`
|
||||
**Chrome:**
|
||||
1. Go to `chrome://extensions`
|
||||
2. Enable **Developer mode**
|
||||
3. Click **Load unpacked** and select the `keyFinder` folder
|
||||
|
||||
**Firefox:**
|
||||
1. Go to `about:debugging` > "This Firefox"
|
||||
2. Click **Load Temporary Add-on**
|
||||
3. Select `manifest.firefox.json` from the `keyFinder` folder
|
||||
|
||||
## Usage
|
||||
|
||||
1. **Install** the extension
|
||||
2. **Browse** the web normally - KeyFinder scans every page in the background
|
||||
3. Click the **extension icon** to see stats and manage keywords
|
||||
4. Click **View Findings** to open the full results dashboard
|
||||
5. **Filter** by severity, provider, or type
|
||||
5. **Filter** by severity, provider, or type - or click a severity tile to filter instantly; press `/` to search
|
||||
6. **Export** findings as JSON or CSV for reporting
|
||||
|
||||
## Adding Custom Keywords
|
||||
@@ -104,28 +118,45 @@ Default keywords: `key`, `api_key`, `apikey`, `api-key`, `secret`, `token`, `acc
|
||||
|
||||
```
|
||||
keyFinder/
|
||||
manifest.json # MV3 manifest
|
||||
popup.html # Extension popup UI
|
||||
results.html # Findings dashboard
|
||||
manifest.json # Chrome MV3 manifest
|
||||
manifest.firefox.json # Firefox MV3 manifest
|
||||
popup.html # Extension popup UI
|
||||
results.html # Findings dashboard
|
||||
js/
|
||||
background.js # Service worker - storage and message handling
|
||||
patterns.js # 80+ secret detection regex patterns
|
||||
content.js # Page scanner - DOM, scripts, network interception
|
||||
popup.js # Popup logic
|
||||
results.js # Dashboard logic with filtering and export
|
||||
background.js # Service worker - storage and message handling
|
||||
patterns.js # 80+ secret detection regex patterns
|
||||
content.js # ISOLATED-world page scanner - DOM, scripts, network
|
||||
interceptor-loader.js # ISOLATED loader - sets nonce, injects MAIN-world interceptor
|
||||
interceptor.js # MAIN-world XHR/Fetch hooks + window global scanning
|
||||
popup.js # Popup logic
|
||||
results.js # Dashboard logic with filtering and export
|
||||
css/
|
||||
popup.css # Popup styles
|
||||
results.css # Dashboard styles
|
||||
popup.css # Popup styles
|
||||
results.css # Dashboard styles
|
||||
icons/
|
||||
icon16.png
|
||||
icon48.png
|
||||
icon128.png
|
||||
scripts/
|
||||
build.sh # Build Chrome and Firefox zip packages
|
||||
```
|
||||
|
||||
## Security
|
||||
|
||||
See [SECURITY.md](SECURITY.md) for the threat model, disclosure policy, and known limitations. Release notes are in [CHANGELOG.md](CHANGELOG.md).
|
||||
|
||||
## Disclaimer
|
||||
|
||||
This tool is intended for **security research and authorized testing only**. Use it to identify leaked secrets on your own applications or during authorized penetration tests. You are responsible for your own actions.
|
||||
|
||||
|
||||
## Professional services
|
||||
|
||||
keyFinder is built and maintained by [GreyCore Labs](https://greycorelabs.com), a US-incorporated offensive security firm. Want the same eye on your own product?
|
||||
|
||||
- [Penetration testing](https://greycorelabs.com/#plans) - web, API, mobile, cloud. Fixed quote within 24 hours, redacted sample report on request.
|
||||
- [Free external attack-surface scan](https://greycorelabs.com/#free-scan) - one-page report in 48 hours, no strings attached.
|
||||
|
||||
## License
|
||||
|
||||
MIT
|
||||
|
||||
+57
@@ -0,0 +1,57 @@
|
||||
# Security Policy
|
||||
|
||||
## Reporting a vulnerability
|
||||
|
||||
Email **security reports** privately to the address on the maintainer's GitHub profile.
|
||||
Do **not** open a public issue for unpatched vulnerabilities.
|
||||
|
||||
When reporting, include:
|
||||
- Affected version (`manifest.json` `version` field)
|
||||
- Browser and version
|
||||
- Steps to reproduce
|
||||
- Impact assessment (what an attacker gains)
|
||||
|
||||
A response is targeted within 7 days.
|
||||
|
||||
## Threat model
|
||||
|
||||
KeyFinder runs as a content script in every page the user visits and reports findings to a service worker. It is **client-side, passive, and read-only** with respect to the page.
|
||||
|
||||
### In scope
|
||||
- Privilege escalation from a malicious page into the extension's service worker
|
||||
- Persistent storage poisoning via crafted findings
|
||||
- Cross-tab data leakage through `chrome.storage`
|
||||
- CSV / JSON export injection (formulas, embedded HTML, JS)
|
||||
- Manifest / CSP weaknesses enabling code injection into the extension's own pages
|
||||
- Pattern-rule false positives that consistently leak benign data into findings
|
||||
|
||||
### Out of scope
|
||||
- A malicious page generating **fake findings** in the user's results view. The MAIN-world interceptor and the ISOLATED content script communicate over `CustomEvent` with a per-page nonce stored as a `data-kf-verify` attribute on `documentElement`. The nonce is removed once the content script consumes it, but a page script that runs between `document_start` and `document_idle` can read the attribute and forge events. Mitigation cost is high (Symbols don't cross realms; postMessage is also page-visible). The impact is limited to **showing the user a finding that isn't real** - no data is exfiltrated, no privileged API is reached. Treat findings on a hostile page as advisory.
|
||||
- Detection accuracy of individual regex rules. False positives and false negatives are expected; report a tuning issue rather than a CVE.
|
||||
- Extension being uninstalled or disabled by the user.
|
||||
|
||||
## What the extension can see
|
||||
|
||||
| Surface | Scope |
|
||||
|---|---|
|
||||
| Page DOM | All pages (`<all_urls>`) at `document_idle` (ISOLATED world) and `document_start` (MAIN world interceptor) |
|
||||
| Network | `fetch` and `XMLHttpRequest` responses initiated by the page (response bodies up to 500 KB are scanned) |
|
||||
| Web storage | `localStorage`, `sessionStorage`, `document.cookie` on the page |
|
||||
| Inter-extension | None. No host permissions beyond `activeTab` and `storage` |
|
||||
|
||||
The extension makes **no outbound network requests** other than fetching same-origin scripts already referenced by the page.
|
||||
|
||||
## Known limitations
|
||||
|
||||
- **Per-tab badge dot** is set on the first finding only; subsequent findings update the count but not the icon
|
||||
- **5000 finding cap** with FIFO eviction. High-volume scans (heavy SPAs over a long session) will drop oldest findings
|
||||
- **CSV export** prefixes a single-quote on cells starting with `=`, `+`, `-`, `@`, tab, or carriage return to neutralise Excel / Sheets formula injection. Line-feed prefix is not currently neutralised
|
||||
- **Service worker restarts** drop the in-flight `storageQueue` Promise chain. Subsequent storage writes are still serialised; only pending writes from the killed worker are lost
|
||||
|
||||
## Supported versions
|
||||
|
||||
| Version | Supported |
|
||||
|---|---|
|
||||
| 2.1.x | yes |
|
||||
| 2.0.x | no |
|
||||
| < 2.0 | no |
|
||||
+337
-142
@@ -1,240 +1,435 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
/* ============================================================
|
||||
KeyFinder — ops console popup
|
||||
flat terminal discipline: value-step surfaces, 1px hairlines,
|
||||
reverse-video emphasis, zero glow, zero surface effects
|
||||
amber = action · teal = recovered secrets
|
||||
============================================================ */
|
||||
|
||||
:root {
|
||||
--bg: #05070c;
|
||||
--bg-raise: #090d14;
|
||||
--bg-overlay: #0d131d;
|
||||
--line: #1a2233;
|
||||
--line-strong: #2a3650;
|
||||
--text: #d6dde8;
|
||||
--text-dim: #8b96a8;
|
||||
--text-faint: #525d70;
|
||||
--ink: #05070c;
|
||||
--amber: #f5a524;
|
||||
--amber-hot: #ffc45c;
|
||||
--teal: #45d0c4;
|
||||
--red: #ff5c5c;
|
||||
--green: #3ddc97;
|
||||
--mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco,
|
||||
Consolas, "Liberation Mono", monospace;
|
||||
--ease: cubic-bezier(.24, .58, .47, .99);
|
||||
}
|
||||
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
|
||||
html { color-scheme: dark; }
|
||||
|
||||
body {
|
||||
width: 360px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
background: #0f0f0f;
|
||||
color: #e0e0e0;
|
||||
font-size: 13px;
|
||||
width: 372px;
|
||||
font-family: var(--mono);
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
font-feature-settings: "tnum";
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
::selection { background: var(--amber); color: var(--ink); }
|
||||
|
||||
:focus-visible {
|
||||
outline: 1px solid var(--amber);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------ header */
|
||||
|
||||
.header {
|
||||
padding: 16px 16px 12px;
|
||||
border-bottom: 1px solid #1e1e1e;
|
||||
background: linear-gradient(135deg, #0f0f0f 0%, #1a1a2e 100%);
|
||||
padding: 14px 14px 12px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: var(--bg-raise);
|
||||
}
|
||||
|
||||
.header-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
.header-brand { display: flex; align-items: center; gap: 11px; }
|
||||
|
||||
.header-icon {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
/* radar: rotating sweep ring + blip around the key */
|
||||
.radar {
|
||||
position: relative;
|
||||
flex: none;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--line-strong);
|
||||
background: var(--bg);
|
||||
display: grid;
|
||||
place-items: center;
|
||||
}
|
||||
.radar::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: -1px;
|
||||
border-radius: 50%;
|
||||
background: conic-gradient(from 0deg,
|
||||
var(--amber) 0deg, rgba(245,165,36,.15) 60deg, transparent 95deg);
|
||||
-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 1.5px));
|
||||
mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 1.5px));
|
||||
animation: radar-sweep 4.2s linear infinite;
|
||||
}
|
||||
.radar::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
left: 9px;
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
border-radius: 50%;
|
||||
background: var(--teal);
|
||||
animation: blip 2.1s ease-in-out infinite;
|
||||
}
|
||||
.header-icon { width: 20px; height: 20px; display: block; }
|
||||
|
||||
@keyframes radar-sweep { to { transform: rotate(360deg); } }
|
||||
@keyframes blip { 0%, 100% { opacity: .15; } 50% { opacity: 1; } }
|
||||
|
||||
.brand-text { flex: 1; min-width: 0; }
|
||||
|
||||
.header-brand h1 {
|
||||
font-size: 18px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: #ffffff;
|
||||
letter-spacing: -0.3px;
|
||||
color: #fff;
|
||||
letter-spacing: .22em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
}
|
||||
|
||||
.version {
|
||||
font-size: 10px;
|
||||
font-size: 9px;
|
||||
font-weight: 500;
|
||||
color: #666;
|
||||
background: #1a1a1a;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
margin-left: 4px;
|
||||
letter-spacing: .08em;
|
||||
color: var(--text-faint);
|
||||
border: 1px solid var(--line);
|
||||
padding: 2px 5px;
|
||||
background: var(--bg);
|
||||
}
|
||||
.version::before { content: "["; color: var(--line-strong); }
|
||||
.version::after { content: "]"; color: var(--line-strong); }
|
||||
|
||||
.header-tagline {
|
||||
margin-top: 4px;
|
||||
font-size: 11px;
|
||||
color: #666;
|
||||
margin-top: 3px;
|
||||
font-size: 9.5px;
|
||||
letter-spacing: .1em;
|
||||
color: var(--text-faint);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.header-tagline::before { content: "// "; color: var(--amber); }
|
||||
|
||||
/* armed badge — flat status LED */
|
||||
.live-badge {
|
||||
flex: none;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 8.5px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .2em;
|
||||
color: var(--green);
|
||||
border: 1px solid rgba(61,220,151,.4);
|
||||
padding: 4px 7px 4px 6px;
|
||||
}
|
||||
.live-dot {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 50%;
|
||||
background: var(--green);
|
||||
animation: pulse 1.5s ease-in-out infinite;
|
||||
}
|
||||
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
|
||||
|
||||
/* ------------------------------------------------ stats: one segmented strip, no cards */
|
||||
|
||||
.stats {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid #1e1e1e;
|
||||
margin: 10px 14px;
|
||||
border: 1px solid var(--line);
|
||||
background: var(--bg-raise);
|
||||
}
|
||||
|
||||
.stat-card {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
background: #141414;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #1e1e1e;
|
||||
gap: 4px;
|
||||
padding: 9px 11px 8px;
|
||||
}
|
||||
.stat-card + .stat-card { border-left: 1px solid var(--line); }
|
||||
|
||||
.stat-top { display: flex; align-items: center; gap: 6px; }
|
||||
|
||||
.stat-led {
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
border-radius: 50%;
|
||||
background: var(--accent, var(--amber));
|
||||
}
|
||||
.stat-findings { --accent: var(--amber); }
|
||||
.stat-keywords { --accent: var(--teal); }
|
||||
|
||||
.stat-label {
|
||||
font-size: 8.5px;
|
||||
font-weight: 600;
|
||||
color: var(--text-faint);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .18em;
|
||||
}
|
||||
|
||||
.stat-number {
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
line-height: 1.1;
|
||||
color: #fff;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 10px;
|
||||
color: #666;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
/* ------------------------------------------------ watchlist */
|
||||
|
||||
.section {
|
||||
padding: 12px 16px;
|
||||
}
|
||||
.section { padding: 2px 14px 10px; }
|
||||
|
||||
.section-title {
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
color: #666;
|
||||
font-size: 9px;
|
||||
font-weight: 700;
|
||||
color: var(--text-dim);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.8px;
|
||||
margin-bottom: 8px;
|
||||
letter-spacing: .22em;
|
||||
margin-bottom: 9px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
}
|
||||
.section-title::after {
|
||||
content: "";
|
||||
flex: 1;
|
||||
border-top: 1px dashed var(--line);
|
||||
}
|
||||
.section-sub {
|
||||
font-size: 8.5px;
|
||||
font-weight: 400;
|
||||
letter-spacing: .1em;
|
||||
color: var(--text-faint);
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/* command-prompt input bar */
|
||||
.keyword-form {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
align-items: stretch;
|
||||
background: var(--bg-raise);
|
||||
border: 1px solid var(--line-strong);
|
||||
margin-bottom: 8px;
|
||||
transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
|
||||
}
|
||||
.keyword-form:focus-within {
|
||||
border-color: var(--amber);
|
||||
box-shadow: 0 0 0 1px var(--amber);
|
||||
}
|
||||
|
||||
.prompt {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
padding: 0 4px 0 10px;
|
||||
color: var(--amber);
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.keyword-form input {
|
||||
flex: 1;
|
||||
padding: 7px 10px;
|
||||
background: #141414;
|
||||
border: 1px solid #2a2a2a;
|
||||
border-radius: 6px;
|
||||
color: #e0e0e0;
|
||||
font-size: 12px;
|
||||
min-width: 0;
|
||||
padding: 8px 8px 8px 2px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--text);
|
||||
font-family: var(--mono);
|
||||
font-size: 11.5px;
|
||||
outline: none;
|
||||
transition: border-color 0.15s;
|
||||
}
|
||||
|
||||
.keyword-form input:focus {
|
||||
border-color: #4a9eff;
|
||||
}
|
||||
|
||||
.keyword-form input::placeholder {
|
||||
color: #444;
|
||||
box-shadow: none;
|
||||
}
|
||||
.keyword-form input::placeholder { color: var(--text-faint); }
|
||||
|
||||
.keyword-form button {
|
||||
padding: 7px 14px;
|
||||
background: #4a9eff;
|
||||
color: #fff;
|
||||
margin: 3px;
|
||||
padding: 0 13px;
|
||||
background: var(--amber);
|
||||
color: var(--ink);
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
font-family: var(--mono);
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .12em;
|
||||
cursor: pointer;
|
||||
transition: background 0.15s;
|
||||
}
|
||||
|
||||
.keyword-form button:hover {
|
||||
background: #3a8eef;
|
||||
transition: filter .15s var(--ease), transform .05s var(--ease);
|
||||
}
|
||||
.keyword-form button:hover { filter: brightness(1.12); }
|
||||
.keyword-form button:active { transform: translateY(1px); }
|
||||
|
||||
.error-msg {
|
||||
padding: 6px 10px;
|
||||
background: #2a1515;
|
||||
border: 1px solid #4a2020;
|
||||
border-radius: 6px;
|
||||
color: #ff6b6b;
|
||||
font-size: 11px;
|
||||
padding: 6px 9px;
|
||||
background: rgba(255,92,92,.08);
|
||||
border: 1px solid rgba(255,92,92,.35);
|
||||
border-left-width: 2px;
|
||||
color: var(--red);
|
||||
font-size: 10px;
|
||||
letter-spacing: .04em;
|
||||
margin-bottom: 8px;
|
||||
animation: shake .3s var(--ease);
|
||||
}
|
||||
.error-msg::before { content: "ERR // "; font-weight: 700; }
|
||||
@keyframes shake {
|
||||
0%, 100% { transform: translateX(0); }
|
||||
25% { transform: translateX(-3px); }
|
||||
75% { transform: translateX(3px); }
|
||||
}
|
||||
|
||||
/* keyword list — numbered watchlist entries */
|
||||
.keyword-list {
|
||||
list-style: none;
|
||||
max-height: 240px;
|
||||
counter-reset: kw;
|
||||
max-height: 218px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.keyword-list::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
.keyword-list::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.keyword-list::-webkit-scrollbar-thumb {
|
||||
background: #333;
|
||||
border-radius: 4px;
|
||||
margin: 0 -4px;
|
||||
padding: 0 4px;
|
||||
}
|
||||
|
||||
.keyword-item {
|
||||
counter-increment: kw;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 6px 10px;
|
||||
border-radius: 6px;
|
||||
transition: background 0.1s;
|
||||
gap: 9px;
|
||||
padding: 5px 7px;
|
||||
transition: background .12s var(--ease);
|
||||
}
|
||||
|
||||
.keyword-item:hover {
|
||||
background: #1a1a1a;
|
||||
.keyword-item::before {
|
||||
content: counter(kw, decimal-leading-zero);
|
||||
font-size: 8.5px;
|
||||
color: var(--text-faint);
|
||||
letter-spacing: .05em;
|
||||
flex: none;
|
||||
}
|
||||
.keyword-item:hover { background: var(--bg-raise); }
|
||||
.keyword-item:hover .keyword-label { color: var(--teal); }
|
||||
|
||||
.keyword-label {
|
||||
font-family: "SF Mono", "Fira Code", "Consolas", monospace;
|
||||
font-size: 12px;
|
||||
color: #ccc;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 11.5px;
|
||||
color: var(--text);
|
||||
transition: color .12s var(--ease);
|
||||
}
|
||||
|
||||
.keyword-remove {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: none;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #555;
|
||||
font-size: 16px;
|
||||
border: 1px solid transparent;
|
||||
color: var(--text-faint);
|
||||
font-size: 13px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
transition: all 0.1s;
|
||||
opacity: .45;
|
||||
transition: all .12s var(--ease);
|
||||
}
|
||||
|
||||
.keyword-item:hover .keyword-remove { opacity: 1; }
|
||||
.keyword-remove:hover {
|
||||
background: #2a1515;
|
||||
color: #ff6b6b;
|
||||
background: var(--red);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 16px;
|
||||
color: #444;
|
||||
font-size: 12px;
|
||||
padding: 14px 10px;
|
||||
color: var(--text-faint);
|
||||
font-size: 10.5px;
|
||||
letter-spacing: .06em;
|
||||
border: 1px dashed var(--line-strong);
|
||||
}
|
||||
.empty-state::before { content: "[ empty watchlist ]"; display: block; margin-bottom: 2px; opacity: .6; }
|
||||
|
||||
/* ------------------------------------------------ footer */
|
||||
|
||||
.footer {
|
||||
padding: 12px 16px;
|
||||
border-top: 1px solid #1e1e1e;
|
||||
padding: 10px 14px 14px;
|
||||
border-top: 1px solid var(--line);
|
||||
}
|
||||
|
||||
/* typed terminal status line */
|
||||
.term-line {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 16px;
|
||||
margin-bottom: 9px;
|
||||
font-size: 9.5px;
|
||||
letter-spacing: .06em;
|
||||
color: var(--text-faint);
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.term-text { overflow: hidden; text-overflow: ellipsis; }
|
||||
.term-cursor {
|
||||
flex: none;
|
||||
width: 6px;
|
||||
height: 11px;
|
||||
margin-left: 3px;
|
||||
background: var(--amber);
|
||||
animation: cursor-blink 1.06s steps(1) infinite;
|
||||
}
|
||||
@keyframes cursor-blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }
|
||||
|
||||
.results-btn {
|
||||
display: block;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
padding: 10px;
|
||||
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
|
||||
color: #4a9eff;
|
||||
background: var(--amber);
|
||||
color: var(--ink);
|
||||
text-decoration: none;
|
||||
border-radius: 8px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
border: 1px solid #1e2d4a;
|
||||
transition: all 0.15s;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .16em;
|
||||
transition: filter .15s var(--ease), transform .05s var(--ease);
|
||||
}
|
||||
.results-btn:hover { filter: brightness(1.12); }
|
||||
.results-btn:active { transform: translateY(1px); }
|
||||
.btn-arrow { transition: transform .18s var(--ease); }
|
||||
.results-btn:hover .btn-arrow { transform: translateX(3px); }
|
||||
|
||||
.results-btn:hover {
|
||||
background: linear-gradient(135deg, #1e2040 0%, #1a2848 100%);
|
||||
border-color: #2a4070;
|
||||
/* ------------------------------------------------ scrollbars */
|
||||
|
||||
::-webkit-scrollbar { width: 5px; }
|
||||
::-webkit-scrollbar-track { background: transparent; }
|
||||
::-webkit-scrollbar-thumb { background: #1c2536; }
|
||||
::-webkit-scrollbar-thumb:hover { background: #2a3650; }
|
||||
|
||||
/* ------------------------------------------------ reduced motion */
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after {
|
||||
animation-duration: .01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: .01ms !important;
|
||||
}
|
||||
}
|
||||
|
||||
+539
-209
@@ -1,341 +1,671 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
/* ============================================================
|
||||
KeyFinder — findings console
|
||||
flat terminal discipline: value-step surfaces, 1px hairlines,
|
||||
reverse-video emphasis, zero glow, zero surface effects
|
||||
severity scale: red > orange > yellow > teal
|
||||
============================================================ */
|
||||
|
||||
:root {
|
||||
--bg: #05070c;
|
||||
--bg-raise: #090d14;
|
||||
--bg-overlay: #0d131d;
|
||||
--line: #1a2233;
|
||||
--line-strong: #2a3650;
|
||||
--text: #d6dde8;
|
||||
--text-dim: #8b96a8;
|
||||
--text-faint: #525d70;
|
||||
--ink: #05070c;
|
||||
--amber: #f5a524;
|
||||
--amber-hot: #ffc45c;
|
||||
--teal: #45d0c4;
|
||||
--red: #ff5c5c;
|
||||
--orange: #ff9431;
|
||||
--yellow: #ffd166;
|
||||
--green: #3ddc97;
|
||||
--mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco,
|
||||
Consolas, "Liberation Mono", monospace;
|
||||
--ease: cubic-bezier(.24, .58, .47, .99);
|
||||
}
|
||||
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
|
||||
html { color-scheme: dark; }
|
||||
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
background: #0a0a0a;
|
||||
color: #e0e0e0;
|
||||
font-size: 13px;
|
||||
font-family: var(--mono);
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
min-height: 100vh;
|
||||
font-feature-settings: "tnum";
|
||||
}
|
||||
|
||||
::selection { background: var(--amber); color: var(--ink); }
|
||||
|
||||
:focus-visible {
|
||||
outline: 1px solid var(--amber);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------ header */
|
||||
|
||||
.header {
|
||||
padding: 16px 24px;
|
||||
background: #0f0f0f;
|
||||
border-bottom: 1px solid #1e1e1e;
|
||||
padding: 14px 24px 12px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: var(--bg-raise);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
gap: 11px;
|
||||
}
|
||||
|
||||
.header-left {
|
||||
.header-row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.header-icon {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
.header-left { display: flex; align-items: center; gap: 12px; }
|
||||
|
||||
.header-left h1 {
|
||||
font-size: 20px;
|
||||
/* radar sweep around the key */
|
||||
.radar {
|
||||
position: relative;
|
||||
flex: none;
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--line-strong);
|
||||
background: var(--bg);
|
||||
display: grid;
|
||||
place-items: center;
|
||||
}
|
||||
.radar::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: -1px;
|
||||
border-radius: 50%;
|
||||
background: conic-gradient(from 0deg,
|
||||
var(--amber) 0deg, rgba(245,165,36,.15) 60deg, transparent 95deg);
|
||||
-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 1.5px));
|
||||
mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 1.5px));
|
||||
animation: radar-sweep 4.2s linear infinite;
|
||||
}
|
||||
.radar::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 10px;
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
border-radius: 50%;
|
||||
background: var(--teal);
|
||||
animation: blip 2.1s ease-in-out infinite;
|
||||
}
|
||||
.header-icon { width: 22px; height: 22px; display: block; }
|
||||
|
||||
@keyframes radar-sweep { to { transform: rotate(360deg); } }
|
||||
@keyframes blip { 0%, 100% { opacity: .15; } 50% { opacity: 1; } }
|
||||
|
||||
.brand-text h1 {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
letter-spacing: .22em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.version {
|
||||
font-size: 11px;
|
||||
color: #555;
|
||||
font-weight: 400;
|
||||
font-size: 9px;
|
||||
font-weight: 500;
|
||||
letter-spacing: .08em;
|
||||
color: var(--text-faint);
|
||||
border: 1px solid var(--line);
|
||||
padding: 2px 5px;
|
||||
background: var(--bg);
|
||||
}
|
||||
.version::before { content: "["; color: var(--line-strong); }
|
||||
.version::after { content: "]"; color: var(--line-strong); }
|
||||
|
||||
.header-sub {
|
||||
margin-top: 2px;
|
||||
font-size: 9px;
|
||||
letter-spacing: .18em;
|
||||
color: var(--text-faint);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.header-sub::before { content: "// "; color: var(--amber); }
|
||||
|
||||
.live-badge {
|
||||
flex: none;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 8.5px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .2em;
|
||||
color: var(--green);
|
||||
border: 1px solid rgba(61,220,151,.4);
|
||||
padding: 4px 8px 4px 7px;
|
||||
}
|
||||
.live-dot {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 50%;
|
||||
background: var(--green);
|
||||
animation: pulse 1.5s ease-in-out infinite;
|
||||
}
|
||||
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
|
||||
|
||||
/* ------------------------------------------------ header actions */
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
/* terminal-style search bar */
|
||||
.search-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
background: var(--bg);
|
||||
border: 1px solid var(--line-strong);
|
||||
padding: 0 8px;
|
||||
transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
|
||||
}
|
||||
.search-wrap:focus-within {
|
||||
border-color: var(--amber);
|
||||
box-shadow: 0 0 0 1px var(--amber);
|
||||
}
|
||||
.search-glyph { color: var(--amber); font-size: 13px; user-select: none; }
|
||||
.search-wrap input {
|
||||
width: 210px;
|
||||
padding: 7px 0;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--text);
|
||||
font-family: var(--mono);
|
||||
font-size: 11.5px;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.search-wrap input::placeholder { color: var(--text-faint); }
|
||||
|
||||
.kbd {
|
||||
font-family: var(--mono);
|
||||
font-size: 9px;
|
||||
color: var(--text-faint);
|
||||
border: 1px solid var(--line-strong);
|
||||
border-bottom-width: 2px;
|
||||
padding: 1px 5px;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.btn-group { display: flex; gap: 6px; }
|
||||
|
||||
.btn {
|
||||
font-family: var(--mono);
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .1em;
|
||||
padding: 7px 12px;
|
||||
border: 1px solid transparent;
|
||||
cursor: pointer;
|
||||
transition: all .15s var(--ease);
|
||||
}
|
||||
.btn:active { transform: translateY(1px); }
|
||||
|
||||
.btn-secondary {
|
||||
background: transparent;
|
||||
border-color: var(--line-strong);
|
||||
color: var(--text-dim);
|
||||
}
|
||||
.btn-secondary:hover {
|
||||
color: var(--ink);
|
||||
background: var(--amber);
|
||||
border-color: var(--amber);
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background: transparent;
|
||||
border-color: rgba(255,92,92,.4);
|
||||
color: var(--red);
|
||||
}
|
||||
.btn-danger:hover { background: var(--red); border-color: var(--red); color: var(--ink); }
|
||||
|
||||
/* ------------------------------------------------ filter row */
|
||||
|
||||
.header-row-filters { gap: 10px; }
|
||||
|
||||
.filter-group {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.filter-group select,
|
||||
.filter-group input {
|
||||
padding: 6px 10px;
|
||||
background: #141414;
|
||||
border: 1px solid #2a2a2a;
|
||||
border-radius: 6px;
|
||||
color: #ccc;
|
||||
font-size: 12px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.filter-group select:focus,
|
||||
.filter-group input:focus {
|
||||
border-color: #4a9eff;
|
||||
}
|
||||
|
||||
.filter-group input {
|
||||
min-width: 180px;
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
.filter {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
align-items: center;
|
||||
background: var(--bg);
|
||||
border: 1px solid var(--line);
|
||||
overflow: hidden;
|
||||
transition: border-color .15s var(--ease);
|
||||
}
|
||||
.filter:focus-within { border-color: var(--amber); }
|
||||
|
||||
.filter-label {
|
||||
font-size: 8.5px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .16em;
|
||||
text-transform: uppercase;
|
||||
color: var(--amber);
|
||||
border-right: 1px solid var(--line);
|
||||
padding: 7px 7px 7px 9px;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 6px 14px;
|
||||
.filter select {
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
padding: 6px 24px 6px 9px;
|
||||
background-color: transparent;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M1 1l3 3 3-3' stroke='%238b96a8' fill='none'/%3E%3C/svg%3E");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 8px center;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: var(--text);
|
||||
font-family: var(--mono);
|
||||
font-size: 10.5px;
|
||||
letter-spacing: .04em;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
max-width: 180px;
|
||||
}
|
||||
.filter select option { background: var(--bg-overlay); color: var(--text); }
|
||||
|
||||
.btn-secondary {
|
||||
background: #1a1a1a;
|
||||
color: #ccc;
|
||||
border: 1px solid #2a2a2a;
|
||||
.meta-line {
|
||||
margin-left: auto;
|
||||
font-size: 9.5px;
|
||||
letter-spacing: .1em;
|
||||
color: var(--text-faint);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.meta-line strong { color: var(--text-dim); font-weight: 600; }
|
||||
|
||||
.btn-secondary:hover {
|
||||
background: #222;
|
||||
border-color: #444;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background: #2a1515;
|
||||
color: #ff6b6b;
|
||||
border: 1px solid #4a2020;
|
||||
}
|
||||
|
||||
.btn-danger:hover {
|
||||
background: #3a1a1a;
|
||||
}
|
||||
/* ------------------------------------------------ stats: one segmented strip, no cards */
|
||||
|
||||
.stats-bar {
|
||||
display: flex;
|
||||
gap: 1px;
|
||||
padding: 12px 24px;
|
||||
background: #0f0f0f;
|
||||
border-bottom: 1px solid #1e1e1e;
|
||||
flex-wrap: wrap;
|
||||
margin: 12px 24px;
|
||||
border: 1px solid var(--line);
|
||||
background: var(--bg-raise);
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
flex: 1;
|
||||
min-width: 96px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
background: #111;
|
||||
border-radius: 6px;
|
||||
margin: 0 4px;
|
||||
gap: 4px;
|
||||
padding: 9px 12px 8px;
|
||||
position: relative;
|
||||
transition: background .15s var(--ease);
|
||||
}
|
||||
.stat-item + .stat-item { border-left: 1px solid var(--line); }
|
||||
.stat-item[data-filter] { cursor: pointer; }
|
||||
.stat-item[data-filter]:hover { background: var(--bg-overlay); }
|
||||
|
||||
/* reverse-video active filter */
|
||||
.stat-item.active { background: var(--accent, var(--amber)); }
|
||||
.stat-item.active .stat-num,
|
||||
.stat-item.active .stat-lbl { color: var(--ink); }
|
||||
.stat-item.active .stat-led { background: var(--ink); }
|
||||
|
||||
.stat-total { --accent: #d6dde8; }
|
||||
.stat-critical { --accent: var(--red); }
|
||||
.stat-high { --accent: var(--orange); }
|
||||
.stat-medium { --accent: var(--yellow); }
|
||||
.stat-low { --accent: var(--teal); }
|
||||
.stat-domains { --accent: var(--text-faint); }
|
||||
|
||||
.stat-top { display: flex; align-items: center; gap: 6px; }
|
||||
|
||||
.stat-led {
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
border-radius: 50%;
|
||||
background: var(--accent, var(--text-dim));
|
||||
}
|
||||
.stat-critical .stat-led { animation: pulse 1.5s ease-in-out infinite; }
|
||||
|
||||
.stat-num {
|
||||
font-size: 20px;
|
||||
font-size: 21px;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
line-height: 1.1;
|
||||
color: var(--accent, #fff);
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.stat-total .stat-num { color: #fff; }
|
||||
|
||||
.stat-lbl {
|
||||
font-size: 10px;
|
||||
color: #555;
|
||||
font-size: 8.5px;
|
||||
font-weight: 600;
|
||||
color: var(--text-faint);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
letter-spacing: .18em;
|
||||
}
|
||||
|
||||
.stat-critical .stat-num { color: #ff4444; }
|
||||
.stat-high .stat-num { color: #ff8c42; }
|
||||
.stat-medium .stat-num { color: #ffd166; }
|
||||
.stat-low .stat-num { color: #4ecdc4; }
|
||||
/* ------------------------------------------------ ticker */
|
||||
|
||||
.main {
|
||||
padding: 16px 24px;
|
||||
.ticker {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 9px;
|
||||
padding: 7px 24px;
|
||||
border-top: 1px solid var(--line);
|
||||
border-bottom: 1px solid var(--line);
|
||||
font-size: 10px;
|
||||
letter-spacing: .05em;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.ticker[hidden] { display: none; }
|
||||
|
||||
.ticker-dot {
|
||||
flex: none;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 50%;
|
||||
background: var(--amber);
|
||||
animation: pulse 1.5s ease-in-out infinite;
|
||||
}
|
||||
.ticker-label {
|
||||
flex: none;
|
||||
font-size: 8.5px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .2em;
|
||||
color: var(--amber);
|
||||
}
|
||||
.ticker-text {
|
||||
color: var(--text-dim);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.ticker-text code { color: var(--teal); }
|
||||
|
||||
/* ------------------------------------------------ table shell: titled border */
|
||||
|
||||
.main { padding: 14px 24px 20px; }
|
||||
|
||||
.titled {
|
||||
position: relative;
|
||||
border: 1px solid var(--line);
|
||||
background: var(--bg-raise);
|
||||
}
|
||||
.titled-label {
|
||||
position: absolute;
|
||||
top: -7px;
|
||||
left: 12px;
|
||||
z-index: 3;
|
||||
background: var(--bg);
|
||||
padding: 0 7px;
|
||||
font-size: 9.5px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .18em;
|
||||
color: var(--text-dim);
|
||||
text-transform: uppercase;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.titled-label::before { content: "● "; color: var(--amber); font-size: 7px; vertical-align: 1.5px; }
|
||||
.titled-meta {
|
||||
position: absolute;
|
||||
top: -7px;
|
||||
right: 12px;
|
||||
z-index: 3;
|
||||
background: var(--bg);
|
||||
padding: 0 7px;
|
||||
font-size: 9px;
|
||||
letter-spacing: .1em;
|
||||
color: var(--text-faint);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.findings-table {
|
||||
width: 100%;
|
||||
min-width: 980px;
|
||||
border-collapse: collapse;
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.findings-table thead th {
|
||||
padding: 8px 10px;
|
||||
padding: 12px 12px 8px;
|
||||
text-align: left;
|
||||
font-size: 10px;
|
||||
font-weight: 600;
|
||||
color: #555;
|
||||
font-size: 8.5px;
|
||||
font-weight: 700;
|
||||
color: var(--text-faint);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
border-bottom: 1px solid #1e1e1e;
|
||||
letter-spacing: .16em;
|
||||
border-bottom: 1px solid var(--line);
|
||||
white-space: nowrap;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
background: #0a0a0a;
|
||||
background: var(--bg-raise);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.findings-table tbody tr {
|
||||
border-bottom: 1px solid #141414;
|
||||
transition: background 0.1s;
|
||||
border-bottom: 1px solid rgba(26,34,51,.55);
|
||||
transition: background .1s var(--ease);
|
||||
}
|
||||
.findings-table tbody tr:last-child { border-bottom: none; }
|
||||
.findings-table tbody tr:hover { background: var(--bg-overlay); }
|
||||
|
||||
.findings-table tbody tr:hover {
|
||||
background: #111;
|
||||
/* severity accent on the row's leading edge — functional color coding */
|
||||
.findings-table tbody tr td:first-child { box-shadow: inset 2px 0 0 transparent; }
|
||||
.findings-table tbody tr.sev-critical td:first-child { box-shadow: inset 2px 0 0 var(--red); }
|
||||
.findings-table tbody tr.sev-high td:first-child { box-shadow: inset 2px 0 0 var(--orange); }
|
||||
.findings-table tbody tr.sev-medium td:first-child { box-shadow: inset 2px 0 0 var(--yellow); }
|
||||
.findings-table tbody tr.sev-low td:first-child { box-shadow: inset 2px 0 0 var(--teal); }
|
||||
.findings-table tbody tr.sev-info td:first-child { box-shadow: inset 2px 0 0 var(--text-faint); }
|
||||
|
||||
/* first-paint stagger */
|
||||
.findings-table tbody.fresh tr {
|
||||
opacity: 0;
|
||||
animation: row-in .35s var(--ease) forwards;
|
||||
animation-delay: calc(var(--i, 0) * 16ms);
|
||||
}
|
||||
@keyframes row-in {
|
||||
from { opacity: 0; transform: translateY(3px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
.findings-table td {
|
||||
padding: 8px 10px;
|
||||
padding: 7px 12px;
|
||||
vertical-align: middle;
|
||||
max-width: 280px;
|
||||
max-width: 220px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.td-num { color: var(--text-faint); font-size: 9.5px; }
|
||||
|
||||
/* severity badge — flat LED + label */
|
||||
.badge {
|
||||
display: inline-block;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
font-size: 10px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 3px 8px 3px 7px;
|
||||
font-size: 8.5px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.3px;
|
||||
letter-spacing: .14em;
|
||||
color: var(--sev, var(--text-dim));
|
||||
border: 1px solid color-mix(in srgb, var(--sev, #8b96a8) 45%, transparent);
|
||||
}
|
||||
|
||||
.badge-critical {
|
||||
background: #3a0a0a;
|
||||
color: #ff4444;
|
||||
border: 1px solid #5a1515;
|
||||
}
|
||||
|
||||
.badge-high {
|
||||
background: #3a1f0a;
|
||||
color: #ff8c42;
|
||||
border: 1px solid #5a3015;
|
||||
}
|
||||
|
||||
.badge-medium {
|
||||
background: #3a3a0a;
|
||||
color: #ffd166;
|
||||
border: 1px solid #5a5a15;
|
||||
}
|
||||
|
||||
.badge-low {
|
||||
background: #0a3a30;
|
||||
color: #4ecdc4;
|
||||
border: 1px solid #155a4a;
|
||||
.badge::before {
|
||||
content: "";
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
border-radius: 50%;
|
||||
background: var(--sev, var(--text-dim));
|
||||
}
|
||||
.badge-critical { --sev: var(--red); }
|
||||
.badge-critical::before { animation: pulse 1.5s ease-in-out infinite; }
|
||||
.badge-high { --sev: var(--orange); }
|
||||
.badge-medium { --sev: var(--yellow); }
|
||||
.badge-low { --sev: var(--teal); }
|
||||
.badge-info { --sev: var(--text-dim); }
|
||||
|
||||
.type-badge {
|
||||
display: inline-block;
|
||||
padding: 2px 6px;
|
||||
background: #1a1a1a;
|
||||
border: 1px solid #2a2a2a;
|
||||
border-radius: 4px;
|
||||
font-size: 10px;
|
||||
color: #888;
|
||||
font-family: "SF Mono", "Fira Code", monospace;
|
||||
padding: 2px 7px;
|
||||
background: var(--bg);
|
||||
border: 1px solid var(--line);
|
||||
font-size: 9px;
|
||||
letter-spacing: .06em;
|
||||
color: var(--text-dim);
|
||||
}
|
||||
|
||||
/* the recovered secret — teal mono chip, reverse video on hover */
|
||||
.match-value {
|
||||
font-family: "SF Mono", "Fira Code", "Consolas", monospace;
|
||||
font-size: 11px;
|
||||
background: #141414;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #1e1e1e;
|
||||
color: #4ecdc4;
|
||||
max-width: 260px;
|
||||
font-family: var(--mono);
|
||||
font-size: 10.5px;
|
||||
background: var(--bg);
|
||||
padding: 3px 8px;
|
||||
border: 1px solid rgba(69,208,196,.35);
|
||||
color: var(--teal);
|
||||
max-width: 220px;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
cursor: copy;
|
||||
transition: all .12s var(--ease);
|
||||
}
|
||||
.match-value:hover {
|
||||
background: var(--teal);
|
||||
border-color: var(--teal);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
.td-provider {
|
||||
font-weight: 600;
|
||||
color: #aaa;
|
||||
}
|
||||
.td-provider { font-weight: 700; color: var(--text); font-size: 10.5px; letter-spacing: .04em; max-width: 130px; }
|
||||
.td-pattern { color: var(--text-dim); font-size: 10px; max-width: 170px; }
|
||||
.td-domain { color: var(--amber); font-size: 10.5px; max-width: 180px; }
|
||||
.td-source { max-width: 200px; }
|
||||
.td-time { color: var(--text-faint); font-size: 10px; white-space: nowrap; }
|
||||
|
||||
.td-pattern {
|
||||
color: #888;
|
||||
font-size: 11px;
|
||||
}
|
||||
a { color: var(--teal); text-decoration: none; border-bottom: 1px dashed rgba(69,208,196,.4); }
|
||||
a:hover { color: var(--ink); background: var(--teal); border-bottom-color: var(--teal); }
|
||||
|
||||
.td-domain {
|
||||
color: #4a9eff;
|
||||
}
|
||||
|
||||
.td-time {
|
||||
color: #555;
|
||||
font-size: 11px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #4a9eff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
/* row actions — revealed on row hover */
|
||||
.td-actions { white-space: nowrap; text-align: right; }
|
||||
|
||||
.btn-icon {
|
||||
font-family: var(--mono);
|
||||
padding: 3px 8px;
|
||||
background: #1a1a1a;
|
||||
border: 1px solid #2a2a2a;
|
||||
border-radius: 4px;
|
||||
color: #888;
|
||||
font-size: 10px;
|
||||
background: transparent;
|
||||
border: 1px solid var(--line-strong);
|
||||
color: var(--text-faint);
|
||||
font-size: 9px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .08em;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
margin-right: 4px;
|
||||
transition: all 0.1s;
|
||||
opacity: .35;
|
||||
transition: all .12s var(--ease);
|
||||
}
|
||||
.findings-table tbody tr:hover .btn-icon,
|
||||
.btn-icon:focus-visible { opacity: 1; }
|
||||
.btn-icon:hover { color: var(--ink); background: var(--amber); border-color: var(--amber); }
|
||||
.btn-icon.copied { color: var(--ink); background: var(--green); border-color: var(--green); }
|
||||
.btn-icon-danger:hover { color: var(--ink); background: var(--red); border-color: var(--red); }
|
||||
|
||||
.btn-icon:hover {
|
||||
background: #222;
|
||||
color: #ccc;
|
||||
/* skeleton loading rows */
|
||||
.skl-row td { padding: 9px 12px; }
|
||||
.skl {
|
||||
height: 9px;
|
||||
background: linear-gradient(90deg, #0c1119 25%, #151c2b 50%, #0c1119 75%);
|
||||
background-size: 200% 100%;
|
||||
animation: shimmer 1.15s linear infinite;
|
||||
}
|
||||
.skl-w1 { width: 34%; } .skl-w2 { width: 62%; } .skl-w3 { width: 48%; } .skl-w4 { width: 78%; }
|
||||
@keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
|
||||
|
||||
.btn-icon-danger:hover {
|
||||
background: #2a1515;
|
||||
color: #ff6b6b;
|
||||
border-color: #4a2020;
|
||||
}
|
||||
/* ------------------------------------------------ empty state */
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 60px 20px;
|
||||
color: #444;
|
||||
padding: 56px 20px 50px;
|
||||
color: var(--text-faint);
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
font-size: 48px;
|
||||
margin-bottom: 16px;
|
||||
opacity: 0.3;
|
||||
.empty-radar { width: 72px; height: 72px; margin-bottom: 18px; opacity: .85; }
|
||||
.er-ring { fill: none; stroke: var(--line-strong); stroke-width: 1; }
|
||||
.er-cross { stroke: var(--line); stroke-width: 1; }
|
||||
.er-core { fill: var(--teal); }
|
||||
.er-sweep {
|
||||
fill: rgba(245,165,36,.16);
|
||||
transform-origin: 36px 36px;
|
||||
animation: radar-sweep 4.2s linear infinite;
|
||||
}
|
||||
|
||||
.empty-state p {
|
||||
font-size: 14px;
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
line-height: 1.6;
|
||||
.empty-title {
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .18em;
|
||||
text-transform: uppercase;
|
||||
color: var(--text-dim);
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.empty-copy {
|
||||
font-size: 10.5px;
|
||||
max-width: 420px;
|
||||
margin: 0 auto 12px;
|
||||
line-height: 1.7;
|
||||
color: var(--text-faint);
|
||||
}
|
||||
.empty-hint {
|
||||
font-size: 9.5px;
|
||||
letter-spacing: .1em;
|
||||
color: var(--amber);
|
||||
}
|
||||
.empty-hint::before { content: "» "; }
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
/* ------------------------------------------------ page footer */
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
.page-footer {
|
||||
margin-top: 14px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
letter-spacing: .14em;
|
||||
color: var(--text-faint);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.footer-sep { margin: 0 8px; color: var(--line-strong); }
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #333;
|
||||
border-radius: 4px;
|
||||
/* ------------------------------------------------ scrollbars */
|
||||
|
||||
::-webkit-scrollbar { width: 7px; height: 7px; }
|
||||
::-webkit-scrollbar-track { background: transparent; }
|
||||
::-webkit-scrollbar-thumb { background: #1c2536; }
|
||||
::-webkit-scrollbar-thumb:hover { background: #2a3650; }
|
||||
|
||||
/* ------------------------------------------------ reduced motion */
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after {
|
||||
animation-duration: .01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: .01ms !important;
|
||||
}
|
||||
}
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 59 KiB After Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 59 KiB After Width: | Height: | Size: 175 KiB |
+91
-7
@@ -1,5 +1,8 @@
|
||||
const KEYWORDS_KEY = "kf_keywords";
|
||||
const FINDINGS_KEY = "kf_findings";
|
||||
const MAX_FINDINGS = 5000;
|
||||
const MAX_KEYWORDS = 50;
|
||||
const MAX_KEYWORD_LENGTH = 50;
|
||||
|
||||
const DEFAULT_KEYWORDS = [
|
||||
"key", "api_key", "apikey", "api-key", "secret", "token",
|
||||
@@ -7,6 +10,76 @@ const DEFAULT_KEYWORDS = [
|
||||
"client_id", "client_secret"
|
||||
];
|
||||
|
||||
// Serialize all storage writes to prevent race conditions
|
||||
let storageQueue = Promise.resolve();
|
||||
function enqueue(fn) {
|
||||
storageQueue = storageQueue.then(fn, fn);
|
||||
return storageQueue;
|
||||
}
|
||||
|
||||
// --- Per-tab alert icon ---
|
||||
const alertTabs = new Set();
|
||||
let alertIconCache = null;
|
||||
|
||||
async function buildAlertIcons() {
|
||||
if (alertIconCache) return alertIconCache;
|
||||
const sizes = [16, 48];
|
||||
const imageData = {};
|
||||
for (const size of sizes) {
|
||||
const resp = await fetch(chrome.runtime.getURL(`icons/icon${size}.png`));
|
||||
const blob = await resp.blob();
|
||||
const bitmap = await createImageBitmap(blob);
|
||||
const canvas = new OffscreenCanvas(size, size);
|
||||
const ctx = canvas.getContext("2d");
|
||||
ctx.drawImage(bitmap, 0, 0, size, size);
|
||||
// Red alert dot in top-right
|
||||
const r = Math.max(3, Math.round(size * 0.22));
|
||||
const cx = size - r - 1;
|
||||
const cy = r + 1;
|
||||
ctx.beginPath();
|
||||
ctx.arc(cx, cy, r, 0, Math.PI * 2);
|
||||
ctx.fillStyle = "#ff4444";
|
||||
ctx.fill();
|
||||
ctx.lineWidth = size >= 48 ? 2 : 1;
|
||||
ctx.strokeStyle = "#0f0f0f";
|
||||
ctx.stroke();
|
||||
imageData[size] = ctx.getImageData(0, 0, size, size);
|
||||
}
|
||||
alertIconCache = imageData;
|
||||
return imageData;
|
||||
}
|
||||
|
||||
async function setAlertIcon(tabId) {
|
||||
if (alertTabs.has(tabId)) return;
|
||||
alertTabs.add(tabId);
|
||||
try {
|
||||
const imageData = await buildAlertIcons();
|
||||
await chrome.action.setIcon({ tabId, imageData });
|
||||
} catch {}
|
||||
}
|
||||
|
||||
function resetTabIcon(tabId) {
|
||||
if (!alertTabs.delete(tabId)) return;
|
||||
try {
|
||||
chrome.action.setIcon({
|
||||
tabId,
|
||||
path: { "16": "icons/icon16.png", "48": "icons/icon48.png", "128": "icons/icon128.png" }
|
||||
});
|
||||
} catch {}
|
||||
}
|
||||
|
||||
// Reset icon when a tab navigates to a new page
|
||||
chrome.tabs.onUpdated.addListener((tabId, changeInfo) => {
|
||||
if (changeInfo.status === "loading") {
|
||||
resetTabIcon(tabId);
|
||||
}
|
||||
});
|
||||
|
||||
// Clean up when a tab is closed
|
||||
chrome.tabs.onRemoved.addListener((tabId) => {
|
||||
alertTabs.delete(tabId);
|
||||
});
|
||||
|
||||
chrome.runtime.onInstalled.addListener(async (details) => {
|
||||
if (details.reason === "install") {
|
||||
await chrome.storage.local.set({
|
||||
@@ -18,7 +91,8 @@ chrome.runtime.onInstalled.addListener(async (details) => {
|
||||
|
||||
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
|
||||
if (request.type === "finding") {
|
||||
saveFinding(request.data).then(() => sendResponse({ ok: true }));
|
||||
if (sender.tab?.id) setAlertIcon(sender.tab.id);
|
||||
enqueue(() => saveFinding(request.data)).then(() => sendResponse({ ok: true }));
|
||||
return true;
|
||||
}
|
||||
if (request.type === "getKeywords") {
|
||||
@@ -30,19 +104,19 @@ chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
|
||||
return true;
|
||||
}
|
||||
if (request.type === "addKeyword") {
|
||||
addKeyword(request.keyword).then((result) => sendResponse(result));
|
||||
enqueue(() => addKeyword(request.keyword)).then((result) => sendResponse(result));
|
||||
return true;
|
||||
}
|
||||
if (request.type === "removeKeyword") {
|
||||
removeKeyword(request.keyword).then(() => sendResponse({ ok: true }));
|
||||
enqueue(() => removeKeyword(request.keyword)).then(() => sendResponse({ ok: true }));
|
||||
return true;
|
||||
}
|
||||
if (request.type === "removeFinding") {
|
||||
removeFinding(request.url).then(() => sendResponse({ ok: true }));
|
||||
enqueue(() => removeFinding(request.findingId)).then(() => sendResponse({ ok: true }));
|
||||
return true;
|
||||
}
|
||||
if (request.type === "clearFindings") {
|
||||
clearFindings().then(() => sendResponse({ ok: true }));
|
||||
enqueue(() => clearFindings()).then(() => sendResponse({ ok: true }));
|
||||
return true;
|
||||
}
|
||||
if (request.type === "exportFindings") {
|
||||
@@ -60,6 +134,8 @@ async function addKeyword(keyword) {
|
||||
const keywords = await getKeywords();
|
||||
const normalized = keyword.trim().toLowerCase();
|
||||
if (!normalized) return { ok: false, error: "Keyword cannot be empty." };
|
||||
if (normalized.length > MAX_KEYWORD_LENGTH) return { ok: false, error: `Keyword must be ${MAX_KEYWORD_LENGTH} characters or fewer.` };
|
||||
if (keywords.length >= MAX_KEYWORDS) return { ok: false, error: `Maximum of ${MAX_KEYWORDS} keywords allowed.` };
|
||||
if (keywords.includes(normalized)) return { ok: false, error: "Keyword already exists." };
|
||||
keywords.push(normalized);
|
||||
await chrome.storage.local.set({ [KEYWORDS_KEY]: keywords });
|
||||
@@ -82,7 +158,15 @@ async function saveFinding(finding) {
|
||||
(f) => f.url === finding.url && f.match === finding.match
|
||||
);
|
||||
if (isDuplicate) return;
|
||||
|
||||
finding.id = crypto.randomUUID();
|
||||
findings.push(finding);
|
||||
|
||||
// Evict oldest findings when cap is exceeded
|
||||
if (findings.length > MAX_FINDINGS) {
|
||||
findings.splice(0, findings.length - MAX_FINDINGS);
|
||||
}
|
||||
|
||||
await chrome.storage.local.set({ [FINDINGS_KEY]: findings });
|
||||
|
||||
const badgeCount = findings.length;
|
||||
@@ -90,9 +174,9 @@ async function saveFinding(finding) {
|
||||
chrome.action.setBadgeBackgroundColor({ color: "#e74c3c" });
|
||||
}
|
||||
|
||||
async function removeFinding(url) {
|
||||
async function removeFinding(findingId) {
|
||||
const findings = await getFindings();
|
||||
const updated = findings.filter((f) => f.url !== url);
|
||||
const updated = findings.filter((f) => f.id !== findingId);
|
||||
await chrome.storage.local.set({ [FINDINGS_KEY]: updated });
|
||||
chrome.action.setBadgeText({ text: updated.length > 0 ? String(updated.length) : "" });
|
||||
}
|
||||
|
||||
+138
-5
@@ -87,14 +87,17 @@
|
||||
|
||||
for (const kw of keywords) {
|
||||
const escaped = kw.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
||||
// Require word boundary around keyword to avoid matching "hotkey", "monkey", "turkey" for "key"
|
||||
const kwRegex = new RegExp(
|
||||
`(?:${escaped})\\s*[:=]\\s*['"\`]([^'"\`\\n]{8,200})['"\`]`,
|
||||
`(?:^|[^a-zA-Z])(?:${escaped})(?:[^a-zA-Z]|$)\\s*[:=]\\s*['"\`]([^'"\`\\n]{8,200})['"\`]`,
|
||||
"gi"
|
||||
);
|
||||
let m;
|
||||
while ((m = kwRegex.exec(text)) !== null) {
|
||||
const val = m[1];
|
||||
if (isFalsePositive(val)) continue;
|
||||
// Skip values that look like JS function/method names (camelCase identifiers)
|
||||
if (/^[a-z][a-zA-Z0-9_]*$/.test(val) && val.length < 60) continue;
|
||||
report({
|
||||
url: sourceUrl,
|
||||
match: val.substring(0, 200),
|
||||
@@ -185,7 +188,16 @@
|
||||
const name = (input.name || input.id || "").toLowerCase();
|
||||
const value = input.value;
|
||||
if (!value || value.length < 8) continue;
|
||||
const sensitive = ["token", "csrf", "api_key", "apikey", "secret", "auth", "session", "nonce", "key", "access_token"];
|
||||
// Skip known framework CSRF tokens — these are ephemeral anti-CSRF nonces, not secrets
|
||||
const csrfNames = ["authenticity_token", "csrf_token", "csrf", "_csrf", "__requestverificationtoken",
|
||||
"csrfmiddlewaretoken", "react-codespace-csrf", "_token", "xsrf-token", "anticsrf"];
|
||||
if (csrfNames.some((c) => name === c || name.startsWith(c))) continue;
|
||||
// Skip common non-secret hidden fields
|
||||
const benignNames = ["return_to", "redirect", "redirect_uri", "next", "ref", "referer",
|
||||
"utm_source", "utm_medium", "utm_campaign", "notice_name", "host", "method",
|
||||
"pinned_items_id_and_type[]", "repo_topics[]", "timestamp_secret"];
|
||||
if (benignNames.some((b) => name === b || name.startsWith(b))) continue;
|
||||
const sensitive = ["api_key", "apikey", "secret_key", "access_token", "private_key", "password"];
|
||||
if (sensitive.some((s) => name.includes(s)) || isHighEntropy(value)) {
|
||||
report({
|
||||
url: pageUrl, match: `${name}=${value.substring(0, 100)}`,
|
||||
@@ -200,10 +212,20 @@
|
||||
|
||||
function scanDataAttributes() {
|
||||
const all = document.querySelectorAll("*");
|
||||
// Attribute names that contain "key" but are not secrets
|
||||
const ignoredAttrs = [
|
||||
"data-hotkey", "data-hotkey-scope", "data-hotkey-within", // Keyboard shortcuts
|
||||
"data-provider-key", // UI provider identifiers
|
||||
"data-pjax-key", "data-turbo-key", // Framework routing keys
|
||||
];
|
||||
for (const el of all) {
|
||||
for (const attr of el.attributes) {
|
||||
if (!/^data-.*(?:key|token|secret|auth|api|credential|password)/i.test(attr.name)) continue;
|
||||
if (!attr.value || attr.value.length < 8) continue;
|
||||
// Skip known non-secret data attributes
|
||||
if (ignoredAttrs.includes(attr.name)) continue;
|
||||
// Skip if the value looks like a keyboard shortcut (contains Mod+, Shift+, etc.)
|
||||
if (/(?:Mod|Shift|Alt|Ctrl|Meta)\+/i.test(attr.value)) continue;
|
||||
report({
|
||||
url: pageUrl, match: `${attr.name}="${attr.value.substring(0, 100)}"`,
|
||||
type: "data-attribute", patternName: "Sensitive Data Attribute",
|
||||
@@ -226,6 +248,12 @@
|
||||
|
||||
function scanLinkHrefs() {
|
||||
const links = document.querySelectorAll("a[href], link[href]");
|
||||
// URL param names that look sensitive but aren't
|
||||
const benignParams = ["author", "assignee", "reviewer", "creator", "user", "username",
|
||||
"sort", "order", "page", "per_page", "tab", "type", "language", "q", "query",
|
||||
"ref", "branch", "path", "since", "until", "direction", "state", "label",
|
||||
"source", "plan", "return_to", "redirect", "onload", "render", "style",
|
||||
"method", "host", "fromHostedPage", "countryBlackList"];
|
||||
for (const link of links) {
|
||||
try {
|
||||
const href = link.href;
|
||||
@@ -233,8 +261,10 @@
|
||||
const url = new URL(href);
|
||||
for (const [param, value] of url.searchParams) {
|
||||
const p = param.toLowerCase();
|
||||
const sensitive = ["key", "api_key", "apikey", "token", "secret", "access_token", "auth", "password", "session_id"];
|
||||
if (sensitive.some((s) => p.includes(s)) && value.length >= 8) {
|
||||
if (benignParams.includes(p)) continue;
|
||||
const sensitive = ["api_key", "apikey", "token", "secret", "access_token", "password", "session_id", "private_key"];
|
||||
// Require exact match on the param name, not substring — "author" was matching "auth"
|
||||
if (sensitive.some((s) => p === s || p.endsWith(`_${s}`) || p.startsWith(`${s}_`)) && value.length >= 8) {
|
||||
report({
|
||||
url: href, match: `${param}=${value.substring(0, 100)}`,
|
||||
type: "url-param", patternName: "Sensitive URL Parameter",
|
||||
@@ -251,6 +281,28 @@
|
||||
{ store: localStorage, label: "localStorage" },
|
||||
{ store: sessionStorage, label: "sessionStorage" },
|
||||
];
|
||||
// Keys that are known non-sensitive framework/platform storage — never flag these
|
||||
const ignoredKeyPrefixes = [
|
||||
"ref-selector:", // GitHub branch selector cache
|
||||
"jump_to:", // GitHub navigation cache
|
||||
"soft-nav:", // GitHub SPA navigation state
|
||||
"react-router-scroll", // React Router scroll positions
|
||||
"COPILOT_SELECTED_MODEL", // GitHub Copilot UI preference
|
||||
"rc::", // reCAPTCHA state
|
||||
"debug:", // Debug flags
|
||||
"ajs_", // Analytics.js state
|
||||
"_ga", // Google Analytics
|
||||
"intercom", // Intercom chat widget
|
||||
"amplitude_", // Amplitude analytics
|
||||
"mp_", // Mixpanel
|
||||
"optimizely", // Optimizely experiments
|
||||
];
|
||||
// Specific exact keys that look sensitive but aren't
|
||||
const ignoredExactKeys = [
|
||||
"COPILOT_AUTH_TOKEN", // GitHub Copilot ephemeral session (browser-local, not extractable)
|
||||
"COPILOT_AUTH_TOKEN:expiry",
|
||||
"id", // Generic session IDs in iframes (e.g., Stripe m.stripe.network)
|
||||
];
|
||||
for (const { store, label } of stores) {
|
||||
try {
|
||||
for (let i = 0; i < store.length; i++) {
|
||||
@@ -258,7 +310,14 @@
|
||||
const value = store.getItem(key);
|
||||
if (!value || value.length < 12) continue;
|
||||
const kl = key.toLowerCase();
|
||||
const sensitive = ["token", "key", "secret", "auth", "session", "credential", "password", "jwt", "bearer"];
|
||||
// Skip known benign keys
|
||||
if (ignoredKeyPrefixes.some((p) => key.startsWith(p))) continue;
|
||||
if (ignoredExactKeys.includes(key)) continue;
|
||||
// Skip keys whose values are clearly JSON branch/ref data (GitHub caches)
|
||||
if (value.startsWith('{"refs":') || value.startsWith('{"billing":')) continue;
|
||||
const sensitive = ["token", "secret", "auth", "credential", "password", "jwt", "bearer", "private_key"];
|
||||
// Require a stronger match — "key" alone is too broad (matches "hotkey", "monkey", etc.)
|
||||
// Remove "key" and "session" from sensitive list to reduce noise
|
||||
if (sensitive.some((s) => kl.includes(s)) || isHighEntropy(value.substring(0, 100))) {
|
||||
report({
|
||||
url: pageUrl, match: `${label}.${key}=${value.substring(0, 120)}`,
|
||||
@@ -294,9 +353,13 @@
|
||||
} catch {}
|
||||
}
|
||||
|
||||
const kfNonce = document.documentElement.getAttribute("data-kf-verify") || "";
|
||||
document.documentElement.removeAttribute("data-kf-verify");
|
||||
|
||||
window.addEventListener("__kf_finding__", (e) => {
|
||||
const data = e.detail;
|
||||
if (!data) return;
|
||||
if (data.__kfNonce !== kfNonce) return;
|
||||
|
||||
if (data.rawText) {
|
||||
scanText(data.rawText, data.sourceUrl || pageUrl, data.type);
|
||||
@@ -327,6 +390,76 @@
|
||||
scanCookies();
|
||||
await scanExternalScripts();
|
||||
|
||||
// Observe DOM mutations for SPA support
|
||||
const observer = new MutationObserver((mutations) => {
|
||||
for (const mutation of mutations) {
|
||||
for (const node of mutation.addedNodes) {
|
||||
if (node.nodeType !== Node.ELEMENT_NODE) continue;
|
||||
if (node.tagName === "SCRIPT") {
|
||||
if (node.src) {
|
||||
// New external script added
|
||||
for (const kw of keywords) {
|
||||
if (node.src.toLowerCase().includes(kw)) {
|
||||
report({
|
||||
url: node.src, match: node.src, type: "script-src",
|
||||
patternName: `Script URL contains: ${kw}`,
|
||||
severity: "medium", confidence: "medium", provider: "URL Scan",
|
||||
});
|
||||
}
|
||||
}
|
||||
} else if (node.textContent) {
|
||||
scanText(node.textContent, pageUrl, "inline-script");
|
||||
}
|
||||
}
|
||||
// Scan any new hidden inputs
|
||||
const hiddenInputs = node.matches && node.matches('input[type="hidden"]')
|
||||
? [node]
|
||||
: (node.querySelectorAll ? Array.from(node.querySelectorAll('input[type="hidden"]')) : []);
|
||||
for (const input of hiddenInputs) {
|
||||
const name = (input.name || input.id || "").toLowerCase();
|
||||
const value = input.value;
|
||||
if (!value || value.length < 8) continue;
|
||||
// Skip known CSRF tokens
|
||||
const csrfNames = ["authenticity_token", "csrf_token", "csrf", "_csrf", "__requestverificationtoken",
|
||||
"csrfmiddlewaretoken", "react-codespace-csrf", "_token", "xsrf-token", "anticsrf"];
|
||||
if (csrfNames.some((c) => name === c || name.startsWith(c))) continue;
|
||||
const benignNames = ["return_to", "redirect", "redirect_uri", "next", "ref",
|
||||
"notice_name", "host", "method", "pinned_items_id_and_type[]", "repo_topics[]", "timestamp_secret"];
|
||||
if (benignNames.some((b) => name === b || name.startsWith(b))) continue;
|
||||
const sensitive = ["api_key", "apikey", "secret_key", "access_token", "private_key", "password"];
|
||||
if (sensitive.some((s) => name.includes(s)) || isHighEntropy(value)) {
|
||||
report({
|
||||
url: pageUrl, match: `${name}=${value.substring(0, 100)}`,
|
||||
type: "hidden-input", patternName: "Hidden Form Field",
|
||||
severity: isHighEntropy(value) ? "high" : "medium",
|
||||
confidence: sensitive.some((s) => name.includes(s)) ? "high" : "medium",
|
||||
provider: "DOM Scan",
|
||||
});
|
||||
}
|
||||
}
|
||||
// Scan data attributes on new elements
|
||||
const elementsToCheck = node.querySelectorAll ? [node, ...node.querySelectorAll("*")] : [node];
|
||||
const ignoredAttrsMut = ["data-hotkey", "data-hotkey-scope", "data-hotkey-within", "data-provider-key", "data-pjax-key", "data-turbo-key"];
|
||||
for (const el of elementsToCheck) {
|
||||
if (!el.attributes) continue;
|
||||
for (const attr of el.attributes) {
|
||||
if (!/^data-.*(?:key|token|secret|auth|api|credential|password)/i.test(attr.name)) continue;
|
||||
if (!attr.value || attr.value.length < 8) continue;
|
||||
if (ignoredAttrsMut.includes(attr.name)) continue;
|
||||
if (/(?:Mod|Shift|Alt|Ctrl|Meta)\+/i.test(attr.value)) continue;
|
||||
report({
|
||||
url: pageUrl, match: `${attr.name}="${attr.value.substring(0, 100)}"`,
|
||||
type: "data-attribute", patternName: "Sensitive Data Attribute",
|
||||
severity: "medium", confidence: isHighEntropy(attr.value) ? "high" : "medium",
|
||||
provider: "DOM Scan",
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
observer.observe(document.body || document.documentElement, { childList: true, subtree: true });
|
||||
|
||||
if (seen.size > 0) {
|
||||
console.log(`[KeyFinder] ${seen.size} potential secret(s) found on ${pageDomain}`);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
(function () {
|
||||
"use strict";
|
||||
|
||||
const nonce = crypto.randomUUID();
|
||||
|
||||
// Store nonce where both MAIN world (interceptor) and ISOLATED world (content.js) can read it.
|
||||
// The interceptor removes data-kf-nonce after reading; data-kf-verify stays for content.js.
|
||||
const el = document.documentElement;
|
||||
el.setAttribute("data-kf-nonce", nonce);
|
||||
el.setAttribute("data-kf-verify", nonce);
|
||||
|
||||
const script = document.createElement("script");
|
||||
script.src = chrome.runtime.getURL("js/interceptor.js");
|
||||
(document.head || document.documentElement).appendChild(script);
|
||||
script.onload = () => script.remove();
|
||||
})();
|
||||
+36
-17
@@ -2,8 +2,11 @@
|
||||
"use strict";
|
||||
|
||||
const EVENT_NAME = "__kf_finding__";
|
||||
const nonce = document.documentElement.getAttribute("data-kf-nonce") || "";
|
||||
document.documentElement.removeAttribute("data-kf-nonce");
|
||||
|
||||
function emit(data) {
|
||||
data.__kfNonce = nonce;
|
||||
window.dispatchEvent(new CustomEvent(EVENT_NAME, { detail: data }));
|
||||
}
|
||||
|
||||
@@ -36,23 +39,39 @@
|
||||
"__ENV__", "__CONFIG__", "ENV", "CONFIG",
|
||||
];
|
||||
|
||||
for (const name of globalNames) {
|
||||
try {
|
||||
const val = window[name];
|
||||
if (val === undefined || val === null) continue;
|
||||
const str = typeof val === "object" ? JSON.stringify(val) : String(val);
|
||||
if (str.length < 8 || str === "[object Object]") continue;
|
||||
emit({
|
||||
match: `window.${name}=${str.substring(0, 200)}`,
|
||||
type: "window-global",
|
||||
patternName: "Exposed Global Variable",
|
||||
severity: "high",
|
||||
confidence: typeof val !== "object" && isHighEntropy(str.substring(0, 60)) ? "high" : "medium",
|
||||
provider: "JS Global Scan",
|
||||
isObject: typeof val === "object",
|
||||
rawText: typeof val === "object" ? str.substring(0, 5000) : null,
|
||||
});
|
||||
} catch {}
|
||||
const scannedGlobals = new Set();
|
||||
function scanGlobals() {
|
||||
for (const name of globalNames) {
|
||||
if (scannedGlobals.has(name)) continue;
|
||||
try {
|
||||
const val = window[name];
|
||||
if (val === undefined || val === null) continue;
|
||||
const str = typeof val === "object" ? JSON.stringify(val) : String(val);
|
||||
if (str.length < 8 || str === "[object Object]") continue;
|
||||
scannedGlobals.add(name);
|
||||
emit({
|
||||
match: `window.${name}=${str.substring(0, 200)}`,
|
||||
type: "window-global",
|
||||
patternName: "Exposed Global Variable",
|
||||
severity: "high",
|
||||
confidence: typeof val !== "object" && isHighEntropy(str.substring(0, 60)) ? "high" : "medium",
|
||||
provider: "JS Global Scan",
|
||||
isObject: typeof val === "object",
|
||||
rawText: typeof val === "object" ? str.substring(0, 5000) : null,
|
||||
});
|
||||
} catch {}
|
||||
}
|
||||
}
|
||||
// Run at document_start (likely empty), DOMContentLoaded, and load to catch
|
||||
// globals set at any phase. Each name reports at most once via scannedGlobals.
|
||||
scanGlobals();
|
||||
if (document.readyState === "loading") {
|
||||
document.addEventListener("DOMContentLoaded", scanGlobals, { once: true });
|
||||
}
|
||||
if (document.readyState !== "complete") {
|
||||
window.addEventListener("load", scanGlobals, { once: true });
|
||||
} else {
|
||||
scanGlobals();
|
||||
}
|
||||
|
||||
const origXhrOpen = XMLHttpRequest.prototype.open;
|
||||
|
||||
+1
-1
@@ -76,7 +76,7 @@ const SECRET_PATTERNS = [
|
||||
{ name: "Shopify Private App Token", re: /\bshppa_[a-fA-F0-9]{32}\b/g, severity: "critical", confidence: "high", provider: "Shopify" },
|
||||
{ name: "Shopify Shared Secret", re: /\bshpss_[a-fA-F0-9]{32}\b/g, severity: "critical", confidence: "high", provider: "Shopify" },
|
||||
|
||||
{ name: "Sentry DSN", re: /https:\/\/[0-9a-f]{32}@(?:o[0-9]+\.)?(?:sentry\.io|[a-z0-9.-]+)\/[0-9]+/g, severity: "medium", confidence: "high", provider: "Sentry" },
|
||||
{ name: "Sentry DSN", re: /https:\/\/[0-9a-f]{32}@(?:o[0-9]+\.)?(?:sentry\.io|[a-z0-9.-]+)\/[0-9]+/g, severity: "low", confidence: "high", provider: "Sentry" },
|
||||
{ name: "Sentry Auth Token", re: /\bsntrys_[A-Za-z0-9_]{64,}\b/g, severity: "high", confidence: "high", provider: "Sentry" },
|
||||
|
||||
{ name: "New Relic API Key", re: /\bNRAK-[A-Z0-9]{27}\b/g, severity: "high", confidence: "high", provider: "New Relic" },
|
||||
|
||||
+57
-4
@@ -1,21 +1,71 @@
|
||||
document.addEventListener("DOMContentLoaded", init);
|
||||
|
||||
const REDUCE_MOTION = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
||||
|
||||
let lastKeywords = 0;
|
||||
let lastFindings = 0;
|
||||
let termBooted = false;
|
||||
|
||||
async function init() {
|
||||
const versionLabel = document.getElementById("versionLabel");
|
||||
if (versionLabel) versionLabel.textContent = "v" + chrome.runtime.getManifest().version;
|
||||
await renderKeywords();
|
||||
await renderStats();
|
||||
updateTermLine(true);
|
||||
termBooted = true;
|
||||
document.getElementById("keywordForm").addEventListener("submit", handleAddKeyword);
|
||||
}
|
||||
|
||||
/* eased count-up for stat numerals */
|
||||
function setNumber(el, target) {
|
||||
if (!el) return;
|
||||
const from = parseInt(el.textContent, 10);
|
||||
const start = Number.isFinite(from) ? from : 0;
|
||||
if (REDUCE_MOTION || start === target) {
|
||||
el.textContent = target;
|
||||
return;
|
||||
}
|
||||
const duration = 380;
|
||||
const t0 = performance.now();
|
||||
(function tick(t) {
|
||||
const p = Math.min(1, (t - t0) / duration);
|
||||
const eased = 1 - Math.pow(1 - p, 3);
|
||||
el.textContent = Math.round(start + (target - start) * eased);
|
||||
if (p < 1) requestAnimationFrame(tick);
|
||||
})(t0);
|
||||
}
|
||||
|
||||
/* terminal status line — types once per popup open, instant after */
|
||||
function updateTermLine(typed) {
|
||||
const el = document.getElementById("termText");
|
||||
if (!el) return;
|
||||
const text = `kf> scan armed :: ${lastKeywords} keywords :: ${lastFindings} findings`;
|
||||
if (!typed || REDUCE_MOTION) {
|
||||
el.textContent = text;
|
||||
return;
|
||||
}
|
||||
let i = 0;
|
||||
(function type() {
|
||||
el.textContent = text.slice(0, ++i);
|
||||
if (i < text.length) setTimeout(type, 14);
|
||||
})();
|
||||
}
|
||||
|
||||
async function renderKeywords() {
|
||||
const response = await chrome.runtime.sendMessage({ type: "getKeywords" });
|
||||
const keywords = response.keywords || [];
|
||||
const list = document.getElementById("keywordList");
|
||||
list.innerHTML = "";
|
||||
|
||||
document.getElementById("keywordCount").textContent = keywords.length;
|
||||
lastKeywords = keywords.length;
|
||||
setNumber(document.getElementById("keywordCount"), keywords.length);
|
||||
if (termBooted) updateTermLine(false);
|
||||
|
||||
if (keywords.length === 0) {
|
||||
list.innerHTML = '<li class="empty-state">No keywords configured</li>';
|
||||
const empty = document.createElement("li");
|
||||
empty.className = "empty-state";
|
||||
empty.textContent = "no keywords configured";
|
||||
list.appendChild(empty);
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -29,7 +79,7 @@ async function renderKeywords() {
|
||||
|
||||
const removeBtn = document.createElement("button");
|
||||
removeBtn.className = "keyword-remove";
|
||||
removeBtn.textContent = "\u00D7";
|
||||
removeBtn.textContent = "×";
|
||||
removeBtn.title = `Remove "${kw}"`;
|
||||
removeBtn.addEventListener("click", () => handleRemoveKeyword(kw));
|
||||
|
||||
@@ -42,7 +92,9 @@ async function renderKeywords() {
|
||||
async function renderStats() {
|
||||
const response = await chrome.runtime.sendMessage({ type: "getFindings" });
|
||||
const findings = response.findings || [];
|
||||
document.getElementById("findingCount").textContent = findings.length;
|
||||
lastFindings = findings.length;
|
||||
setNumber(document.getElementById("findingCount"), findings.length);
|
||||
if (termBooted) updateTermLine(false);
|
||||
}
|
||||
|
||||
async function handleAddKeyword(e) {
|
||||
@@ -66,6 +118,7 @@ async function handleAddKeyword(e) {
|
||||
}
|
||||
|
||||
input.value = "";
|
||||
input.focus();
|
||||
await renderKeywords();
|
||||
}
|
||||
|
||||
|
||||
+211
-33
@@ -1,14 +1,24 @@
|
||||
let allFindings = [];
|
||||
let firstRenderDone = false;
|
||||
|
||||
const REDUCE_MOTION = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
||||
|
||||
document.addEventListener("DOMContentLoaded", init);
|
||||
|
||||
async function init() {
|
||||
const versionLabel = document.getElementById("versionLabel");
|
||||
if (versionLabel) versionLabel.textContent = "v" + chrome.runtime.getManifest().version;
|
||||
|
||||
renderSkeleton();
|
||||
|
||||
const response = await chrome.runtime.sendMessage({ type: "getFindings" });
|
||||
allFindings = response.findings || [];
|
||||
|
||||
populateFilters();
|
||||
renderStats();
|
||||
renderFindings();
|
||||
renderTicker();
|
||||
firstRenderDone = true;
|
||||
|
||||
document.getElementById("severityFilter").addEventListener("change", renderFindings);
|
||||
document.getElementById("typeFilter").addEventListener("change", renderFindings);
|
||||
@@ -17,6 +27,57 @@ async function init() {
|
||||
document.getElementById("exportJsonBtn").addEventListener("click", exportJson);
|
||||
document.getElementById("exportCsvBtn").addEventListener("click", exportCsv);
|
||||
document.getElementById("clearBtn").addEventListener("click", clearAll);
|
||||
|
||||
const searchBox = document.getElementById("searchBox");
|
||||
document.addEventListener("keydown", (e) => {
|
||||
const tag = document.activeElement && document.activeElement.tagName;
|
||||
const typing = tag === "INPUT" || tag === "SELECT" || tag === "TEXTAREA";
|
||||
if (e.key === "/" && !typing) {
|
||||
e.preventDefault();
|
||||
searchBox.focus();
|
||||
} else if (e.key === "Escape" && document.activeElement === searchBox) {
|
||||
searchBox.value = "";
|
||||
renderFindings();
|
||||
searchBox.blur();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/* eased count-up for stat numerals */
|
||||
function setNumber(el, target) {
|
||||
if (!el) return;
|
||||
const from = parseInt(el.textContent, 10);
|
||||
const start = Number.isFinite(from) ? from : 0;
|
||||
if (REDUCE_MOTION || start === target) {
|
||||
el.textContent = target;
|
||||
return;
|
||||
}
|
||||
const duration = 400;
|
||||
const t0 = performance.now();
|
||||
(function tick(t) {
|
||||
const p = Math.min(1, (t - t0) / duration);
|
||||
const eased = 1 - Math.pow(1 - p, 3);
|
||||
el.textContent = Math.round(start + (target - start) * eased);
|
||||
if (p < 1) requestAnimationFrame(tick);
|
||||
})(t0);
|
||||
}
|
||||
|
||||
function renderSkeleton() {
|
||||
const tbody = document.getElementById("findingsBody");
|
||||
tbody.classList.remove("fresh");
|
||||
tbody.innerHTML = "";
|
||||
const widths = ["skl-w2", "skl-w1", "skl-w3", "skl-w4", "skl-w2", "skl-w3"];
|
||||
for (let i = 0; i < 6; i++) {
|
||||
const tr = document.createElement("tr");
|
||||
tr.className = "skl-row";
|
||||
const td = document.createElement("td");
|
||||
td.colSpan = 10;
|
||||
const bar = document.createElement("div");
|
||||
bar.className = "skl " + widths[i % widths.length];
|
||||
td.appendChild(bar);
|
||||
tr.appendChild(td);
|
||||
tbody.appendChild(tr);
|
||||
}
|
||||
}
|
||||
|
||||
function getFiltered() {
|
||||
@@ -65,54 +126,96 @@ function renderStats() {
|
||||
|
||||
bar.innerHTML = "";
|
||||
const stats = [
|
||||
{ label: "Total", value: allFindings.length, cls: "stat-total" },
|
||||
{ label: "Critical", value: critical, cls: "stat-critical" },
|
||||
{ label: "High", value: high, cls: "stat-high" },
|
||||
{ label: "Medium", value: medium, cls: "stat-medium" },
|
||||
{ label: "Low", value: low, cls: "stat-low" },
|
||||
{ label: "Domains", value: domains, cls: "stat-domains" },
|
||||
{ label: "Total", value: allFindings.length, cls: "stat-total", filter: "all" },
|
||||
{ label: "Critical", value: critical, cls: "stat-critical", filter: "critical" },
|
||||
{ label: "High", value: high, cls: "stat-high", filter: "high" },
|
||||
{ label: "Medium", value: medium, cls: "stat-medium", filter: "medium" },
|
||||
{ label: "Low", value: low, cls: "stat-low", filter: "low" },
|
||||
{ label: "Domains", value: domains, cls: "stat-domains", filter: null },
|
||||
];
|
||||
for (const s of stats) {
|
||||
const el = document.createElement("div");
|
||||
el.className = `stat-item ${s.cls}`;
|
||||
const num = document.createElement("span");
|
||||
num.className = "stat-num";
|
||||
num.textContent = s.value;
|
||||
|
||||
const top = document.createElement("span");
|
||||
top.className = "stat-top";
|
||||
const led = document.createElement("span");
|
||||
led.className = "stat-led";
|
||||
const lbl = document.createElement("span");
|
||||
lbl.className = "stat-lbl";
|
||||
lbl.textContent = s.label;
|
||||
top.appendChild(led);
|
||||
top.appendChild(lbl);
|
||||
|
||||
const num = document.createElement("span");
|
||||
num.className = "stat-num";
|
||||
|
||||
el.appendChild(top);
|
||||
el.appendChild(num);
|
||||
el.appendChild(lbl);
|
||||
setNumber(num, s.value);
|
||||
|
||||
if (s.filter) {
|
||||
el.dataset.filter = s.filter;
|
||||
el.title = s.filter === "all" ? "Show all severities" : `Filter: ${s.label.toLowerCase()} only`;
|
||||
el.addEventListener("click", () => {
|
||||
document.getElementById("severityFilter").value = s.filter;
|
||||
renderFindings();
|
||||
});
|
||||
}
|
||||
bar.appendChild(el);
|
||||
}
|
||||
}
|
||||
|
||||
function syncStatActive() {
|
||||
const current = document.getElementById("severityFilter").value;
|
||||
document.querySelectorAll(".stat-item[data-filter]").forEach((el) => {
|
||||
el.classList.toggle("active", el.dataset.filter === current);
|
||||
});
|
||||
}
|
||||
|
||||
function renderFindings() {
|
||||
const filtered = getFiltered();
|
||||
const tbody = document.getElementById("findingsBody");
|
||||
const empty = document.getElementById("emptyState");
|
||||
|
||||
tbody.innerHTML = "";
|
||||
tbody.classList.toggle("fresh", !firstRenderDone && !REDUCE_MOTION);
|
||||
|
||||
updateMeta(filtered.length);
|
||||
syncStatActive();
|
||||
|
||||
if (filtered.length === 0) {
|
||||
const title = document.getElementById("emptyTitle");
|
||||
const copy = document.getElementById("emptyCopy");
|
||||
if (allFindings.length === 0) {
|
||||
title.textContent = "No findings yet";
|
||||
copy.textContent = "KeyFinder passively scans every page you visit. Browse around — leaked keys, tokens and credentials will surface here.";
|
||||
} else {
|
||||
title.textContent = "No matches in view";
|
||||
copy.textContent = "The current filters hide every finding. Adjust or clear them to bring results back.";
|
||||
}
|
||||
empty.hidden = false;
|
||||
return;
|
||||
}
|
||||
empty.hidden = true;
|
||||
|
||||
const severityOrder = { critical: 0, high: 1, medium: 2, low: 3, info: 4 };
|
||||
filtered.sort((a, b) => (severityOrder[a.severity] || 5) - (severityOrder[b.severity] || 5));
|
||||
filtered.sort((a, b) => (severityOrder[a.severity] ?? 5) - (severityOrder[b.severity] ?? 5));
|
||||
|
||||
filtered.forEach((f, i) => {
|
||||
const sev = f.severity || "medium";
|
||||
const tr = document.createElement("tr");
|
||||
tr.className = "sev-" + sev;
|
||||
if (i < 30) tr.style.setProperty("--i", i);
|
||||
|
||||
const tdNum = document.createElement("td");
|
||||
tdNum.textContent = i + 1;
|
||||
tdNum.textContent = String(i + 1).padStart(2, "0");
|
||||
tdNum.className = "td-num";
|
||||
|
||||
const tdSev = document.createElement("td");
|
||||
const badge = document.createElement("span");
|
||||
badge.className = `badge badge-${f.severity || "medium"}`;
|
||||
badge.textContent = (f.severity || "medium").toUpperCase();
|
||||
badge.className = `badge badge-${sev}`;
|
||||
badge.textContent = sev.toUpperCase();
|
||||
tdSev.appendChild(badge);
|
||||
|
||||
const tdProvider = document.createElement("td");
|
||||
@@ -127,7 +230,11 @@ function renderFindings() {
|
||||
const matchCode = document.createElement("code");
|
||||
matchCode.textContent = f.match || "-";
|
||||
matchCode.className = "match-value";
|
||||
matchCode.title = f.match || "";
|
||||
matchCode.title = "click to copy\n" + (f.match || "");
|
||||
matchCode.addEventListener("click", () => {
|
||||
navigator.clipboard.writeText(f.match || "");
|
||||
flashCopied(copyBtn);
|
||||
});
|
||||
tdMatch.appendChild(matchCode);
|
||||
|
||||
const tdType = document.createElement("td");
|
||||
@@ -141,42 +248,45 @@ function renderFindings() {
|
||||
tdDomain.className = "td-domain";
|
||||
|
||||
const tdSource = document.createElement("td");
|
||||
tdSource.className = "td-source";
|
||||
if (f.url && f.url.startsWith("http")) {
|
||||
const a = document.createElement("a");
|
||||
a.href = f.url;
|
||||
a.target = "_blank";
|
||||
a.rel = "noopener";
|
||||
a.textContent = truncateUrl(f.url, 40);
|
||||
a.textContent = truncateUrl(f.url, 30);
|
||||
a.title = f.url;
|
||||
tdSource.appendChild(a);
|
||||
} else {
|
||||
tdSource.textContent = f.url ? truncateUrl(f.url, 40) : "-";
|
||||
tdSource.textContent = f.url ? truncateUrl(f.url, 30) : "-";
|
||||
}
|
||||
|
||||
const tdTime = document.createElement("td");
|
||||
tdTime.textContent = f.timestamp ? formatTime(f.timestamp) : "-";
|
||||
tdTime.className = "td-time";
|
||||
if (f.timestamp) tdTime.title = new Date(f.timestamp).toLocaleString();
|
||||
|
||||
const tdActions = document.createElement("td");
|
||||
tdActions.className = "td-actions";
|
||||
const copyBtn = document.createElement("button");
|
||||
copyBtn.className = "btn-icon";
|
||||
copyBtn.textContent = "Copy";
|
||||
copyBtn.textContent = "copy";
|
||||
copyBtn.title = "Copy match value";
|
||||
copyBtn.addEventListener("click", () => {
|
||||
navigator.clipboard.writeText(f.match || "");
|
||||
copyBtn.textContent = "Done";
|
||||
setTimeout(() => (copyBtn.textContent = "Copy"), 1500);
|
||||
flashCopied(copyBtn);
|
||||
});
|
||||
|
||||
const delBtn = document.createElement("button");
|
||||
delBtn.className = "btn-icon btn-icon-danger";
|
||||
delBtn.textContent = "Del";
|
||||
delBtn.textContent = "del";
|
||||
delBtn.title = "Remove finding";
|
||||
delBtn.addEventListener("click", async () => {
|
||||
await chrome.runtime.sendMessage({ type: "removeFinding", url: f.url });
|
||||
allFindings = allFindings.filter((x) => x !== f);
|
||||
await chrome.runtime.sendMessage({ type: "removeFinding", findingId: f.id });
|
||||
allFindings = allFindings.filter((x) => x.id !== f.id);
|
||||
renderStats();
|
||||
renderFindings();
|
||||
renderTicker();
|
||||
});
|
||||
|
||||
tdActions.appendChild(copyBtn);
|
||||
@@ -196,6 +306,58 @@ function renderFindings() {
|
||||
});
|
||||
}
|
||||
|
||||
function flashCopied(btn) {
|
||||
if (!btn) return;
|
||||
btn.textContent = "copied";
|
||||
btn.classList.add("copied");
|
||||
setTimeout(() => {
|
||||
btn.textContent = "copy";
|
||||
btn.classList.remove("copied");
|
||||
}, 1200);
|
||||
}
|
||||
|
||||
function updateMeta(shown) {
|
||||
const metaLine = document.getElementById("metaLine");
|
||||
if (metaLine) {
|
||||
metaLine.innerHTML = "";
|
||||
metaLine.append(
|
||||
"showing ",
|
||||
strong(shown),
|
||||
" of ",
|
||||
strong(allFindings.length)
|
||||
);
|
||||
}
|
||||
const shellMeta = document.getElementById("shellMeta");
|
||||
if (shellMeta) shellMeta.textContent = shown + (shown === 1 ? " row" : " rows");
|
||||
}
|
||||
|
||||
function strong(n) {
|
||||
const el = document.createElement("strong");
|
||||
el.textContent = n;
|
||||
return el;
|
||||
}
|
||||
|
||||
function renderTicker() {
|
||||
const ticker = document.getElementById("ticker");
|
||||
const tickerText = document.getElementById("tickerText");
|
||||
if (!ticker || !tickerText) return;
|
||||
if (!allFindings.length) {
|
||||
ticker.hidden = true;
|
||||
return;
|
||||
}
|
||||
const latest = [...allFindings].sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0))[0];
|
||||
tickerText.innerHTML = "";
|
||||
const head = document.createElement("span");
|
||||
head.textContent = `${latest.provider || "unknown"} · ${latest.patternName || "match"} @ ${latest.domain || "—"} `;
|
||||
tickerText.appendChild(head);
|
||||
if (latest.match) {
|
||||
const code = document.createElement("code");
|
||||
code.textContent = truncateUrl(latest.match, 28);
|
||||
tickerText.appendChild(code);
|
||||
}
|
||||
ticker.hidden = false;
|
||||
}
|
||||
|
||||
function truncateUrl(url, max) {
|
||||
if (url.length <= max) return url;
|
||||
return url.substring(0, max - 3) + "...";
|
||||
@@ -203,7 +365,15 @@ function truncateUrl(url, max) {
|
||||
|
||||
function formatTime(ts) {
|
||||
const d = new Date(ts);
|
||||
return d.toLocaleDateString() + " " + d.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
|
||||
const diff = Date.now() - d.getTime();
|
||||
const m = Math.floor(diff / 60000);
|
||||
if (m < 1) return "just now";
|
||||
if (m < 60) return m + "m ago";
|
||||
const h = Math.floor(m / 60);
|
||||
if (h < 24) return h + "h ago";
|
||||
const days = Math.floor(h / 24);
|
||||
if (days < 7) return days + "d ago";
|
||||
return d.toLocaleDateString();
|
||||
}
|
||||
|
||||
function exportJson() {
|
||||
@@ -212,19 +382,26 @@ function exportJson() {
|
||||
downloadBlob(blob, `keyfinder-findings-${Date.now()}.json`);
|
||||
}
|
||||
|
||||
function csvSafe(value) {
|
||||
let str = String(value || "");
|
||||
if (/^[=+\-@\t\r\n]/.test(str)) str = "'" + str;
|
||||
str = str.replace(/"/g, '""');
|
||||
return `"${str}"`;
|
||||
}
|
||||
|
||||
function exportCsv() {
|
||||
const filtered = getFiltered();
|
||||
const headers = ["Severity", "Provider", "Pattern", "Match", "Type", "Domain", "URL", "Page URL", "Timestamp"];
|
||||
const rows = filtered.map((f) => [
|
||||
f.severity || "",
|
||||
f.provider || "",
|
||||
f.patternName || "",
|
||||
`"${(f.match || "").replace(/"/g, '""')}"`,
|
||||
f.type || "",
|
||||
f.domain || "",
|
||||
f.url || "",
|
||||
f.pageUrl || "",
|
||||
f.timestamp ? new Date(f.timestamp).toISOString() : "",
|
||||
csvSafe(f.severity),
|
||||
csvSafe(f.provider),
|
||||
csvSafe(f.patternName),
|
||||
csvSafe(f.match),
|
||||
csvSafe(f.type),
|
||||
csvSafe(f.domain),
|
||||
csvSafe(f.url),
|
||||
csvSafe(f.pageUrl),
|
||||
csvSafe(f.timestamp ? new Date(f.timestamp).toISOString() : ""),
|
||||
]);
|
||||
const csv = [headers.join(","), ...rows.map((r) => r.join(","))].join("\n");
|
||||
const blob = new Blob([csv], { type: "text/csv" });
|
||||
@@ -246,4 +423,5 @@ async function clearAll() {
|
||||
allFindings = [];
|
||||
renderStats();
|
||||
renderFindings();
|
||||
renderTicker();
|
||||
}
|
||||
|
||||
+16
-5
@@ -1,12 +1,15 @@
|
||||
{
|
||||
"name": "KeyFinder",
|
||||
"description": "Passively discovers API keys, tokens, and secrets leaked in page scripts, DOM, network responses, and browser storage.",
|
||||
"version": "2.0.0",
|
||||
"description": "Passively discovers API keys, tokens, and secrets leaked in page scripts, DOM, network responses, and browser storage. Available for Chrome and Firefox.",
|
||||
"version": "2.2.1",
|
||||
"manifest_version": 3,
|
||||
"browser_specific_settings": {
|
||||
"gecko": {
|
||||
"id": "keyfinder@momenbasel.com",
|
||||
"strict_min_version": "128.0"
|
||||
"strict_min_version": "128.0",
|
||||
"data_collection_permissions": {
|
||||
"required": ["none"]
|
||||
}
|
||||
}
|
||||
},
|
||||
"action": {
|
||||
@@ -31,14 +34,22 @@
|
||||
},
|
||||
{
|
||||
"matches": ["<all_urls>"],
|
||||
"js": ["js/interceptor.js"],
|
||||
"js": ["js/interceptor-loader.js"],
|
||||
"run_at": "document_start",
|
||||
"world": "MAIN",
|
||||
"all_frames": true
|
||||
}
|
||||
],
|
||||
"content_security_policy": {
|
||||
"extension_pages": "script-src 'self'; object-src 'self'"
|
||||
},
|
||||
"background": {
|
||||
"scripts": ["js/background.js"]
|
||||
},
|
||||
"web_accessible_resources": [
|
||||
{
|
||||
"resources": ["js/interceptor.js"],
|
||||
"matches": ["<all_urls>"]
|
||||
}
|
||||
],
|
||||
"permissions": ["activeTab", "storage"]
|
||||
}
|
||||
|
||||
+12
-4
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "KeyFinder",
|
||||
"description": "Passively discovers API keys, tokens, and secrets leaked in page scripts, DOM, network responses, and browser storage.",
|
||||
"version": "2.0.0",
|
||||
"description": "Passively discovers API keys, tokens, and secrets leaked in page scripts, DOM, network responses, and browser storage. Available for Chrome and Firefox.",
|
||||
"version": "2.2.1",
|
||||
"manifest_version": 3,
|
||||
"action": {
|
||||
"default_icon": {
|
||||
@@ -25,14 +25,22 @@
|
||||
},
|
||||
{
|
||||
"matches": ["<all_urls>"],
|
||||
"js": ["js/interceptor.js"],
|
||||
"js": ["js/interceptor-loader.js"],
|
||||
"run_at": "document_start",
|
||||
"world": "MAIN",
|
||||
"all_frames": true
|
||||
}
|
||||
],
|
||||
"content_security_policy": {
|
||||
"extension_pages": "script-src 'self'; object-src 'self'"
|
||||
},
|
||||
"background": {
|
||||
"service_worker": "js/background.js"
|
||||
},
|
||||
"web_accessible_resources": [
|
||||
{
|
||||
"resources": ["js/interceptor.js"],
|
||||
"matches": ["<all_urls>"]
|
||||
}
|
||||
],
|
||||
"permissions": ["activeTab", "storage"]
|
||||
}
|
||||
|
||||
+19
-13
@@ -9,31 +9,36 @@
|
||||
<body>
|
||||
<header class="header">
|
||||
<div class="header-brand">
|
||||
<img src="icons/icon48.png" alt="KeyFinder" class="header-icon">
|
||||
<h1>KeyFinder</h1>
|
||||
<span class="version">v2.0</span>
|
||||
<span class="radar" aria-hidden="true">
|
||||
<img src="icons/icon48.png" alt="" class="header-icon">
|
||||
</span>
|
||||
<div class="brand-text">
|
||||
<h1>KEYFINDER<span class="version" id="versionLabel"></span></h1>
|
||||
<p class="header-tagline">passive secret discovery</p>
|
||||
</div>
|
||||
<span class="live-badge" title="Passive scanning is active"><span class="live-dot"></span>ARMED</span>
|
||||
</div>
|
||||
<p class="header-tagline">Passive API key & secret discovery</p>
|
||||
</header>
|
||||
|
||||
<section class="stats" id="stats">
|
||||
<div class="stat-card">
|
||||
<span class="stat-number" id="findingCount">-</span>
|
||||
<span class="stat-label">Findings</span>
|
||||
<div class="stat-card stat-findings">
|
||||
<span class="stat-top"><span class="stat-led" aria-hidden="true"></span><span class="stat-label">Findings</span></span>
|
||||
<span class="stat-number" id="findingCount">–</span>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<span class="stat-number" id="keywordCount">-</span>
|
||||
<span class="stat-label">Keywords</span>
|
||||
<div class="stat-card stat-keywords">
|
||||
<span class="stat-top"><span class="stat-led" aria-hidden="true"></span><span class="stat-label">Keywords</span></span>
|
||||
<span class="stat-number" id="keywordCount">–</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<h2 class="section-title">Keywords</h2>
|
||||
<h2 class="section-title">Watchlist<span class="section-sub">// custom keywords</span></h2>
|
||||
<form id="keywordForm" class="keyword-form">
|
||||
<span class="prompt" aria-hidden="true">›</span>
|
||||
<input
|
||||
type="text"
|
||||
id="keywordInput"
|
||||
placeholder="Add a keyword (e.g. api_key)"
|
||||
placeholder="add keyword, e.g. api_key"
|
||||
autocomplete="off"
|
||||
spellcheck="false"
|
||||
>
|
||||
@@ -44,8 +49,9 @@
|
||||
</section>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="term-line" aria-live="polite"><span class="term-text" id="termText"></span><span class="term-cursor" aria-hidden="true"></span></div>
|
||||
<a href="results.html" target="_blank" id="resultsLink" class="results-btn">
|
||||
View Findings
|
||||
View Findings <span class="btn-arrow" aria-hidden="true">→</span>
|
||||
</a>
|
||||
</footer>
|
||||
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 65 KiB |
@@ -0,0 +1,127 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>KeyFinder — banner</title>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
body {
|
||||
width: 1280px;
|
||||
height: 640px;
|
||||
background: #05070c;
|
||||
font-family: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco, Consolas, monospace;
|
||||
color: #d6dde8;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
}
|
||||
.lockup { text-align: center; }
|
||||
|
||||
/* radar ring around the key */
|
||||
.radar {
|
||||
position: relative;
|
||||
width: 108px;
|
||||
height: 108px;
|
||||
margin: 0 auto;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #2a3650;
|
||||
background: #090d14;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
}
|
||||
.radar::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: -1px;
|
||||
border-radius: 50%;
|
||||
background: conic-gradient(from 0deg, #f5a524 0deg, rgba(245,165,36,.15) 60deg, transparent 95deg);
|
||||
-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 1.5px));
|
||||
mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 1.5px));
|
||||
}
|
||||
.radar::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 22px; left: 26px;
|
||||
width: 4px; height: 4px;
|
||||
border-radius: 50%;
|
||||
background: #45d0c4;
|
||||
}
|
||||
.radar img { width: 58px; height: 58px; }
|
||||
|
||||
h1 {
|
||||
margin-top: 26px;
|
||||
color: #fff;
|
||||
font-size: 62px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .22em;
|
||||
padding-left: .22em;
|
||||
}
|
||||
.ver {
|
||||
display: inline-block;
|
||||
vertical-align: 14px;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
letter-spacing: .08em;
|
||||
color: #525d70;
|
||||
border: 1px solid #1a2233;
|
||||
padding: 3px 7px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.tag {
|
||||
margin-top: 16px;
|
||||
color: #f5a524;
|
||||
font-size: 15px;
|
||||
letter-spacing: .26em;
|
||||
}
|
||||
|
||||
.chips {
|
||||
margin-top: 34px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
}
|
||||
.chip {
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .14em;
|
||||
text-transform: uppercase;
|
||||
padding: 7px 14px;
|
||||
border: 1px solid #2a3650;
|
||||
color: #8b96a8;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
}
|
||||
.chip i {
|
||||
width: 4px; height: 4px;
|
||||
border-radius: 50%;
|
||||
background: currentColor;
|
||||
font-style: normal;
|
||||
}
|
||||
.chip-amber { color: #f5a524; border-color: rgba(245,165,36,.45); }
|
||||
.chip-teal { color: #45d0c4; border-color: rgba(69,208,196,.45); }
|
||||
|
||||
.providers {
|
||||
margin-top: 30px;
|
||||
font-size: 11px;
|
||||
letter-spacing: .14em;
|
||||
color: #525d70;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.providers b { color: #f5a524; font-weight: 600; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="lockup">
|
||||
<div class="radar"><img src="../icons/icon128.png" alt=""></div>
|
||||
<h1>KEYFINDER<span class="ver">[v2.2.1]</span></h1>
|
||||
<div class="tag">// PASSIVE API KEY & SECRET DISCOVERY</div>
|
||||
<div class="chips">
|
||||
<span class="chip chip-amber"><i></i>Chrome extension</span>
|
||||
<span class="chip chip-teal"><i></i>Firefox add-on</span>
|
||||
<span class="chip"><i></i>Manifest V3</span>
|
||||
<span class="chip"><i></i>80+ patterns</span>
|
||||
</div>
|
||||
<div class="providers"><b>AWS</b> · GCP · Azure · Stripe · GitHub · Slack · OpenAI · and 70+ more</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,57 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>KeyFinder — film title</title>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
body {
|
||||
width: 1280px;
|
||||
height: 720px;
|
||||
background: #05070c;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
font-family: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco, Consolas, monospace;
|
||||
}
|
||||
.card { text-align: center; }
|
||||
.icon { width: 76px; height: 76px; }
|
||||
h1 {
|
||||
color: #fff;
|
||||
font-size: 46px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .28em;
|
||||
margin-top: 20px;
|
||||
padding-left: .28em; /* optical centering with tracking */
|
||||
}
|
||||
.tag {
|
||||
color: #f5a524;
|
||||
font-size: 14px;
|
||||
letter-spacing: .22em;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.spec {
|
||||
color: #525d70;
|
||||
font-size: 11px;
|
||||
letter-spacing: .16em;
|
||||
margin-top: 26px;
|
||||
}
|
||||
.spec b { color: #8b96a8; font-weight: 600; }
|
||||
.led {
|
||||
display: inline-block;
|
||||
width: 6px; height: 6px;
|
||||
border-radius: 50%;
|
||||
background: #3ddc97;
|
||||
margin-right: 8px;
|
||||
vertical-align: 1px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="card">
|
||||
<img class="icon" src="../icons/icon128.png" alt="">
|
||||
<h1>KEYFINDER</h1>
|
||||
<div class="tag">// PASSIVE SECRET DISCOVERY</div>
|
||||
<div class="spec"><span class="led"></span><b>v2.2.1</b> · 80+ PATTERNS · 10 ATTACK SURFACES · LOCAL-ONLY</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 452 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
@@ -0,0 +1,61 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>KeyFinder</title>
|
||||
<link rel="stylesheet" href="../css/popup.css">
|
||||
</head>
|
||||
<body>
|
||||
<header class="header">
|
||||
<div class="header-brand">
|
||||
<span class="radar" aria-hidden="true">
|
||||
<img src="../icons/icon48.png" alt="" class="header-icon">
|
||||
</span>
|
||||
<div class="brand-text">
|
||||
<h1>KEYFINDER<span class="version" id="versionLabel"></span></h1>
|
||||
<p class="header-tagline">passive secret discovery</p>
|
||||
</div>
|
||||
<span class="live-badge" title="Passive scanning is active"><span class="live-dot"></span>ARMED</span>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="stats" id="stats">
|
||||
<div class="stat-card stat-findings">
|
||||
<span class="stat-top"><span class="stat-led" aria-hidden="true"></span><span class="stat-label">Findings</span></span>
|
||||
<span class="stat-number" id="findingCount">–</span>
|
||||
</div>
|
||||
<div class="stat-card stat-keywords">
|
||||
<span class="stat-top"><span class="stat-led" aria-hidden="true"></span><span class="stat-label">Keywords</span></span>
|
||||
<span class="stat-number" id="keywordCount">–</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<h2 class="section-title">Watchlist<span class="section-sub">// custom keywords</span></h2>
|
||||
<form id="keywordForm" class="keyword-form">
|
||||
<span class="prompt" aria-hidden="true">›</span>
|
||||
<input
|
||||
type="text"
|
||||
id="keywordInput"
|
||||
placeholder="add keyword, e.g. api_key"
|
||||
autocomplete="off"
|
||||
spellcheck="false"
|
||||
>
|
||||
<button type="submit" id="addBtn">Add</button>
|
||||
</form>
|
||||
<div id="errorMsg" class="error-msg" hidden></div>
|
||||
<ul id="keywordList" class="keyword-list"></ul>
|
||||
</section>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="term-line" aria-live="polite"><span class="term-text" id="termText"></span><span class="term-cursor" aria-hidden="true"></span></div>
|
||||
<a href="../results.html" target="_blank" id="resultsLink" class="results-btn">
|
||||
View Findings <span class="btn-arrow" aria-hidden="true">→</span>
|
||||
</a>
|
||||
</footer>
|
||||
|
||||
<script src="preview-stub.js"></script>
|
||||
<script src="../js/popup.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,46 @@
|
||||
// Preview-only stub for the chrome.* extension API with realistic sample data.
|
||||
// Loaded before the real popup.js / results.js in preview/*.html files.
|
||||
// NOT shipped — build.sh only copies the explicit SHARED_FILES list.
|
||||
(function () {
|
||||
const NOW = Date.now();
|
||||
const MIN = 60 * 1000;
|
||||
const HOUR = 60 * MIN;
|
||||
const DAY = 24 * HOUR;
|
||||
|
||||
const SAMPLE_FINDINGS = [
|
||||
{ id: "f1", severity: "critical", provider: "AWS", patternName: "AWS Access Key ID", match: "AKIAIOSFODNN7EXAMPLE", type: "inline-script", domain: "dashboard.acme.io", url: "https://dashboard.acme.io/assets/app.js", pageUrl: "https://dashboard.acme.io/", timestamp: NOW - 4 * MIN },
|
||||
{ id: "f2", severity: "critical", provider: "Stripe", patternName: "Stripe Live Secret Key", match: "sk_live_4eC39HqLyj…T1zdp7dc", type: "network-response", domain: "api.shopfront.dev", url: "https://api.shopfront.dev/v2/config", pageUrl: "https://shopfront.dev/", timestamp: NOW - 26 * MIN },
|
||||
{ id: "f3", severity: "critical", provider: "OpenAI", patternName: "OpenAI API Key", match: "sk-proj-abc123def456ghi789jkl", type: "web-storage", domain: "playground.internal.tools", url: "https://playground.internal.tools/", pageUrl: "https://playground.internal.tools/", timestamp: NOW - 2 * HOUR },
|
||||
{ id: "f4", severity: "high", provider: "GitHub", patternName: "GitHub Personal Access Token", match: "ghp_16C7e42F292c6912E7710c838347Ae178B4a", type: "html-comment", domain: "gitmirror.example.org", url: "https://gitmirror.example.org/login", pageUrl: "https://gitmirror.example.org/", timestamp: NOW - 3 * HOUR },
|
||||
{ id: "f5", severity: "high", provider: "Slack", patternName: "Slack Bot Token", match: "xoxb-17653672481-19874698323-pdLjLl…CwXgE", type: "inline-script", domain: "status.teamchat.app", url: "https://status.teamchat.app/embed.js", pageUrl: "https://status.teamchat.app/", timestamp: NOW - 5 * HOUR },
|
||||
{ id: "f6", severity: "high", provider: "MongoDB", patternName: "MongoDB Connection String", match: "mongodb+srv://admin:p4ssw0rd@cluster0.mongodb.net/prod", type: "data-attribute", domain: "metrics.saasly.co", url: "https://metrics.saasly.co/", pageUrl: "https://metrics.saasly.co/", timestamp: NOW - 9 * HOUR },
|
||||
{ id: "f7", severity: "high", provider: "DOM Scan", patternName: "Sensitive Meta Tag", match: "csrf-token=9f8e7d6c5b4a3210", type: "meta-tag", domain: "legacy.corpnet.com", url: "https://legacy.corpnet.com/index.html", pageUrl: "https://legacy.corpnet.com/", timestamp: NOW - 14 * HOUR },
|
||||
{ id: "f8", severity: "medium", provider: "Generic", patternName: "JSON Web Token (JWT)", match: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIn0.dozjgNryP4J3jVmNHl0w5N_XgL0n3I9PlFUP0THsR8U", type: "url-param", domain: "auth.redirectlab.net", url: "https://auth.redirectlab.net/callback?token=eyJhbGciOi...", pageUrl: "https://redirectlab.net/", timestamp: NOW - 20 * HOUR },
|
||||
{ id: "f9", severity: "medium", provider: "DOM Scan", patternName: "Hidden Form Field", match: "session_id=a8f5f167f44f4964e6c998dee827110c", type: "hidden-input", domain: "shop.example.com", url: "https://shop.example.com/checkout", pageUrl: "https://shop.example.com/", timestamp: NOW - 1 * DAY },
|
||||
{ id: "f10", severity: "medium", provider: "URL Scan", patternName: "High-Entropy URL Parameter", match: "sig=4c4f6e6f2d9a4b8c8d7e6f5a4b3c2d1e", type: "url-param", domain: "cdn.medialab.io", url: "https://cdn.medialab.io/v/assets?sig=4c4f6e...", pageUrl: "https://medialab.io/", timestamp: NOW - 2 * DAY },
|
||||
{ id: "f11", severity: "medium", provider: "Web Storage", patternName: "localStorage Secret", match: "refresh_token=def502001a2b3c4d5e6f", type: "web-storage", domain: "app.notesync.dev", url: "https://app.notesync.dev/", pageUrl: "https://app.notesync.dev/", timestamp: NOW - 3 * DAY },
|
||||
{ id: "f12", severity: "low", provider: "Generic", patternName: "Keyword: client_id", match: "client_id=Iv1.8a61f9b3a7aba766", type: "script-src", domain: "login.oauthflow.app", url: "https://login.oauthflow.app/js/oauth.js?client_id=Iv1.8a61f9b3a7aba766", pageUrl: "https://login.oauthflow.app/", timestamp: NOW - 4 * DAY },
|
||||
];
|
||||
|
||||
const SAMPLE_KEYWORDS = [
|
||||
"key", "api_key", "apikey", "api-key", "secret", "token",
|
||||
"access_token", "auth", "credential", "password", "client_id", "client_secret",
|
||||
];
|
||||
|
||||
window.chrome = {
|
||||
runtime: {
|
||||
getManifest: () => ({ version: "2.2.1" }),
|
||||
sendMessage: async (msg) => {
|
||||
switch (msg && msg.type) {
|
||||
case "getFindings": return { findings: [] };
|
||||
case "getKeywords": return { keywords: SAMPLE_KEYWORDS.slice() };
|
||||
case "addKeyword": return { ok: true };
|
||||
case "removeKeyword": return { ok: true };
|
||||
case "removeFinding": return { ok: true };
|
||||
case "clearFindings": return { ok: true };
|
||||
default: return {};
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
})();
|
||||
@@ -0,0 +1,46 @@
|
||||
// Preview-only stub for the chrome.* extension API with realistic sample data.
|
||||
// Loaded before the real popup.js / results.js in preview/*.html files.
|
||||
// NOT shipped — build.sh only copies the explicit SHARED_FILES list.
|
||||
(function () {
|
||||
const NOW = Date.now();
|
||||
const MIN = 60 * 1000;
|
||||
const HOUR = 60 * MIN;
|
||||
const DAY = 24 * HOUR;
|
||||
|
||||
const SAMPLE_FINDINGS = [
|
||||
{ id: "f1", severity: "critical", provider: "AWS", patternName: "AWS Access Key ID", match: "AKIAIOSFODNN7EXAMPLE", type: "inline-script", domain: "dashboard.acme.io", url: "https://dashboard.acme.io/assets/app.js", pageUrl: "https://dashboard.acme.io/", timestamp: NOW - 4 * MIN },
|
||||
{ id: "f2", severity: "critical", provider: "Stripe", patternName: "Stripe Live Secret Key", match: "sk_live_4eC39HqLyj…T1zdp7dc", type: "network-response", domain: "api.shopfront.dev", url: "https://api.shopfront.dev/v2/config", pageUrl: "https://shopfront.dev/", timestamp: NOW - 26 * MIN },
|
||||
{ id: "f3", severity: "critical", provider: "OpenAI", patternName: "OpenAI API Key", match: "sk-proj-abc123def456ghi789jkl", type: "web-storage", domain: "playground.internal.tools", url: "https://playground.internal.tools/", pageUrl: "https://playground.internal.tools/", timestamp: NOW - 2 * HOUR },
|
||||
{ id: "f4", severity: "high", provider: "GitHub", patternName: "GitHub Personal Access Token", match: "ghp_16C7e42F292c6912E7710c838347Ae178B4a", type: "html-comment", domain: "gitmirror.example.org", url: "https://gitmirror.example.org/login", pageUrl: "https://gitmirror.example.org/", timestamp: NOW - 3 * HOUR },
|
||||
{ id: "f5", severity: "high", provider: "Slack", patternName: "Slack Bot Token", match: "xoxb-17653672481-19874698323-pdLjLl…CwXgE", type: "inline-script", domain: "status.teamchat.app", url: "https://status.teamchat.app/embed.js", pageUrl: "https://status.teamchat.app/", timestamp: NOW - 5 * HOUR },
|
||||
{ id: "f6", severity: "high", provider: "MongoDB", patternName: "MongoDB Connection String", match: "mongodb+srv://admin:p4ssw0rd@cluster0.mongodb.net/prod", type: "data-attribute", domain: "metrics.saasly.co", url: "https://metrics.saasly.co/", pageUrl: "https://metrics.saasly.co/", timestamp: NOW - 9 * HOUR },
|
||||
{ id: "f7", severity: "high", provider: "DOM Scan", patternName: "Sensitive Meta Tag", match: "csrf-token=9f8e7d6c5b4a3210", type: "meta-tag", domain: "legacy.corpnet.com", url: "https://legacy.corpnet.com/index.html", pageUrl: "https://legacy.corpnet.com/", timestamp: NOW - 14 * HOUR },
|
||||
{ id: "f8", severity: "medium", provider: "Generic", patternName: "JSON Web Token (JWT)", match: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIn0.dozjgNryP4J3jVmNHl0w5N_XgL0n3I9PlFUP0THsR8U", type: "url-param", domain: "auth.redirectlab.net", url: "https://auth.redirectlab.net/callback?token=eyJhbGciOi...", pageUrl: "https://redirectlab.net/", timestamp: NOW - 20 * HOUR },
|
||||
{ id: "f9", severity: "medium", provider: "DOM Scan", patternName: "Hidden Form Field", match: "session_id=a8f5f167f44f4964e6c998dee827110c", type: "hidden-input", domain: "shop.example.com", url: "https://shop.example.com/checkout", pageUrl: "https://shop.example.com/", timestamp: NOW - 1 * DAY },
|
||||
{ id: "f10", severity: "medium", provider: "URL Scan", patternName: "High-Entropy URL Parameter", match: "sig=4c4f6e6f2d9a4b8c8d7e6f5a4b3c2d1e", type: "url-param", domain: "cdn.medialab.io", url: "https://cdn.medialab.io/v/assets?sig=4c4f6e...", pageUrl: "https://medialab.io/", timestamp: NOW - 2 * DAY },
|
||||
{ id: "f11", severity: "medium", provider: "Web Storage", patternName: "localStorage Secret", match: "refresh_token=def502001a2b3c4d5e6f", type: "web-storage", domain: "app.notesync.dev", url: "https://app.notesync.dev/", pageUrl: "https://app.notesync.dev/", timestamp: NOW - 3 * DAY },
|
||||
{ id: "f12", severity: "low", provider: "Generic", patternName: "Keyword: client_id", match: "client_id=Iv1.8a61f9b3a7aba766", type: "script-src", domain: "login.oauthflow.app", url: "https://login.oauthflow.app/js/oauth.js?client_id=Iv1.8a61f9b3a7aba766", pageUrl: "https://login.oauthflow.app/", timestamp: NOW - 4 * DAY },
|
||||
];
|
||||
|
||||
const SAMPLE_KEYWORDS = [
|
||||
"key", "api_key", "apikey", "api-key", "secret", "token",
|
||||
"access_token", "auth", "credential", "password", "client_id", "client_secret",
|
||||
];
|
||||
|
||||
window.chrome = {
|
||||
runtime: {
|
||||
getManifest: () => ({ version: "2.2.1" }),
|
||||
sendMessage: async (msg) => {
|
||||
switch (msg && msg.type) {
|
||||
case "getFindings": return { findings: SAMPLE_FINDINGS.slice() };
|
||||
case "getKeywords": return { keywords: SAMPLE_KEYWORDS.slice() };
|
||||
case "addKeyword": return { ok: true };
|
||||
case "removeKeyword": return { ok: true };
|
||||
case "removeFinding": return { ok: true };
|
||||
case "clearFindings": return { ok: true };
|
||||
default: return {};
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
})();
|
||||
@@ -0,0 +1,122 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>KeyFinder — Findings Console</title>
|
||||
<link rel="stylesheet" href="../css/results.css">
|
||||
</head>
|
||||
<body>
|
||||
<header class="header">
|
||||
<div class="header-row">
|
||||
<div class="header-left">
|
||||
<span class="radar" aria-hidden="true">
|
||||
<img src="../icons/icon48.png" alt="" class="header-icon">
|
||||
</span>
|
||||
<div class="brand-text">
|
||||
<h1>KEYFINDER<span class="version" id="versionLabel"></span></h1>
|
||||
<p class="header-sub">findings console</p>
|
||||
</div>
|
||||
<span class="live-badge" title="Passive scanning is active"><span class="live-dot"></span>PASSIVE</span>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<div class="search-wrap">
|
||||
<span class="search-glyph" aria-hidden="true">⚲</span>
|
||||
<input type="text" id="searchBox" placeholder="search findings…" autocomplete="off" spellcheck="false">
|
||||
<kbd class="kbd" title="Press / to focus search">/</kbd>
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<button id="exportJsonBtn" class="btn btn-secondary" title="Download filtered findings as JSON">↓ JSON</button>
|
||||
<button id="exportCsvBtn" class="btn btn-secondary" title="Download filtered findings as CSV">↓ CSV</button>
|
||||
<button id="clearBtn" class="btn btn-danger" title="Remove all findings">× Clear</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-row header-row-filters">
|
||||
<div class="filter-group">
|
||||
<label class="filter">
|
||||
<span class="filter-label">sev</span>
|
||||
<select id="severityFilter">
|
||||
<option value="all">all</option>
|
||||
<option value="critical">critical</option>
|
||||
<option value="high">high</option>
|
||||
<option value="medium">medium</option>
|
||||
<option value="low">low</option>
|
||||
</select>
|
||||
</label>
|
||||
<label class="filter">
|
||||
<span class="filter-label">type</span>
|
||||
<select id="typeFilter">
|
||||
<option value="all">all</option>
|
||||
</select>
|
||||
</label>
|
||||
<label class="filter">
|
||||
<span class="filter-label">provider</span>
|
||||
<select id="providerFilter">
|
||||
<option value="all">all</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="meta-line" id="metaLine"></div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="stats-bar" id="statsBar"></div>
|
||||
|
||||
<div class="ticker" id="ticker" hidden>
|
||||
<span class="ticker-dot" aria-hidden="true"></span>
|
||||
<span class="ticker-label">LATEST</span>
|
||||
<span class="ticker-text" id="tickerText"></span>
|
||||
</div>
|
||||
|
||||
<main class="main">
|
||||
<div class="table-shell">
|
||||
<div class="shell-head">
|
||||
<span class="shell-title">findings.log</span>
|
||||
<span class="shell-meta" id="shellMeta"></span>
|
||||
</div>
|
||||
<table class="findings-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Severity</th>
|
||||
<th>Provider</th>
|
||||
<th>Pattern</th>
|
||||
<th>Match</th>
|
||||
<th>Type</th>
|
||||
<th>Domain</th>
|
||||
<th>Source</th>
|
||||
<th>Time</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="findingsBody"></tbody>
|
||||
</table>
|
||||
<div id="emptyState" class="empty-state" hidden>
|
||||
<svg class="empty-radar" viewBox="0 0 72 72" aria-hidden="true">
|
||||
<circle cx="36" cy="36" r="30" class="er-ring"/>
|
||||
<circle cx="36" cy="36" r="20" class="er-ring"/>
|
||||
<circle cx="36" cy="36" r="10" class="er-ring"/>
|
||||
<line x1="36" y1="6" x2="36" y2="66" class="er-cross"/>
|
||||
<line x1="6" y1="36" x2="66" y2="36" class="er-cross"/>
|
||||
<path d="M36 36 L36 6 A30 30 0 0 1 57.2 14.8 Z" class="er-sweep"/>
|
||||
<circle cx="36" cy="36" r="2.5" class="er-core"/>
|
||||
</svg>
|
||||
<p class="empty-title" id="emptyTitle">No findings yet</p>
|
||||
<p class="empty-copy" id="emptyCopy">KeyFinder passively scans every page you visit. Browse around — leaked keys, tokens and credentials will surface here.</p>
|
||||
<p class="empty-hint">tip · add custom keywords from the extension popup</p>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="page-footer">
|
||||
<span>local storage only</span>
|
||||
<span class="footer-sep">·</span>
|
||||
<span>5000-finding ring buffer</span>
|
||||
<span class="footer-sep">·</span>
|
||||
<span>no network egress</span>
|
||||
</footer>
|
||||
</main>
|
||||
|
||||
<script src="preview-stub-empty.js"></script>
|
||||
<script src="../js/results.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,120 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>KeyFinder — Findings Console</title>
|
||||
<link rel="stylesheet" href="../css/results.css">
|
||||
</head>
|
||||
<body>
|
||||
<header class="header">
|
||||
<div class="header-row">
|
||||
<div class="header-left">
|
||||
<span class="radar" aria-hidden="true">
|
||||
<img src="../icons/icon48.png" alt="" class="header-icon">
|
||||
</span>
|
||||
<div class="brand-text">
|
||||
<h1>KEYFINDER<span class="version" id="versionLabel"></span></h1>
|
||||
<p class="header-sub">findings console</p>
|
||||
</div>
|
||||
<span class="live-badge" title="Passive scanning is active"><span class="live-dot"></span>PASSIVE</span>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<div class="search-wrap">
|
||||
<span class="search-glyph" aria-hidden="true">⚲</span>
|
||||
<input type="text" id="searchBox" placeholder="search findings…" autocomplete="off" spellcheck="false">
|
||||
<kbd class="kbd" title="Press / to focus search">/</kbd>
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<button id="exportJsonBtn" class="btn btn-secondary" title="Download filtered findings as JSON">↓ JSON</button>
|
||||
<button id="exportCsvBtn" class="btn btn-secondary" title="Download filtered findings as CSV">↓ CSV</button>
|
||||
<button id="clearBtn" class="btn btn-danger" title="Remove all findings">× Clear</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-row header-row-filters">
|
||||
<div class="filter-group">
|
||||
<label class="filter">
|
||||
<span class="filter-label">sev</span>
|
||||
<select id="severityFilter">
|
||||
<option value="all">all</option>
|
||||
<option value="critical">critical</option>
|
||||
<option value="high">high</option>
|
||||
<option value="medium">medium</option>
|
||||
<option value="low">low</option>
|
||||
</select>
|
||||
</label>
|
||||
<label class="filter">
|
||||
<span class="filter-label">type</span>
|
||||
<select id="typeFilter">
|
||||
<option value="all">all</option>
|
||||
</select>
|
||||
</label>
|
||||
<label class="filter">
|
||||
<span class="filter-label">provider</span>
|
||||
<select id="providerFilter">
|
||||
<option value="all">all</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="meta-line" id="metaLine"></div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="stats-bar" id="statsBar"></div>
|
||||
|
||||
<div class="ticker" id="ticker" hidden>
|
||||
<span class="ticker-dot" aria-hidden="true"></span>
|
||||
<span class="ticker-label">LATEST</span>
|
||||
<span class="ticker-text" id="tickerText"></span>
|
||||
</div>
|
||||
|
||||
<main class="main">
|
||||
<div class="table-shell titled">
|
||||
<span class="titled-label">findings.log</span>
|
||||
<span class="titled-meta" id="shellMeta"></span>
|
||||
<table class="findings-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Severity</th>
|
||||
<th>Provider</th>
|
||||
<th>Pattern</th>
|
||||
<th>Match</th>
|
||||
<th>Type</th>
|
||||
<th>Domain</th>
|
||||
<th>Source</th>
|
||||
<th>Time</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="findingsBody"></tbody>
|
||||
</table>
|
||||
<div id="emptyState" class="empty-state" hidden>
|
||||
<svg class="empty-radar" viewBox="0 0 72 72" aria-hidden="true">
|
||||
<circle cx="36" cy="36" r="30" class="er-ring"/>
|
||||
<circle cx="36" cy="36" r="20" class="er-ring"/>
|
||||
<circle cx="36" cy="36" r="10" class="er-ring"/>
|
||||
<line x1="36" y1="6" x2="36" y2="66" class="er-cross"/>
|
||||
<line x1="6" y1="36" x2="66" y2="36" class="er-cross"/>
|
||||
<path d="M36 36 L36 6 A30 30 0 0 1 57.2 14.8 Z" class="er-sweep"/>
|
||||
<circle cx="36" cy="36" r="2.5" class="er-core"/>
|
||||
</svg>
|
||||
<p class="empty-title" id="emptyTitle">No findings yet</p>
|
||||
<p class="empty-copy" id="emptyCopy">KeyFinder passively scans every page you visit. Browse around — leaked keys, tokens and credentials will surface here.</p>
|
||||
<p class="empty-hint">tip · add custom keywords from the extension popup</p>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="page-footer">
|
||||
<span>local storage only</span>
|
||||
<span class="footer-sep">·</span>
|
||||
<span>5000-finding ring buffer</span>
|
||||
<span class="footer-sep">·</span>
|
||||
<span>no network egress</span>
|
||||
</footer>
|
||||
</main>
|
||||
|
||||
<script src="preview-stub.js"></script>
|
||||
<script src="../js/results.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 189 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 260 KiB |
@@ -0,0 +1,149 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>KeyFinder — social preview</title>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
body {
|
||||
width: 1280px;
|
||||
height: 640px;
|
||||
background: #05070c;
|
||||
font-family: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco, Consolas, monospace;
|
||||
color: #d6dde8;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.stage {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 64px;
|
||||
padding: 0 72px;
|
||||
}
|
||||
|
||||
/* left — brand copy */
|
||||
.copy { flex: none; width: 470px; }
|
||||
.brand { display: flex; align-items: center; gap: 16px; }
|
||||
.brand img { width: 64px; height: 64px; }
|
||||
h1 {
|
||||
color: #fff;
|
||||
font-size: 44px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .18em;
|
||||
}
|
||||
.badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .2em;
|
||||
color: #3ddc97;
|
||||
border: 1px solid rgba(61,220,151,.4);
|
||||
padding: 5px 9px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
.badge::before {
|
||||
content: "";
|
||||
width: 5px; height: 5px;
|
||||
border-radius: 50%;
|
||||
background: #3ddc97;
|
||||
}
|
||||
.tag {
|
||||
margin-top: 18px;
|
||||
color: #f5a524;
|
||||
font-size: 15px;
|
||||
letter-spacing: .2em;
|
||||
}
|
||||
.desc {
|
||||
margin-top: 14px;
|
||||
color: #8b96a8;
|
||||
font-size: 13px;
|
||||
line-height: 1.75;
|
||||
}
|
||||
.spec {
|
||||
margin-top: 26px;
|
||||
list-style: none;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
.spec li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 11.5px;
|
||||
letter-spacing: .1em;
|
||||
color: #525d70;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.spec li::before { content: "▸"; color: #45d0c4; font-size: 10px; }
|
||||
.spec li b { color: #d6dde8; font-weight: 600; }
|
||||
|
||||
/* right — console frame */
|
||||
.frame {
|
||||
flex: 1;
|
||||
height: 460px;
|
||||
border: 1px solid #2a3650;
|
||||
background: #090d14 url("film/dash.png") no-repeat;
|
||||
background-size: 1400px 875px;
|
||||
background-position: -16px -14px;
|
||||
position: relative;
|
||||
}
|
||||
.frame::before {
|
||||
content: "● FINDINGS.LOG";
|
||||
position: absolute;
|
||||
top: -8px; left: 12px;
|
||||
background: #05070c;
|
||||
padding: 0 7px;
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .18em;
|
||||
color: #8b96a8;
|
||||
}
|
||||
.frame::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: linear-gradient(180deg, transparent 78%, rgba(5,7,12,.92) 100%);
|
||||
}
|
||||
|
||||
/* bottom strip */
|
||||
.strip {
|
||||
border-top: 1px solid #1a2233;
|
||||
padding: 12px 72px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 10px;
|
||||
letter-spacing: .16em;
|
||||
color: #525d70;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.strip .url { color: #45d0c4; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="stage">
|
||||
<div class="copy">
|
||||
<div class="brand">
|
||||
<img src="../icons/icon128.png" alt="">
|
||||
<h1>KEYFINDER</h1>
|
||||
<span class="badge">v2.2.1</span>
|
||||
</div>
|
||||
<div class="tag">// PASSIVE SECRET DISCOVERY</div>
|
||||
<p class="desc">Browser extension that passively scans every page you visit for leaked API keys, tokens and credentials — across scripts, DOM, storage and network responses.</p>
|
||||
<ul class="spec">
|
||||
<li><b>80+</b> detection patterns · entropy analysis</li>
|
||||
<li><b>10</b> attack surfaces · SPA-aware rescanning</li>
|
||||
<li><b>local-only</b> storage · zero config · no egress</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="frame"></div>
|
||||
</div>
|
||||
<div class="strip">
|
||||
<span>chrome · firefox · manifest v3</span>
|
||||
<span class="url">github.com/momenbasel/keyFinder</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,74 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>KeyFinder — store shot (popup)</title>
|
||||
<link rel="stylesheet" href="../css/popup.css">
|
||||
<link rel="stylesheet" href="store.css">
|
||||
</head>
|
||||
<body class="store">
|
||||
<div class="stage">
|
||||
<div class="copy">
|
||||
<div class="kicker">KEYFINDER v2.2.1 — PASSIVE SCANNER</div>
|
||||
<h1>Catch leaked keys<br>while you <em>browse</em>.</h1>
|
||||
<p>KeyFinder passively scans every page for exposed API keys, tokens and credentials — across scripts, DOM, storage and network responses.</p>
|
||||
<ul class="spec">
|
||||
<li>80+ detection patterns · entropy analysis</li>
|
||||
<li>10 attack surfaces · SPA-aware rescanning</li>
|
||||
<li>local-only storage · zero config</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="popup-frame">
|
||||
<header class="header">
|
||||
<div class="header-brand">
|
||||
<span class="radar" aria-hidden="true">
|
||||
<img src="../icons/icon48.png" alt="" class="header-icon">
|
||||
</span>
|
||||
<div class="brand-text">
|
||||
<h1>KEYFINDER<span class="version" id="versionLabel"></span></h1>
|
||||
<p class="header-tagline">passive secret discovery</p>
|
||||
</div>
|
||||
<span class="live-badge" title="Passive scanning is active"><span class="live-dot"></span>ARMED</span>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="stats" id="stats">
|
||||
<div class="stat-card stat-findings">
|
||||
<span class="stat-top"><span class="stat-led" aria-hidden="true"></span><span class="stat-label">Findings</span></span>
|
||||
<span class="stat-number" id="findingCount">–</span>
|
||||
</div>
|
||||
<div class="stat-card stat-keywords">
|
||||
<span class="stat-top"><span class="stat-led" aria-hidden="true"></span><span class="stat-label">Keywords</span></span>
|
||||
<span class="stat-number" id="keywordCount">–</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<h2 class="section-title">Watchlist<span class="section-sub">// custom keywords</span></h2>
|
||||
<form id="keywordForm" class="keyword-form">
|
||||
<span class="prompt" aria-hidden="true">›</span>
|
||||
<input
|
||||
type="text"
|
||||
id="keywordInput"
|
||||
placeholder="add keyword, e.g. api_key"
|
||||
autocomplete="off"
|
||||
spellcheck="false"
|
||||
>
|
||||
<button type="submit" id="addBtn">Add</button>
|
||||
</form>
|
||||
<div id="errorMsg" class="error-msg" hidden></div>
|
||||
<ul id="keywordList" class="keyword-list"></ul>
|
||||
</section>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="term-line" aria-live="polite"><span class="term-text" id="termText"></span><span class="term-cursor" aria-hidden="true"></span></div>
|
||||
<a href="../results.html" target="_blank" id="resultsLink" class="results-btn">
|
||||
View Findings <span class="btn-arrow" aria-hidden="true">→</span>
|
||||
</a>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
<script src="preview-stub.js"></script>
|
||||
<script src="../js/popup.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,115 @@
|
||||
/* Store-listing composition backdrop (preview only, not shipped) */
|
||||
|
||||
body.store {
|
||||
width: auto;
|
||||
min-width: 0;
|
||||
background: #04060a;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.stage {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 72px;
|
||||
width: 1280px;
|
||||
height: 800px;
|
||||
padding: 0 64px;
|
||||
}
|
||||
|
||||
/* ambient depth: a single flat value step, no glow washes */
|
||||
.stage::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background:
|
||||
radial-gradient(700px 500px at 85% 80%, rgba(69,208,196,.045) 0%, transparent 65%);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.copy { max-width: 560px; }
|
||||
|
||||
.kicker {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .22em;
|
||||
color: var(--green);
|
||||
border: 1px solid rgba(61,220,151,.32);
|
||||
background: rgba(61,220,151,.06);
|
||||
padding: 5px 9px;
|
||||
border-radius: 2px;
|
||||
margin-bottom: 26px;
|
||||
}
|
||||
.kicker::before {
|
||||
content: "";
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 50%;
|
||||
background: var(--green);
|
||||
box-shadow: 0 0 8px var(--green);
|
||||
}
|
||||
|
||||
.copy h1 {
|
||||
font-size: 46px;
|
||||
font-weight: 700;
|
||||
line-height: 1.08;
|
||||
letter-spacing: .01em;
|
||||
color: #fff;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.copy h1 em {
|
||||
font-style: normal;
|
||||
color: var(--amber);
|
||||
}
|
||||
|
||||
.copy p {
|
||||
font-size: 13px;
|
||||
line-height: 1.7;
|
||||
color: var(--text-dim);
|
||||
margin-bottom: 26px;
|
||||
max-width: 440px;
|
||||
}
|
||||
|
||||
.spec {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 9px;
|
||||
}
|
||||
.spec li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 11px;
|
||||
letter-spacing: .08em;
|
||||
color: var(--text-faint);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.spec li::before {
|
||||
content: "▸";
|
||||
color: var(--teal);
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
/* floating popup frame */
|
||||
.popup-frame {
|
||||
position: relative;
|
||||
flex: none;
|
||||
width: 372px;
|
||||
border: 1px solid var(--line-strong);
|
||||
overflow: hidden;
|
||||
box-shadow: 0 24px 80px rgba(0,0,0,.6);
|
||||
}
|
||||
.popup-frame::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0; left: 0; right: 0;
|
||||
height: 1px;
|
||||
background: linear-gradient(90deg, transparent, rgba(245,165,36,.6), transparent);
|
||||
z-index: 2;
|
||||
}
|
||||
+95
-44
@@ -3,64 +3,115 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>KeyFinder - Findings</title>
|
||||
<title>KeyFinder — Findings Console</title>
|
||||
<link rel="stylesheet" href="css/results.css">
|
||||
</head>
|
||||
<body>
|
||||
<header class="header">
|
||||
<div class="header-left">
|
||||
<img src="icons/icon48.png" alt="KeyFinder" class="header-icon">
|
||||
<h1>KeyFinder <span class="version">v2.0</span></h1>
|
||||
<div class="header-row">
|
||||
<div class="header-left">
|
||||
<span class="radar" aria-hidden="true">
|
||||
<img src="icons/icon48.png" alt="" class="header-icon">
|
||||
</span>
|
||||
<div class="brand-text">
|
||||
<h1>KEYFINDER<span class="version" id="versionLabel"></span></h1>
|
||||
<p class="header-sub">findings console</p>
|
||||
</div>
|
||||
<span class="live-badge" title="Passive scanning is active"><span class="live-dot"></span>PASSIVE</span>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<div class="search-wrap">
|
||||
<span class="search-glyph" aria-hidden="true">⚲</span>
|
||||
<input type="text" id="searchBox" placeholder="search findings…" autocomplete="off" spellcheck="false">
|
||||
<kbd class="kbd" title="Press / to focus search">/</kbd>
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<button id="exportJsonBtn" class="btn btn-secondary" title="Download filtered findings as JSON">↓ JSON</button>
|
||||
<button id="exportCsvBtn" class="btn btn-secondary" title="Download filtered findings as CSV">↓ CSV</button>
|
||||
<button id="clearBtn" class="btn btn-danger" title="Remove all findings">× Clear</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<div class="header-row header-row-filters">
|
||||
<div class="filter-group">
|
||||
<select id="severityFilter">
|
||||
<option value="all">All Severities</option>
|
||||
<option value="critical">Critical</option>
|
||||
<option value="high">High</option>
|
||||
<option value="medium">Medium</option>
|
||||
<option value="low">Low</option>
|
||||
</select>
|
||||
<select id="typeFilter">
|
||||
<option value="all">All Types</option>
|
||||
</select>
|
||||
<select id="providerFilter">
|
||||
<option value="all">All Providers</option>
|
||||
</select>
|
||||
<input type="text" id="searchBox" placeholder="Search findings...">
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<button id="exportJsonBtn" class="btn btn-secondary">Export JSON</button>
|
||||
<button id="exportCsvBtn" class="btn btn-secondary">Export CSV</button>
|
||||
<button id="clearBtn" class="btn btn-danger">Clear All</button>
|
||||
<label class="filter">
|
||||
<span class="filter-label">sev</span>
|
||||
<select id="severityFilter">
|
||||
<option value="all">all</option>
|
||||
<option value="critical">critical</option>
|
||||
<option value="high">high</option>
|
||||
<option value="medium">medium</option>
|
||||
<option value="low">low</option>
|
||||
</select>
|
||||
</label>
|
||||
<label class="filter">
|
||||
<span class="filter-label">type</span>
|
||||
<select id="typeFilter">
|
||||
<option value="all">all</option>
|
||||
</select>
|
||||
</label>
|
||||
<label class="filter">
|
||||
<span class="filter-label">provider</span>
|
||||
<select id="providerFilter">
|
||||
<option value="all">all</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="meta-line" id="metaLine"></div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="stats-bar" id="statsBar"></div>
|
||||
|
||||
<div class="ticker" id="ticker" hidden>
|
||||
<span class="ticker-dot" aria-hidden="true"></span>
|
||||
<span class="ticker-label">LATEST</span>
|
||||
<span class="ticker-text" id="tickerText"></span>
|
||||
</div>
|
||||
|
||||
<main class="main">
|
||||
<table class="findings-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Severity</th>
|
||||
<th>Provider</th>
|
||||
<th>Pattern</th>
|
||||
<th>Match</th>
|
||||
<th>Type</th>
|
||||
<th>Domain</th>
|
||||
<th>Source</th>
|
||||
<th>Time</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="findingsBody"></tbody>
|
||||
</table>
|
||||
<div id="emptyState" class="empty-state" hidden>
|
||||
<div class="empty-icon">🔍</div>
|
||||
<p>No findings yet. Browse some pages and KeyFinder will passively scan for leaked secrets.</p>
|
||||
<div class="table-shell titled">
|
||||
<span class="titled-label">findings.log</span>
|
||||
<span class="titled-meta" id="shellMeta"></span>
|
||||
<table class="findings-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Severity</th>
|
||||
<th>Provider</th>
|
||||
<th>Pattern</th>
|
||||
<th>Match</th>
|
||||
<th>Type</th>
|
||||
<th>Domain</th>
|
||||
<th>Source</th>
|
||||
<th>Time</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="findingsBody"></tbody>
|
||||
</table>
|
||||
<div id="emptyState" class="empty-state" hidden>
|
||||
<svg class="empty-radar" viewBox="0 0 72 72" aria-hidden="true">
|
||||
<circle cx="36" cy="36" r="30" class="er-ring"/>
|
||||
<circle cx="36" cy="36" r="20" class="er-ring"/>
|
||||
<circle cx="36" cy="36" r="10" class="er-ring"/>
|
||||
<line x1="36" y1="6" x2="36" y2="66" class="er-cross"/>
|
||||
<line x1="6" y1="36" x2="66" y2="36" class="er-cross"/>
|
||||
<path d="M36 36 L36 6 A30 30 0 0 1 57.2 14.8 Z" class="er-sweep"/>
|
||||
<circle cx="36" cy="36" r="2.5" class="er-core"/>
|
||||
</svg>
|
||||
<p class="empty-title" id="emptyTitle">No findings yet</p>
|
||||
<p class="empty-copy" id="emptyCopy">KeyFinder passively scans every page you visit. Browse around — leaked keys, tokens and credentials will surface here.</p>
|
||||
<p class="empty-hint">tip · add custom keywords from the extension popup</p>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="page-footer">
|
||||
<span>local storage only</span>
|
||||
<span class="footer-sep">·</span>
|
||||
<span>5000-finding ring buffer</span>
|
||||
<span class="footer-sep">·</span>
|
||||
<span>no network egress</span>
|
||||
</footer>
|
||||
</main>
|
||||
|
||||
<script src="js/results.js"></script>
|
||||
|
||||
@@ -12,6 +12,7 @@ SHARED_FILES=(
|
||||
js/background.js
|
||||
js/content.js
|
||||
js/interceptor.js
|
||||
js/interceptor-loader.js
|
||||
js/patterns.js
|
||||
js/popup.js
|
||||
js/results.js
|
||||
|
||||
@@ -0,0 +1,134 @@
|
||||
# KeyFinder — Store Listing Kit (v2.2.1)
|
||||
|
||||
Copy-paste ready text for the Chrome Web Store and Firefox Add-ons (AMO) dashboards.
|
||||
Screenshots referenced below are in `store/`.
|
||||
|
||||
---
|
||||
|
||||
## 1. Chrome Web Store
|
||||
|
||||
**Category:** Developer Tools
|
||||
**Language:** English
|
||||
|
||||
### Short description (max 132 chars — this is 121)
|
||||
|
||||
```
|
||||
Passive scanner for leaked API keys, tokens & secrets. 80+ patterns, 10 attack surfaces, zero config, local-only storage.
|
||||
```
|
||||
|
||||
### Detailed description
|
||||
|
||||
```
|
||||
KeyFinder passively discovers API keys, tokens, secrets, and credentials leaked in the pages you visit. It runs silently in the background — no configuration, no accounts, no cloud. Browse normally; KeyFinder watches for secrets that should never have shipped.
|
||||
|
||||
WHAT IT DETECTS
|
||||
80+ detection patterns across the providers that matter:
|
||||
• Cloud — AWS (access keys, secret keys, session tokens, Cognito), Google Cloud (API keys, OAuth, service accounts), Azure (storage keys, SAS tokens, connection strings)
|
||||
• Source control — GitHub (PATs, OAuth, fine-grained), GitLab, Bitbucket
|
||||
• Payments — Stripe (secret, publishable, restricted, webhook), PayPal Braintree, Square
|
||||
• Communication — Slack, Discord, Telegram, Twilio, SendGrid
|
||||
• AI/ML — OpenAI, Anthropic, HuggingFace, Replicate
|
||||
• Databases — MongoDB, PostgreSQL, MySQL, Redis connection strings
|
||||
• SaaS & infra — Shopify, Sentry, Datadog, Cloudflare, DigitalOcean, HashiCorp Vault, NPM, Docker Hub, and more
|
||||
• Generic — JWTs, Bearer tokens, Basic Auth, credential URLs, plus Shannon entropy analysis for undocumented formats
|
||||
|
||||
HOW IT WORKS
|
||||
Every page is scanned across 10 attack surfaces: script src URLs, inline scripts, same-origin external scripts, meta tags, hidden form fields, data attributes, HTML comments, URL parameters, localStorage/sessionStorage, and intercepted XHR/Fetch responses. A MutationObserver re-scans dynamically injected DOM, so single-page apps are covered too.
|
||||
|
||||
THE FINDINGS CONSOLE
|
||||
A flat, terminal-style dashboard built for triage:
|
||||
• Severity-sorted findings (critical → high → medium → low)
|
||||
• Click a severity tile to filter instantly; filter by type or provider
|
||||
• Latest-finding ticker and live search (/ to focus, Esc to clear)
|
||||
• Click any match to copy the secret; relative timestamps with absolute on hover
|
||||
• One-click export of filtered results as JSON or CSV (formula-injection sanitised)
|
||||
|
||||
PRIVACY
|
||||
All findings stay on your machine. Local storage only, no network egress, no analytics, no accounts. Open source: github.com/momenbasel/keyFinder
|
||||
|
||||
DISCLAIMER
|
||||
Intended for security research and authorized testing only. Use it on your own applications or during authorized penetration tests.
|
||||
```
|
||||
|
||||
### Screenshots (upload in this order)
|
||||
|
||||
| # | File | Why |
|
||||
|---|------|-----|
|
||||
| 1 | `store/store-1-dashboard.png` | The findings console fully loaded — the product's money shot |
|
||||
| 2 | `store/store-2-popup.png` | Hero composition: what it is + the popup UI |
|
||||
| 3 | `store/store-3-empty.png` | Zero-noise empty state — reinforces the privacy promise |
|
||||
|
||||
### Privacy tab — single-purpose & permission justifications
|
||||
|
||||
**Single purpose:** Passively scans visited pages for leaked API keys, tokens, and secrets, and displays them locally to the user.
|
||||
|
||||
**`activeTab`:** Required to scan the DOM and resources of the page the user is currently viewing for leaked secrets.
|
||||
|
||||
**`storage`:** Required to persist findings and the user's custom keyword list locally on the device. No data leaves the machine.
|
||||
|
||||
**Host permissions (`<all_urls>` content scripts):** Secret leakage can occur on any page. The extension must scan script URLs, inline code, DOM attributes, storage, and network responses on every visited page to fulfill its single purpose. All processing is local; nothing is transmitted.
|
||||
|
||||
**Remote code:** No remote code is executed. All scanning logic ships inside the extension package.
|
||||
|
||||
**Data collection:** None. No personal, sensitive, or browsing data is collected, transmitted, or shared. Findings are stored locally with a 5000-item cap and can be cleared at any time.
|
||||
|
||||
---
|
||||
|
||||
## 2. Firefox Add-ons (AMO)
|
||||
|
||||
**Categories:** Security & Privacy; Developer Tools
|
||||
**Tags:** security, api keys, secrets, pentest, developer tools, scanner, credentials, privacy
|
||||
|
||||
### Summary (max 250 chars — this is 229)
|
||||
|
||||
```
|
||||
Passively discovers API keys, tokens, and secrets leaked in the pages you visit. 80+ patterns across 10 attack surfaces, entropy analysis, SPA-aware rescanning, terminal-style findings console. Zero config, local-only, no egress.
|
||||
```
|
||||
|
||||
### Description (AMO allows basic HTML)
|
||||
|
||||
```html
|
||||
<p><b>KeyFinder</b> passively discovers API keys, tokens, secrets, and credentials leaked in the pages you visit. No configuration, no accounts, no cloud — browse normally and KeyFinder watches for secrets that should never have shipped.</p>
|
||||
|
||||
<p><b>What it detects — 80+ patterns:</b></p>
|
||||
<ul>
|
||||
<li>Cloud: AWS, Google Cloud, Azure</li>
|
||||
<li>Source control: GitHub, GitLab, Bitbucket</li>
|
||||
<li>Payments: Stripe, PayPal Braintree, Square</li>
|
||||
<li>Communication: Slack, Discord, Telegram, Twilio, SendGrid</li>
|
||||
<li>AI/ML: OpenAI, Anthropic, HuggingFace, Replicate</li>
|
||||
<li>Databases: MongoDB, PostgreSQL, MySQL, Redis</li>
|
||||
<li>SaaS & infrastructure: Shopify, Sentry, Datadog, Cloudflare, DigitalOcean, Vault, NPM, Docker Hub</li>
|
||||
<li>Generic: JWTs, Bearer tokens, Basic Auth, credential URLs, high-entropy strings (Shannon entropy analysis)</li>
|
||||
</ul>
|
||||
|
||||
<p><b>How it works:</b> every page is scanned across 10 attack surfaces — script URLs, inline and external scripts, meta tags, hidden form fields, data attributes, HTML comments, URL parameters, web storage, and intercepted XHR/Fetch responses. A MutationObserver re-scans dynamically injected DOM for SPA coverage.</p>
|
||||
|
||||
<p><b>The findings console:</b> a flat, terminal-style dashboard built for triage — severity-sorted findings, click-to-filter severity tiles, latest-finding ticker, live search (<code>/</code> to focus, <code>Esc</code> to clear), click-to-copy secrets, and one-click JSON/CSV export of filtered results.</p>
|
||||
|
||||
<p><b>Privacy:</b> all findings stay on your machine. Local storage only, no network egress, no analytics. Open source: <a href="https://github.com/momenbasel/keyFinder">github.com/momenbasel/keyFinder</a></p>
|
||||
|
||||
<p><i>Intended for security research and authorized testing only.</i></p>
|
||||
```
|
||||
|
||||
### Screenshots (same order as Chrome)
|
||||
|
||||
1. `store/store-1-dashboard.png`
|
||||
2. `store/store-2-popup.png`
|
||||
3. `store/store-3-empty.png`
|
||||
|
||||
### Reviewer notes (paste into "Notes for Reviewers" if asked)
|
||||
|
||||
```
|
||||
The extension scans visited pages locally for leaked secrets and stores findings in browser storage only. Nothing is transmitted off the device — the manifest declares data_collection_permissions: none. All scanning logic is contained in the package; no remote code is loaded. Source: https://github.com/momenbasel/keyFinder (tag v2.2.1 matches this upload).
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 3. Shared assets checklist
|
||||
|
||||
- [x] Icon set (16/48/128) — `icons/`
|
||||
- [x] Screenshots 1280×800 — `store/`
|
||||
- [x] Privacy policy — `PRIVACY.md` (host its raw GitHub URL in store dashboards that ask: `https://github.com/momenbasel/keyFinder/blob/master/PRIVACY.md`)
|
||||
- [x] Homepage URL — `https://github.com/momenbasel/keyFinder`
|
||||
- [x] Promotional video — `store/store-demo.mp4` (1280×720, 30 fps, 12.3 s: title card → console pan → popup; upload to YouTube as unlisted and paste the link in both store dashboards)
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 148 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 158 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
Binary file not shown.
Reference in New Issue
Block a user