Fixed project image triplet
This commit is contained in:
parent
98af512c1e
commit
f14b7f7ff9
3 changed files with 16 additions and 9 deletions
|
@ -7,13 +7,13 @@ var projectImage = React.createClass({
|
||||||
render: function () {
|
render: function () {
|
||||||
var contents = this.props.isHovered ?
|
var contents = this.props.isHovered ?
|
||||||
(
|
(
|
||||||
<span>
|
<div className="animated zoomIn">
|
||||||
<h4>{this.props.data.title}</h4>
|
<h4>{this.props.data.title}</h4>
|
||||||
<p>{this.props.data.text}</p>
|
<p>{this.props.data.text}</p>
|
||||||
<a href={this.props.data.link} className="btn btn-default">
|
<a href={this.props.data.link} className="btn btn-default">
|
||||||
Find out more
|
Find out more
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</div>
|
||||||
) : null;
|
) : null;
|
||||||
return (
|
return (
|
||||||
<Col sm={4}>
|
<Col sm={4}>
|
||||||
|
|
|
@ -7,19 +7,19 @@ const DATA = [
|
||||||
{
|
{
|
||||||
className: "",
|
className: "",
|
||||||
title: "College",
|
title: "College",
|
||||||
text: "",
|
text: "Some College Stuff",
|
||||||
link: "",
|
link: "",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
className: "",
|
className: "",
|
||||||
title: "Personal",
|
title: "Personal",
|
||||||
text: "",
|
text: "Some Personal Stuff",
|
||||||
link: "",
|
link: "",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
className: "",
|
className: "",
|
||||||
title: "Work",
|
title: "Work",
|
||||||
text: "",
|
text: "Some Work Stuff",
|
||||||
link: "",
|
link: "",
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
|
@ -111,16 +111,23 @@ ol , ul{
|
||||||
}
|
}
|
||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
background-color: black;
|
|
||||||
color: white;
|
color: white;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
background-color: red;
|
||||||
|
|
||||||
&:hover .project {
|
&:hover .project {
|
||||||
opacity: 0.6;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
& .project {
|
& .project {
|
||||||
opacity: 1;
|
padding: 18px;
|
||||||
|
.transition(~"opacity 0.5s ease-in");
|
||||||
|
opacity: 0;
|
||||||
|
background-color: rgba(0,0,0,0.6);
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Reference in a new issue