Last active
June 11, 2016 06:31
-
-
Save jkup/6c3a6be5787e25d726e8d4a317d7c9cc to your computer and use it in GitHub Desktop.
Sometimes it's wild how different my JavaScript looks from a few years ago
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict' | |
import React from 'react' | |
import { StyleSheet, css } from 'aphrodite' | |
class ToDoList extends React.Component { | |
constructor (props) { | |
super(props) | |
this.displayName = 'ToDoList' | |
this.state = { | |
items: ['Learn React.js!'] | |
} | |
} | |
render () { | |
const toDoItems = this.state.items.map((item) => { | |
return <li className={css(styles.toDoItem)}>{item}</li> | |
}) | |
return ( | |
<ul className={css(styles.toDoList)}> | |
{toDoItems} | |
</ul> | |
) | |
} | |
} | |
const styles = StyleSheet.create({ | |
toDoList: { | |
borderTop: '1px solid #e6e6e6', | |
margin: '0', | |
padding: '0' | |
}, | |
toDoItem: { | |
borderBottom: '1px solid #ededed', | |
color: '#4d4d4d', | |
fontWeight: '300', | |
listStyle: 'none', | |
lineHeight: '3em', | |
textIndent: '60px' | |
} | |
}) | |
export default ToDoList |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment