scalable_css_Photo_ex.md

Photo/style.css

/* block */
.Photo {}

/* element */
.Photo__img {}

/* modifier */
.Photo--large {}

Photo/index.js

import './style' // tyvm Webpack
import React from 'react'
import cn from 'classnames'

const Photo = ({src, alt, isLarge}) =>
  <div {...{ className: cn({
    Photo: true,
    'Photo--large': isLarge})
  }}>
    <img {...{ src, alt,
      className: 'Photo__img' }}
    />
  </div>