From 9bc2eb70b2e580dc77952194c1a725529e756997 Mon Sep 17 00:00:00 2001 From: Scott Tolksdorf Date: Mon, 11 Jan 2016 14:39:01 -0500 Subject: [PATCH] Styled the homepage a bit better --- client/homebrew/homebrew.jsx | 6 ++-- client/naturalCrit/home/home.less | 56 +++++++++++++++++++++---------- server/homebrew.api.js | 53 +++++++++++++++-------------- 3 files changed, 68 insertions(+), 47 deletions(-) diff --git a/client/homebrew/homebrew.jsx b/client/homebrew/homebrew.jsx index e5dc4ffd0..7e34a1e18 100644 --- a/client/homebrew/homebrew.jsx +++ b/client/homebrew/homebrew.jsx @@ -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 + return }, '/homebrew/share/:id' : (args) => { - return + return }, '/homebrew*' : , }); diff --git a/client/naturalCrit/home/home.less b/client/naturalCrit/home/home.less index 1ce66a62e..0381be6e2 100644 --- a/client/naturalCrit/home/home.less +++ b/client/naturalCrit/home/home.less @@ -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();} -} \ No newline at end of file +} +*/ \ No newline at end of file diff --git a/server/homebrew.api.js b/server/homebrew.api.js index 185b1b992..02e5462ce 100644 --- a/server/homebrew.api.js +++ b/server/homebrew.api.js @@ -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) {