stream-chat-react-native icon indicating copy to clipboard operation
stream-chat-react-native copied to clipboard

Add root text styles

Open nandorojo opened this issue 2 years ago • 2 comments

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.

nandorojo avatar May 14 '23 23:05 nandorojo

Hey @nandorojo thanks for reaching out, please update your description to follow our feature request temp.

vanGalilea avatar May 15 '23 10:05 vanGalilea

@vanGalilea thanks for the pointer, just did!

nandorojo avatar May 15 '23 16:05 nandorojo