React Hello World Example with ES6+JSX
A basic Hello World widget with in browser JSX transformed + ES6 support
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.1/JSXTransformer.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.1/react-with-addons.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration.js"></script>
<div id="container">
<!-- This element's contents will be replaced with your component. -->
</div>
CSS
.content {
overflow: hidden;
line-height: 1.2em;
height: 3.6em;
}
.content.collapsed{
overflow: hidden;
}
.content.expanded{
overflow: visible;
height: auto;
}
JavaScript 1.7
const getDescription = () => (
`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam porta ex leo, sed finibus mi dignissim non. Vivamus in sem leo. Fusce varius ultrices diam vitae consequat. Sed nulla nisi, pretium sit amet volutpat rutrum, tincidunt ac turpis. Mauris convallis molestie mauris, eu dapibus lorem euismod et. Morbi at ligula mi. Fusce eleifend lacus eu nisl rutrum, vel mollis velit consectetur. Interdum et malesuada fames ac ante ipsum primis in faucibus. Integer maximus sollicitudin nibh eget dignissim. Sed non leo maximus, iaculis leo at, sagittis sapien. Donec vehicula augue eu lorem mattis, sit amet aliquet arcu bibendum. Proin rutrum magna ac nisi tempus lobortis. Aenean quis commodo lorem, maximus tincidunt elit. Vivamus ultrices, odio sit amet tempor egestas, ex eros mattis ex, malesuada iaculis elit ante at nulla. Donec ut magna a lorem posuere eleifend ut vel augue.
Fusce et aliquet nibh. Nam convallis, felis sed tristique venenatis, tellus eros tincidunt neque, vel pellentesque odio augue quis tortor. Nullam rutrum est a nunc rhoncus commodo. Nullam sit amet ullamcorper purus. Quisque scelerisque orci est, id hendrerit sapien pellentesque non. Praesent dui nisi, viverra at magna sit amet, convallis pulvinar neque. Integer lectus nibh, gravida sed sodales ut, efficitur dapibus augue. Proin dignissim tincidunt sapien eu molestie. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam justo nisi, cursus a egestas sit amet, malesuada at nulla. Duis in nisi mauris. Ut congue mauris risus. Donec imperdiet iaculis eros, vehicula eleifend nibh fringilla eu. Nulla in bibendum purus. Donec molestie nibh nec nulla consectetur suscipit.
Cras bibendum lorem sit amet dolor molestie, eget viverra lorem vehicula. Sed vel cursus neque. Quisque consectetur, erat accumsan rutrum hendrerit, metus odio feugiat elit, vel ultricies sem lectus ut turpis. Etiam at leo eget elit imperdiet tempor. Suspendisse...