Skip to content

Add root text styles #2102

Description

@nandorojo

Motivation

It's really difficult to edit text styles to match our brand. I have custom text styles that I want, such as a custom font family. However, stream has so many text node styles that it would take so many hours to set the text styles for all of them.

Proposed solution

Add a text field, similar to colors, inside of style. All text nodes would inherit from this, and would be overridden at the theme level.

Acceptance Criteria

Since React Native often needs a different font-family per weight, maybe the API could look like this:

Something like:

const style = { 
    fontFamily: {
     // any time stream uses fontWeight, it should instead do fontFamily: style.fontFamily[weight]
     default: 'arial',
     600: 'arial-bold',
   },
   text: { // all text nodes inherit this style
     fontFamily: 'arial'
   }
}

Here I add fontFamily and text as keys to style. If Stream's internals want to set bold text, they should do fontFamily: style.fontFamily.bold in the text style.

Also, all Text nodes could set the style.text as their base style, allowing all text nodes to easily set a font family.

Curious to get feedback.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions