Added template for dynamic projects component
This commit is contained in:
parent
60260ada94
commit
ac360f4544
1 changed files with 26 additions and 3 deletions
|
@ -1,14 +1,37 @@
|
||||||
var React = require('react');
|
var React = require('react');
|
||||||
|
|
||||||
|
const projectData = [
|
||||||
|
{key: 1, title: "College", info: "", link: ""}
|
||||||
|
{key: 2, title: "Personal", info: "", link: ""}
|
||||||
|
{key: 3, title: "Work", info: "", link: ""}
|
||||||
|
];
|
||||||
|
|
||||||
|
|
||||||
var projectImages = React.createClass({
|
var projectImages = React.createClass({
|
||||||
|
getInitialState: function () {
|
||||||
|
return {
|
||||||
|
hover: 0,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
setHovering: function (key, evt) {
|
||||||
|
this.setState({hover: key});
|
||||||
|
},
|
||||||
render: function () {
|
render: function () {
|
||||||
|
var isHovered;
|
||||||
|
var projectTiles = projectData.map(function (project) {
|
||||||
|
isHovered = (project.key == this.state.hover);
|
||||||
|
return (
|
||||||
|
<div className="col-sm-4">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
});
|
||||||
return (
|
return (
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<div className="panel panel-default">
|
<div className="panel panel-default">
|
||||||
<div className="panel-body row">
|
<div className="panel-body row">
|
||||||
<div className="col-xs-4">
|
{ projectTiles }
|
||||||
<p>things</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Reference in a new issue