Gatsby-theme-novela: Word wrap breaks whole words on mobile layout

[dgovil]

Prerequisites

• [x] Have you searched the issue tracker for similar issues (either past or present)?
• [x] Can you reproduce the issue consistently?
• [x] Are you reporting to the correct repository?
• [ ] Is this something you can debug and fix? Send a pull request! Bug fixes and documentation fixes are welcome.

Description

After upgrading from 0.18.0 to 0.18.3, I find that word wrap on articles and divs breaks words into multiple lines.
Previously, words would not wrap over multiple lines and instead sentenced would wrap at word breaks.

This appears to be a regression in 0.18.1/2/3 that didn't exist in 0.18.0

Version of Novela you are using

0.18.3

Number of posts you have and which data source

• [x] Local : 10
• [ ] Contentful

Describe the bug

Word wrap now happens in between words instead of in word breaks. This makes articles very hard to read.

To Reproduce

Steps to reproduce the behavior:

1. Use default Novela starter with 0.18.3
2. Write post with long sentences and long words
3. View on mobile device

Expected behavior

I expect sentences to only break in word breaks rather than in the middle of words

Screenshots

On Novela 0.18.3

On Novela 0.18.0

Browser

Chrome, Safari

[jshmllr]

issue is on line 35 of theme in src/styles/global.ts — change line-break to line-break: auto;

[Tommrodrigues]

Same problem here. I opened a pull request fixing the issue yesterday: #435. Just need it to be verified and merged.

The issue was introduced with pull request #431.

@jshmllr Is there any advantage to having line-break: auto rather than leaving it out completely, like it was before the erroneous pull request?

[dgovil]

Awesome. Just tried with 0.18.4 that includes your changes @Tommrodrigues and it's back to working.
Thanks for catching that line-break style change.