render()

in src/templates/components/Sidebar/Sidebar.js [22:65]


  render() {
    const {
      closeParentMenu,
      createLink,
      enableScrollSync,
      location,
      sectionList,
    } = this.props;
    const {activeSection} = this.state;

    const SectionComponent = enableScrollSync ? ScrollSyncSection : Section;

    return (
      <Flex
        type="nav"
        direction="column"
        halign="stretch"
        css={{
          width: '100%',
          paddingLeft: 20,
          position: 'relative',

          [media.greaterThan('largerSidebar')]: {
            paddingLeft: 40,
          },

          [media.lessThan('small')]: {
            paddingBottom: 100,
          },
        }}>
        {sectionList.map((section, index) => (
          <SectionComponent
            createLink={createLink}
            isActive={activeSection === section || sectionList.length === 1}
            key={index}
            location={location}
            onLinkClick={closeParentMenu}
            onSectionTitleClick={() => this._toggleSection(section)}
            section={section}
          />
        ))}
      </Flex>
    );
  }