Docusaurs: Add more white space to the pages for readability

[Jwaegebaert]

The current width of the documentation pages can make it difficult for users to read and understand the content. Adding more white space in the width of the pages will improve readability by allowing users to focus on the content without getting overwhelmed by the amount of text on the page. We should consider increasing the page width and adjusting the margins to create more white space. This will make it easier for users to scan the content and find the information they need.

This can likely be achieved by swizzling a Docusaurus component and modifying the styling there. Swizzling allows us to override the default behavior of a Docusaurus component and replace it with our own custom implementation. More information about swizzling in Docusaurus can be found here: https://docusaurus.io/docs/swizzling.

Note!

When making a PR for this issue, make sure you target the branch docs-migration.

---

Related to #4396

[Jwaegebaert]

I've updated the pages so the content doesn't exceed 700px. This gives a bit of an insight into how this change will affect the pages.

Changed version:

Homepage

planner plan add

Original version:

Homepage

planner plan add

@pnp/cli-for-microsoft-365-maintainers what are your thoughts regarding this change?

[waldekmastykarz]

This can likely be achieved by swizzling a Docusaurus component and modifying the styling there. Swizzling allows us to override the default behavior of a Docusaurus component and replace it with our own custom implementation. More information about swizzling in Docusaurus can be found here: https://docusaurus.io/docs/swizzling.

I like the improved version. A few questions:

• do we need swizzling? Seems like an overly complicated solution to something that we should be able to change in the css
• have you checked if it doesn't affect the responsive rendering on smaller screens?

[Jwaegebaert]

@pnp/cli-for-microsoft-365-maintainers, what are your thoughts regarding this issue? Docusaurus has now already been live for several months and personally, I don't mind the white space that comes out of the box.

[milanholemans]

Agree, according to me, the current margin is ok. We shouldn't add too much custom styling which could break in the future.

[martinlingstuyl]

Same here, it's fine as it is..

[Adam-it]

same. I guess we may leave them 👍