/*
<div className={'footer-bottom-bar'}>
  <div className={classNames('footer-bottom-bar-inner', {isSelected: this.someAttribute === this.someCondition})} >
    <div className={"cwu-txt"}>
      ...text...
    </div>
  </div>
</div>

// => named data at the top

const classes = {
  header: 'footer-header',
  bottomBar: 'footer-bottom-wrapper',
  bottomBarInner: 'footer-bottom-panel',
}
<div className={classes.bottomBar}>
  <div className={classes.bottomBarInner}>
    <div className={classes.header}>
      ...text...
    </div>
  </div>
</div>


// => named Components (that you can replace classes with styles when selector is ready)

const SocialProfileHeader = createElementWithClassName('header', 'cwu-txt')
const BottomBar = createElementWithClassName('div', 'footer-bar')
const BottomBarInner = createElementWithClassName('div', 'footer-bar-inner')

<BottomBar>
  <BottomBarInner>
    <SocialProfileHeader>
      ...text...
    </SocialProfileHeader>
  </BottomBarInner>
</BottomBar>
*/
"use strict";