0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-24 20:42:43 +00:00

Styled the homepage a bit better

This commit is contained in:
Scott Tolksdorf
2016-01-11 14:39:01 -05:00
parent c359805679
commit 9bc2eb70b2
3 changed files with 68 additions and 47 deletions

View File

@@ -14,7 +14,7 @@ var Homebrew = React.createClass({
return {
url : "",
text : "",
entry : {
brew : {
text : "",
shareId : null,
editId : null,
@@ -26,10 +26,10 @@ var Homebrew = React.createClass({
componentWillMount: function() {
Router = CreateRouter({
'/homebrew/edit/:id' : (args) => {
return <EditPage id={args.id} entry={this.props.entry} />
return <EditPage id={args.id} entry={this.props.brew} />
},
'/homebrew/share/:id' : (args) => {
return <SharePage id={args.id} entry={this.props.entry} />
return <SharePage id={args.id} entry={this.props.brew} />
},
'/homebrew*' : <HomePage />,
});

View File

@@ -29,56 +29,60 @@
.sequentialDelay(0.5s, 1s);
.fadeInDown(1s);
.keep();
opacity : 0;
display : inline-block;
cursor : pointer;
opacity : 0;
text-align : center;
border-right : 5px solid @silver;
border-right : 1px solid #333;
&:last-child{
border : none;
}
.content{
.addSketch(360px);
.animate(background-color, 0.5s);
padding : 40px;
width : 500px;
width : 500px;
padding : 40px;
&:hover{
background-color: fade(@red, 20%);
svg, h2{
.transform(scale(1.3));
}
}
h2{
.animateAll(0.5s);
font-family : 'CodeBold';
font-size : 2em;
.animateAll(0.5s);
}
p{
max-width : 300px;
margin : 20px auto;
line-height: 1.5em;
}
svg{
.animateAll(0.5s);
height : 10em;
}
}
//Proejct specific styles
&.homebrew{
.content:hover{
background-color : fade(@teal, 20%);
}
}
&.combat{
.content:hover{
background-color : fade(@red, 20%);
}
}
}
}
}
.addSketch(@length, @color : black){
&:hover{
path, line, polyline, circle, rect, polygon{
.sketch(@length, @color, 2s)
}
}
path, line, polyline, circle, rect, polygon {
.sketch(@length, @color, 4s);
stroke-dasharray : @length;
stroke-dashoffset : 0px;
stroke : @color;
@@ -87,6 +91,21 @@
//.animateAll(3s);
}
}
.sketch(@length, @color : black, @duration : 3s, @easing : @defaultEasing){
.createAnimation(sketch, @duration, @easing);
.sketchKeyFrames(){
0% { stroke-dashoffset : @length; fill: transparent;}
50% { stroke-dashoffset : @length; fill: transparent;}
80% { stroke-dashoffset : 0px; fill: transparent;}
100% { stroke-dashoffset : 0px; fill:@color;}
}
@-webkit-keyframes sketch {.sketchKeyFrames();}
@-moz-keyframes sketch {.sketchKeyFrames();}
@-ms-keyframes sketch {.sketchKeyFrames();}
@-o-keyframes sketch {.sketchKeyFrames();}
@keyframes sketch {.sketchKeyFrames();}
}
/*
.sketch(@length, @color : black, @duration : 3s, @easing : @defaultEasing){
.createAnimation(bounce, @duration, @easing);
.sketchKeyFrames(){
@@ -101,4 +120,5 @@
@-ms-keyframes bounce {.sketchKeyFrames();}
@-o-keyframes bounce {.sketchKeyFrames();}
@keyframes bounce {.sketchKeyFrames();}
}
}
*/

View File

@@ -12,31 +12,6 @@ module.exports = function(app){
})
//Edit Page
app.get('/homebrew/edit/:id', function(req, res){
HomebrewModel.find({editId : req.params.id}, function(err, objs){
var resObj = null;
var errObj = {text: "# oops\nCould not find the homebrew."}
if(objs.length){
resObj = objs[0];
}
vitreumRender({
page: './build/homebrew/bundle.dot',
globals:{},
prerenderWith : './client/homebrew/homebrew.jsx',
initialProps: {
url: req.originalUrl,
entry : resObj || errObj
},
clearRequireCache : true,
}, function (err, page) {
return res.send(page)
});
})
});
//Updating
app.put('/homebrew/update/:id', function(req, res){
HomebrewModel.find({editId : req.params.id}, function(err, objs){
@@ -68,6 +43,32 @@ module.exports = function(app){
//Edit Page
app.get('/homebrew/edit/:id', function(req, res){
HomebrewModel.find({editId : req.params.id}, function(err, objs){
var resObj = null;
var errObj = {text: "# oops\nCould not find the homebrew."}
if(objs.length){
resObj = objs[0];
}
vitreumRender({
page: './build/homebrew/bundle.dot',
globals:{},
prerenderWith : './client/homebrew/homebrew.jsx',
initialProps: {
url: req.originalUrl,
brew : resObj || errObj
},
clearRequireCache : true,
}, function (err, page) {
return res.send(page)
});
})
});
//Share Page
app.get('/homebrew/share/:id', function(req, res){
HomebrewModel.find({shareId : req.params.id}, function(err, objs){
@@ -87,7 +88,7 @@ module.exports = function(app){
prerenderWith : './client/homebrew/homebrew.jsx',
initialProps: {
url: req.originalUrl,
entry : resObj || errObj
brew : resObj || errObj
},
clearRequireCache : true,
}, function (err, page) {