diff --git a/static/src/js/components/index/project-image.js b/static/src/js/components/index/project-image.js index 76bdee5..41d1590 100644 --- a/static/src/js/components/index/project-image.js +++ b/static/src/js/components/index/project-image.js @@ -5,7 +5,7 @@ var Col = ReactBootstrap.Col; export default class ProjectImage extends React.Component { render() { var animationClass = this.props.isHovered ? 'zoomIn' : 'zoomOut'; - var classes = this.props.data.title.toLowerCase().replace(' ', '-'); + var classes = this.props.data.title.toLowerCase().replace(/ /g, '-'); return (
diff --git a/static/src/js/components/index/project-images-main.js b/static/src/js/components/index/project-images-main.js index fd60aeb..d99219c 100644 --- a/static/src/js/components/index/project-images-main.js +++ b/static/src/js/components/index/project-images-main.js @@ -20,8 +20,8 @@ const DATA = [ link: '', }, { - title: 'Django-client-reverse', - text: 'Hardcoding Django API URLs on your client is a thing of the past!', + title: 'Attack on Blocks', + text: 'The closest thing I\'ve done to games development', link: '', }, { diff --git a/static/src/less/homepage.less b/static/src/less/homepage.less index 5f41f03..18e3f47 100644 --- a/static/src/less/homepage.less +++ b/static/src/less/homepage.less @@ -1,3 +1,4 @@ +@blueprint-logo: url(http://ultimatestorytellingblueprint.com/wp-content/uploads/2014/07/Blueprint-Background1.jpg); .index { #header { height: 100vh; @@ -43,7 +44,7 @@ } #project-images-types { - background: url(http://catesmechanical.com/images/blueprint-background1.jpg); + background: @blueprint-logo; background-size: cover; background-attachment: fixed; @media screen and (max-width: @screen-xs-max) { @@ -69,7 +70,7 @@ background-image: url(../img/projects/kermit-typing.gif); } .work { - background-image: url(http://www.recommendedagencies.com/images/logos/dabapps-logo-1432733278.jpg); + background-image: url(http://www.recommendedagencies.com/pub/logos/dabapps-logo-1432733278.jpg); } } } @@ -104,7 +105,7 @@ } } #project-images-main { - background: url(http://catesmechanical.com/images/blueprint-background1.jpg); + background: @blueprint-logo; background-size: cover; background-attachment: fixed; @media screen and (max-width: @screen-xs-max) { @@ -122,6 +123,30 @@ } .row { margin-bottom: 20px; + & > div { + background-size: cover; + background-position: center; + } + + .custom-pc { + background-image: url(https://c1.staticflickr.com/1/557/18747807580_d01e8e877a_c.jpg); + } + + .bsod-enabler { + background-image: url(https://upload.wikimedia.org/wikipedia/commons/a/a8/Windows_XP_BSOD.png); + } + + .yoga-pal { + background-image: url(http://www.lenovo.com/images/gallery/1060x596/lenovo-laptop-convertible-yoga-2-pro-orange-front-1.jpg); + } + + .attack-on-blocks { + background-image: url(https://c1.staticflickr.com/1/33/49012397_1fbe7855e3_b.jpg); + } + + .dotfile-automator { + background-image: url(https://upload.wikimedia.org/wikipedia/commons/4/49/Dell_Inspiron_One_23_Touch_AIO_Desktop_PC.png); + } } } } @@ -165,7 +190,7 @@ padding: 8%; .flexbox(); align-items: center; - justify-content: center; + justify-content: center; .transition(~"opacity 0.5s ease-in"); opacity: 0; background-color: rgba(0,0,0,0.7);