Conversation
…host pages Tailwind preflight from src/tailwind.css and @codebridger/lib-vue-components was being injected into document.head, where its universal selectors (`*, ::before, ::after`, `button`, `img`, ...) reset host-page styles. On YouTube this broke icon rendering and prevented the profile page video grid from loading. Add postcss-prefix-selector to scope every selector under `.subturtle-scope` and tag all mount roots (#subturtle-app, #subturtle-popup) and teleport target wrappers with that class. The transform is idempotent (node_modules CSS was visited more than once) and drops `body` rules so the library's page-level background/font do not paint our wrapper. #86exa5j3c
…ping #86exa5j3c The Netflix initializer inserted #subturtle-app into the DOM before adding the `subturtle-scope` class, so the MutationObserver in the settings store saw an unclassed element and skipped theme application — leaving Netflix without dark mode and any observer-based scope handling. Reorder so the id, classes, and inline styles are set before insertion, matching YouTube and MS Teams. Add clarifying comments where the WHY is non-obvious: - postcss.config.js: top-level overview of the scoping strategy plus inline notes on the idempotency guard, body/html/:root drops, and the .dark compound rewrite. - settings store: explain why dark/light lives on .subturtle-scope elements (compound selector rewrite) instead of <html>, and why the MutationObserver is needed for teleport wrappers mounted after init. - Teleport wrappers (WordSelectionRectangle, YouTube/MS Teams Index.vue): flag that the teleport target escapes #subturtle-app. - _support-template initializer: canonical note describing the role of the subturtle-scope class for new surfaces. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
… #86exa5j3c The MS Teams surface relied on a Trusted-Types monkey-patch that was suspected of breaking YouTube but turned out to be a non-issue once the Tailwind preflight bleed was fixed. With no active MS Teams users on the extension, drop the integration to reduce surface area. - Delete src/subtitle/ms-team (Index.vue, components, initializer, static). - Remove the msTeam initializer import and the trusted-types-polyfill side-effect import from src/main.ts. - Drop https://teams.microsoft.com from manifest content_scripts and tighten the YouTube match to https://www.youtube.com/watch?* so the bundle only loads on actual watch pages. - Update src/subtitle/README.md to remove MS Teams references. Keep src/trusted-types-polyfill.ts in the tree (now unimported) with a generalized doc comment, since it remains the canonical workaround for hosts with strict Trusted Types CSP and may be opted into by future content scripts that need to run on such sites. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Collaborator
Author
navidshad
changed the title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
📋 Summary
This PR removes the MS Teams integration and tightens the content-script matches. It also improves the classification of the Netflix scope wrapper before insertion and ensures document scoping is applied correctly. CSS and dark mode styling are scoped within the extension wrapper to prevent Tailwind preflight styles from bleeding onto host pages. Additionally, the extension version has been bumped to 1.9.1.
🔗 Related Tasks
#86exa5j3c - Remove MS Teams integration, tighten content-script matches, classify Netflix scope wrapper before insertion, document scoping improvements, apply dark mode inside scoped wrapper, and scope extension CSS to prevent style bleeding.
📝 Additional Details
📜 Commit List