TWE Design System: Create Microsite Documentation Standards and Contributor Guidelines

[revforyou]

Overview

As more Design System microsites are added and updated, there is currently no documented standard for page structure, content organization, or implementation patterns.

Action Items

• Recommended microsite page structure and section order
• Expected documentation sections (Overview, Specs, Usage, Accessibility, Code, Examples, etc.)
• Guidelines for code examples and previews
• File organization and where component assets should live
• SCSS and styling conventions
• Relationship between Figma designs and implementation
• Include necessary files in the MKdocs docs/ folder and project config
• Best practices for maintaining consistency across microsites

Resources

• 1.01 Design Reference
  • Design Systems Figma
• 1.02 WIKI: Design system microsite JavaScript
• 1.03 MKdocs folder: /docs on repo
• 1.04 MDdocs config file: mkdocs.yml on repo
• 1.05 variables file: /docs/components/sass/abstracts/_variables.scss on repo
• 1.06 SASS file folder: /docs/components/sass/components
• 1.07 Variables SASS Sheet: /docs/components/sass/abstracts/variables.sss