website
website copied to clipboard
Implement site redesign with dark mode
Rewrites the site styles from scratch, to improve accessibility and add support for dark mode, while also dropping the dependencies on bootstrap and jquery. Various smaller PRs have already landed over the past few months to facilitate this change. It was intentional to avoid large changes to the site layout and structure as part of this work.
Staged: https://flutter-docs-prod--pr11172-feat-site-redesign-utslfe4y.web.app/
New features:
- A toggleable dark (or device/auto) mode
- Collapsible left sidenav
- Dismissible top banner
- Simpler top navbar, with focus on search
- Much more space for content on narrow and mobile layouts
- More consistent and accessible HTML and styles
- Add external link icons to external sidenav entries
- Implement more dynamic design functionality with CSS instead of JS
Issues resolved: Resolves https://github.com/flutter/website/issues/3632 Resolves https://github.com/flutter/website/issues/8030 Resolves https://github.com/flutter/website/issues/7769 Resolves https://github.com/flutter/website/issues/1667 Fixes https://github.com/flutter/website/issues/1728 Fixes https://github.com/flutter/website/issues/1940 Fixes https://github.com/flutter/website/issues/2313 Fixes https://github.com/flutter/website/issues/8505 Fixes https://github.com/flutter/website/issues/9000 Fixes https://github.com/flutter/website/issues/9329 Fixes https://github.com/flutter/website/issues/10532 Fixes https://github.com/flutter/website/issues/10536 Fixes https://github.com/flutter/website/issues/10543
Contributes to https://github.com/flutter/website/issues/9495 Contributes to https://github.com/flutter/website/issues/10534 Contributes to https://github.com/flutter/website/issues/10535
Left for follow-up:
- Active section highlighting for TOC
- Narrow version of TOC
- Search results without leaving page
- Updating or adding new images to work better in dark mode