{"id":16594266,"url":"https://github.com/jh3y/focussed-twitter","last_synced_at":"2025-03-21T13:31:46.160Z","repository":{"id":44663205,"uuid":"199074713","full_name":"jh3y/focussed-twitter","owner":"jh3y","description":"Let's focus on the tweets! 🐦","archived":false,"fork":false,"pushed_at":"2024-05-18T14:01:34.000Z","size":4787,"stargazers_count":17,"open_issues_count":3,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-18T01:51:20.158Z","etag":null,"topics":["chrome-extension","css-variables","firefox-extension","hacktoberfest","hacktoberfest2020","javascript","twitter"],"latest_commit_sha":null,"homepage":"https://chrome.google.com/webstore/detail/focussed-twitter/efldegaojlekkkoegoeakkgknaagjeoj","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jh3y.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-07-26T20:14:04.000Z","updated_at":"2024-06-18T16:34:59.000Z","dependencies_parsed_at":"2024-10-28T10:27:52.115Z","dependency_job_id":"4cc8bb18-e4ef-4c36-adb2-2d2d4faa40a7","html_url":"https://github.com/jh3y/focussed-twitter","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jh3y%2Ffocussed-twitter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jh3y%2Ffocussed-twitter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jh3y%2Ffocussed-twitter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jh3y%2Ffocussed-twitter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jh3y","download_url":"https://codeload.github.com/jh3y/focussed-twitter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244806117,"owners_count":20513383,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["chrome-extension","css-variables","firefox-extension","hacktoberfest","hacktoberfest2020","javascript","twitter"],"created_at":"2024-10-11T23:45:44.644Z","updated_at":"2025-03-21T13:31:45.710Z","avatar_url":"https://github.com/jh3y.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![focussed twitter logo](src/focussed-twitter/icons/focussed_twitter_48.png)\n# Focussed Twitter 🐦\n\n![potential](src/screenshots/showing-sides.png)\n\nA browser extension for reducing the noise on Twitter 🙌\n_Works in Firefox and Chromium_\n\n- [Chrome Extension](https://chrome.google.com/webstore/detail/focussed-twitter/efldegaojlekkkoegoeakkgknaagjeoj)\n- [Firefox Add-On](https://addons.mozilla.org/en-US/firefox/addon/focussed-twitter/)\n\n## Motivation\nWith the new Twitter layout hitting our screens, some weren't too happy about the \"noise\".\n\nFWIW, I don't mind the new layout. I've almost forgotten how the old one looked now 😂\nHowever, the new one is a little noisy when scrolling.\n\nEnter \"Focussed Twitter\"!\n\nWhat started as a bookmarklet is now a browser extension!\n\n![dimming noise](src/screenshots/dimming.png)\n\n## Principles + Concept\nThe idea for \"Focussed Twitter\" is to make it easier to focus on the tweets.\n\nThe original idea for better UX was that if I scrolled Twitter, I wanted everything else to fade away for a moment.\n\nNo need to remove elements or break the behavior/layout 👍\n\nEverything that \"Focussed Twitter\" does can be switched off or configured to your liking in the extension options 💪\n\n![focussed](src/screenshots/focussed.png)\n\n## Features\n- Dim sides on scroll\n- Set the dim\n- Hide the sidebar\n- Hide separators\n- Remove tweet borders\n- Increase the margin between tweets\n- Permanently dim sides\n- Focussed composing\n- Hide metric counts\n- Hide DMs drawer\n\n![composition](src/screenshots/composing.png)\n\n## How does it work\n`Focussed Twitter' is powered by CSS variables and MutationObserver. When an option is changed, the script updates inline CSS variables on the document.\nThese then do things like trigger opacity changes and update transition timings 🤓\n\n![configuration](src/screenshots/configuration.png)\n\n## Contributions\nI'd love some! ❤️ Any PRs are welcome or suggestions.\n\nIdeas include:\n- Creating a better icon 😅\n- Porting to other browsers besides Firefox \u0026\u0026 Chrome\n- Cleaner styling for the popup window 😅\n\nThe code is in a place where it's not too heavy. There is a reason for this. If Twitter decides to change the UI structure significantly at some point, the extension will need updating.\n\n## Development\n### Chrome\n- Rename `manifest.chrome.json` to `manifest.json`.\n- Load the unpacked extension into Chrome by pointing at the focussed twitter directory.\n### Firefox\n- Rename `manifest.firefox.dev.json` to `manifest.json`.\n- Load the add on into Firefox by pointing at the manifest file.\n\n---\n\nMade in haste by @jh3y 😅","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjh3y%2Ffocussed-twitter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjh3y%2Ffocussed-twitter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjh3y%2Ffocussed-twitter/lists"}