Context
Our current section header uses the smallBold font. That means it has font size 12pt in ObsIdentify and 14pt in Observation. This is actually not according to the design. This is a small element and one of the exceptions to texts that scale with the given base font size. So the aim is to use a fixed 12pt font size in this component, in both apps.
Requirements
- Solve this in the theme, not by specifying a hard-coded font size in the app
- Define fixed 12pt versions for the small font variations, e.g.
fixedSmall, fixedSmallBold and fixedSmallLight (names can be discussed)
- Use the
fixedSmallBold text style in SectionHeader
- Increment the version number and update react-native-components in both apps
Other examples
We have several other examples of texts that should not scale with the base font size. Not all of these things have a shared component yet, but they might be in the future.
Examples:
- text size in tab-bar buttons (should be same)
- text size in notification (circle + number) (should be same?)
- text size for labels in observation filter / rarity filter (should be same)
- icon size of "about this species" icon in identification result (should be what?)
Context
Our current section header uses the
smallBoldfont. That means it has font size 12pt in ObsIdentify and 14pt in Observation. This is actually not according to the design. This is a small element and one of the exceptions to texts that scale with the given base font size. So the aim is to use a fixed 12pt font size in this component, in both apps.Requirements
fixedSmall,fixedSmallBoldandfixedSmallLight(names can be discussed)fixedSmallBoldtext style in SectionHeaderOther examples
We have several other examples of texts that should not scale with the base font size. Not all of these things have a shared component yet, but they might be in the future.
Examples: