-
-
Notifications
You must be signed in to change notification settings - Fork 725
Design styleguide: fonts and text styles
mariocarabotta edited this page Jul 5, 2023
·
1 revision
The primary font used should always be Open Sans. We have decided to stick to using pixels and not rems because of the risk of having to refactor multiple pages in trying to transition to a different size system. So let's keep pixels.
Default body size is 14px. General rule is to try to work with that first, also playing with different weights, and only if for some reason that's not good, move to a different size.
Type | Size desktop | Used for |
---|---|---|
Body | 14px | Body text, Secondary top menu, Main button label, Table titles, Table text, Pagination labels, Text/search/dropdown fields |
H1 | 24px | Page titles |
Highlight text | 16px | This is an alternative for when body text is not big enough - Primary top menu, loading state for whole page, empty and error states for whole page |
Caption | 12px | Text/search/dropdown titles, Text/search/dropdown error messages, hint texts and counters |
Development environment setup
- Pipeline development process
- Bug severity
- Feature template (epic)
- Internationalisation (i18n)
- Dependency updates
Development
- Developer Guidelines
- The process of review, test, merge and deploy
- Making a great commit
- Making a great pull request
- Code Conventions
- Database migrations
- Testing and Rspec Tips
- Automated Testing Gotchas
- Rubocop
- Angular and OFN
- Feature toggles
- Stimulus and Turbo
Testing
- Testing process
- OFN Testing Documentation (Handbooks)
- Continuous Integration
- Parallelized test suite with knapsack
- Karma
Releasing
Specific features
Data and APIs
Instance-specific configuration
External services
Design