react-styleguidist

How to change the document content's width?

The default max-width of 'main' element is 1000px, I want to make it wider. I tried the customize style instruction but cannot locate the 'main' element or the 'rsg--content-xx' class by below config in 'styleguide.config.js'

styles: {
  StyleGuide: {
    'rsg--content': {
      maxWidth: 1300,
      width: 1300
    },
    '@global main': {
      maxWidth: 1300,
      width: 1300
    }
  }
}

Any help would be very appreciate.

Solution

  • According to the docs it should be something like this:

    styles: {
  StyleGuide: {
    content: {
      maxWidth: 1300
    }
  }
}