Skip to content
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.

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

[docs][joy-ui] Move tutorial to iframe #40567

Merged
merged 1 commit into from
Jan 20, 2024

Conversation

oliviertassinari
Copy link
Member

@oliviertassinari oliviertassinari added the docs Improvements or additions to the documentation label Jan 14, 2024
@mui-bot
Copy link

mui-bot commented Jan 14, 2024

Netlify deploy preview

Bundle size report

No bundle size changes (Toolpad)
No bundle size changes

Generated by 🚫 dangerJS against 16aa6ed

Verified

This commit was signed with the committer’s verified signature.
sentrivana Ivana Kellyer
Comment on lines 20 to 23
if (!mounted) {
return null;
return <Button variant="soft">Change mode</Button>;
}
Copy link
Member Author

@oliviertassinari oliviertassinari Jan 14, 2024

Choose a reason for hiding this comment

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

Solve layout shift, annoying.

@@ -35,59 +35,56 @@ function ModeToggle() {

export default function LoginFinal() {
return (
<CssVarsProvider>
Copy link
Member Author

@oliviertassinari oliviertassinari Jan 14, 2024

Choose a reason for hiding this comment

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

This is duplicated, global styles are injected twice in the page, creating mess in the dev tools to debug.

Don&apos;t have an account?
<main>
<ModeToggle />
<CssBaseline />
Copy link
Member Author

Choose a reason for hiding this comment

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

This was missing, not following the docs. I noticed because the export to codesandbox wouldn't look the same as in the iframe.

Comment on lines 431 to 438
if (demoOptions.bg == null) {
demoOptions.bg = 'outlined';
}

if (demoOptions.iframe) {
demoOptions.bg = true;
if (demoOptions.iframe) {
demoOptions.bg = true;
}
}

Copy link
Member Author

Choose a reason for hiding this comment

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

A Docs-infra bug, even if we set a default background for iframe different than for non-iframe demos, we should still be able to customize it.

{{"demo": "LoginFinal.js"}}
{{"demo": "LoginFinal.js", "iframe": true, "height": 500, "bg": "outlined"}}
Copy link
Member Author

Choose a reason for hiding this comment

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

This demo shows a full page. I believe it makes more sense to isolate the code in an iframe.

@oliviertassinari oliviertassinari added the scope: docs-infra Specific to the docs-infra product label Jan 20, 2024
@oliviertassinari oliviertassinari merged commit 8f0d955 into mui:master Jan 20, 2024
@oliviertassinari oliviertassinari deleted the joy-iframe branch January 20, 2024 15:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
docs Improvements or additions to the documentation scope: docs-infra Specific to the docs-infra product
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants