A responsive layout for viewing and editing spaces (the other views will come later). Content is centered in larger viewports and it's framed in a "page" to look decent with different types of content, i.e. not just long blocks of text. It collapses to two columns in medium viewports and one column on smaller devices. I've attached a screenshot of how it could look as a desktop app using the same size as my Slack window.
The sidebar is updated as you update the name of a page.
Updated content styling including support for nested lists.
Open/close toggles in the sidebar that makes it easier to browse growing spaces. You just have to scan 5 items instead of 30 to find the personas etc. It should also make the spaces look cleaner and more inviting. The toggles are displayed on hover to make more room for the text.
What's missing?
I cheated to get everything done over the weekend. Maybe I should replace the todos in the code with issues instead?
You need a large viewport to edit pages.
The code for the sidebar toggles should be moved into a class.
Some sass components should be refactored.
It should be ready for a merge though. I hope you'll enjoy using it 🙂
What's new?
What's missing?
I cheated to get everything done over the weekend. Maybe I should replace the todos in the code with issues instead?
It should be ready for a merge though. I hope you'll enjoy using it 🙂
Screenshots
I'm also uploading a video in #design on Slack.