Skip to content

Latest commit

 

History

13 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

PeekLinked — Focus Mode for LinkedIn

Give your attention back. Peek when you're ready.

A Chrome extension that blurs out LinkedIn profile pictures, post images, and videos by default, and overlays a small toggle button on each one so you can reveal it on demand — with a popup for finer control.

Not affiliated with, endorsed by, or connected to LinkedIn Corporation. "LinkedIn" is a trademark of LinkedIn Corporation.

Privacy

PeekLinked makes no network requests and sends no data anywhere. All settings (blur level, on/off toggles) are stored locally via Chrome's chrome.storage.sync, which only syncs across your own signed-in Chrome profile. Nothing is collected, logged, or shared with the developer or anyone else.

Controls (v1.2)

Click the toolbar icon to open the popup:

  • Enable PeekLinked — master on/off switch, persists across sessions.
  • Pause on this tab — temporarily shows everything on the current tab. Lives only in that tab's memory, so it automatically resets when you reload or close the tab (no lingering state to remember to undo). Shortcut: Alt+Shift+P (toggles the active tab without opening the popup).
  • Blur intensity — 5-step slider from Low to Max.
  • What to blur — independent switches for profile pictures, post images, and videos. Turning one off leaves that content type fully untouched (no blur, no button).
  • Show all / Hide all on page — bulk-reveals or re-hides everything currently on the page, without changing your saved settings.

Settings (master switch, blur level, per-type toggles) are stored via chrome.storage.sync and apply immediately to any open LinkedIn tabs. Tab-pause state is intentionally not stored anywhere — it's a plain in-memory flag in the content script, which is why it resets on reload.

How the injection works

PeekLinked never inserts or moves elements inside LinkedIn's own DOM. LinkedIn is a React app, and mutating its structure (e.g. wrapping an <img> in a new <span>, which v1.0 did) confuses React's reconciliation and can crash/unmount unrelated parts of the page.

Instead:

  • Blur is applied as an inline filter style directly on the image or video element itself. Nothing is wrapped, nothing is moved.
  • Toggle buttons live in a single separate overlay layer appended to <html>, positioned in page coordinates on top of each tracked element — completely outside LinkedIn's React tree.
  • Two button styles depending on target size:
    • Larger than 105px: a centered "Show" / "Hide" text pill.
    • 105px or smaller (avatars/thumbnails): a compact circular eye-icon badge at the bottom-right corner. Turns LinkedIn-blue when shown.
  • A 200ms interval plus scroll/resize listeners keep buttons positioned correctly and clean up buttons whose target left the page (e.g. pruned by LinkedIn's feed virtualization).
  • A MutationObserver watches for newly added <img>/<video> elements (infinite scroll) purely to discover them — never to modify LinkedIn's DOM.

Install

  • Chrome: [link once published on the Chrome Web Store]
  • Edge: [link once published on Edge Add-ons]
  • From source: see "Load it in Chrome" below

Manual/Dev path (Load it in Chrome)

  1. Open chrome://extensions
  2. Turn on Developer mode (top-right toggle)
  3. Click Load unpacked
  4. Select this peeklinked folder
  5. Visit linkedin.com — images/videos should load blurred with a toggle button/badge on top, and the toolbar icon opens the control popup

No build step, no dependencies. Permissions requested: storage (to save your settings) and activeTab (so the popup/shortcut can talk to whichever LinkedIn tab is active — nothing runs on other sites).

Known limitations / things to tweak

  • LinkedIn's DOM changes often: since this targets all img/video tags generically and never mutates LinkedIn's structure, it should stay resilient across redesigns — but keep an eye out for edge cases.

Customizing

  • Blur presets per intensity level: BLUR_PRESETS in content.js.
  • Small-vs-pill size threshold: SMALL_MAX in content.js.
  • Badge/pill colors and sizing: .liht-badge / .liht-pill in content.css.
  • Position sync frequency: TICK_MS in content.js.
  • Keyboard shortcut: commands in manifest.json, then re-bind at chrome://extensions/shortcuts.

License

MIT — see LICENSE.

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages