Skip to content

Fix variables when used in an embedded window like on backstage #186

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
merged 3 commits into from
Oct 10, 2024
Merged

Fix variables when used in an embedded window like on backstage #186

merged 3 commits into from
Oct 10, 2024

Conversation

ElementalWarrior
Copy link
Contributor

These variables are not properly defined when using mkdocstrings on a backstage website.

@ElementalWarrior
Copy link
Contributor Author

@pawamoy to hazard nagging you more. Could you review this as well.

I don't think the test failure in path based tests could be related to this simple css selector change.

@pawamoy
Copy link
Member

pawamoy commented Oct 7, 2024

Hey @ElementalWarrior, thanks for the PR! Can you explain to me what is this :host variable and why it's required for Backstage? Is it a standard thing, or specific to Backstage? Seems like a harmless change anyway, just want to understand.

@ElementalWarrior
Copy link
Contributor Author

Hey @ElementalWarrior, thanks for the PR! Can you explain to me what is this :host variable and why it's required for Backstage? Is it a standard thing, or specific to Backstage? Seems like a harmless change anyway, just want to understand.

From my understanding, backstage embeds mkdocs in a page using a shadow dom element. And the CSS is just loaded on the page. So the variables in :root don't get picked up.

https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM

@pawamoy
Copy link
Member

pawamoy commented Oct 10, 2024

OK thanks. I don't know enough of HTML/CSS so I'll trust you on this. We can always revert if this causes any issue 🙂

pawamoy
pawamoy reviewed Oct 10, 2024
View reviewed changes
Copy link
Member

@pawamoy pawamoy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll just remove the :host occurrences from our own docs.

@pawamoy pawamoy merged commit 3b9dba2 into mkdocstrings:main Oct 10, 2024
25 of 26 checks passed
@ElementalWarrior ElementalWarrior deleted the fix-shadow-doc-css-variables branch October 10, 2024 22:00
@ElementalWarrior ElementalWarrior restored the fix-shadow-doc-css-variables branch November 1, 2024 03:58
viktorlashchuk added a commit to viktorlashchuk/mkdocstrings-python that referenced this pull request Feb 24, 2025
@viktorlashchuk
refactor: Declare default CSS symbol colors under :host as well
d6f42ce 
This is apparently needed when the docs are served under a shadow DOM (for example, Backstage seems to do this, and `:root` variables aren't picked up).

See https://developer.mozilla.org/en-US/docs/Web/CSS/:host.

PR-186: mkdocstrings/python#186
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@pawamoy pawamoy pawamoy approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@ElementalWarrior @pawamoy