Propagate custom styles in drawer section

[koustuvsinha]

I cant apply my own custom styles in Drawer.Section. Probably the styles as prop should be passed on here?

The need of this is because several times the section headers are overalapped and even the items are not visible at times. Here is a screenshot of what happens when i place two sections one after the other :

Also, if there is two sections one after the other, and the second one contains say 3 or more elements, some of them are not even rendered in view :

<Drawer.Section
              items={[{
                  icon: 'home',
                  value: 'Profile Page'
              }
            ]}
          />
        <Drawer.Section
            title="Actions"
            items={[
              {
                icon: 'settings',
                value: 'Settings'
              },
              {
                icon: 'label',
                value: 'Settings-2',
                label: '12'
              },
              {
                icon: 'exit-to-app',
                value: 'Exit'
              }
            ]}
            style={styles.section}
            />

      </Drawer>

Thus i feel maybe propagating the user css might resolve this issue. What do you think?

[ufon]

also have this problem

[lakeoffaith]

also have this problem

[mlabrum]

Want to submit a pull request?

[KasperDeng]

remove the flex attribute in the session's style can resolve the issue.

const styles = {
    section: {
        //flex: 1,
        marginTop: 8
    }
    ...