Skip to content

Instantly share code, notes, and snippets.

@mritzco
Created September 6, 2018 08:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mritzco/1f8ab4ff3263e3fd5b23d7bc775abf80 to your computer and use it in GitHub Desktop.
Save mritzco/1f8ab4ff3263e3fd5b23d7bc775abf80 to your computer and use it in GitHub Desktop.
Using infernojs / reactjs components with transposed content
.text-wrapper {
margin: 0px 10px 0px 34px;
text-align: left;
}
// src/components/IconText/IconText.js
// import Inferno from 'inferno';
import Component from 'inferno-component';
import './IconText.css';
// import Inferno, { linkEvent } from 'inferno';
class IconText extends Component {
render(props, state) {
return (
<div className={"IconText" + (props.className ? ' '+ props.className : '')}>
<div className="float-left">
<img src={props.icon} alt={props.alt || 'icon'} />
</div>
<div className="text-wrapper">
{this.props.children}
</div>
</div>
);
}
}
export default IconText;
<IconText icon={info_icon} alt="tutor info">
/* Random react code in here */
<p className="card-intro">{tutor.intro}</p>
</IconText>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment