New mongoosejs.com layout

[vkarpov15]

Summary

It's been over 8 years since we last redesigned the docs site. I wanted to first spruce up the layout a bit to look more like Vue's docs

Dark mode:

Mobile:

Examples

[Copilot]

Pull request overview

Updates the mongoosejs.com docs site to a new Vue-inspired three-column layout with refreshed styling, improved navigation structure, and updated search page UI/behavior.

Changes:

• Replaces the legacy docs layout/CSS with a new header + left nav + right TOC sidebar layout (mongoose9.css, layout.pug).
• Adds new client-side behavior for version picker and page table-of-contents generation/toggling (version-picker.js, toc.js, mobile-navbar-toggle.js).
• Refactors the search page markup, styling, and result rendering/UX (search.pug, search.css, search.js).

Reviewed changes

Copilot reviewed 15 out of 15 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
scripts/website.js	Adjusts markdown wrapping and post-processing of rendered HTML; avoids unnecessary acquit writes.
docs/tutorials/findoneandupdate.md	Modifies tutorial HTML heading markup in the includeResultMetadata section.
docs/search.pug	Rebuilds search page markup (form-based) and links new stylesheet.
docs/layout.pug	Introduces new global docs layout (header, sidebars, TOC container) and switches to mongoose9.css.
docs/js/version-picker.js	Adds interactive version picker open/close behavior.
docs/js/toc.js	Generates a right-sidebar “On this page” TOC and active-section highlighting.
docs/js/search.js	Updates search submission flow and improves status handling / timeout behavior.
docs/js/mobile-navbar-toggle.js	Updates mobile toggles to handle both left nav drawer and TOC drawer.
docs/includes/native.pug	Removes inline CPC stylesheet inclusion while keeping native ad injection script/template.
docs/css/search.css	Adds dedicated search page styling.
docs/css/mongoose9.css	Adds new site-wide design system and layout styling (replacing mongoose5-era layout).
docs/css/mongoose5.css	Removes legacy docs stylesheet.
docs/css/inlinecpc.css	Removes legacy inline CPC stylesheet.
docs/css/carbonads.css	Restyles Carbon ads for the new sidebar placement.
docs/api_split.pug	Adjusts API page header layout to match new .article-header structure.

[hasezoey]

Home issues i found:

• the homepage still makes use of variables that are now unset (some i found, but might not be all: --text-secondary, --btn-bg, --btn-text-shadow); practically making all buttons disappear (see screenshots)
• likely due to the same issue, light/dark switch does not work on the homepage
• the TOC sidebar can be opened in mobile mode, even if there is no content present (ex docs/index.html)
• some headers in the API page (likely other could too) get too long and offset the headerbar (see screenshots)
• i dont know how intentional it is, but on mobile the "edit page / copy" buttons are below the header instead of on the right side, even if there is enough space for most headers
• on higher space screens, the TOC sidebar is still rather small, commonly cutting names off in the API page (see screenshots)

Issue Screenshots

homepage without buttons (invisible read the docs, discover plugins and get professionally supported mongoose):

long header names:

small toc, cutting off names, even if there would be space to expand:

Otherwise, this looks really great; i really do like docusaurus-ish layout style.

PS: unrelated to this issue, it seems like the sponsors page seems to be empty.

[hasezoey]

Looks good to me now. Though the TOC entries are still cut short in wide screens.

[AbdelrahmanHafez]

LGTM 👍