YourWishes/domsPlace
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added Props support to images, improved logo

Browse Source
This commit is contained in:
Dominic Masters
2018-08-14 21:26:59 +10:00
parent 348b3590b0
commit e85292ef33
4 changed files with 42 additions and 7 deletions
public
image
Image.jsx
language
en-AU.jsx
nav/navbar
Navbar.jsx
page/home/sections
PlatformsSection.jsx

1
public/image/Image.jsx

@ -129,6 +129,7 @@ export default class Image extends React.Component {
<picture>
{ sourceElements }
<img
{ ...sourceProps }
onLoad={ this.onLoad.bind(this) }
onError={ this.onError.bind(this) }
src={ defaultSrc }

18
public/language/en-AU.jsx

@ -54,7 +54,23 @@ module.exports = {
},
"platforms": {
"heading": "Platforms I work with",
"footer": "... And many more!"
"footer": "... And many more!",
"shopify": "Shopify",
"react": "React",
"monogame": "MonoGame",
"nodejs": "NodeJS",
"csharp": "C#",
"php": "PHP",
"java": "Java",
"neto": "neto",
"pgsql": "PostgreSQL",
"mysql": "MySQL",
"heroku": "Heroku",
"opengl": "OpenGL",
"discord": "Discord",
"twitch": "Twitch",
"twitter": "Twitter",
"googlecloud": "Google Cloud Platform"
},
"work": {
"heading": "Some of my work",

6
public/nav/navbar/Navbar.jsx

@ -28,6 +28,7 @@ import { NavLink } from 'react-router-dom'
import PageBoundary from './../../page/PageBoundary';
import Language from './../../language/Language';
import HamburgerMenu from './../menu/HamburgerMenu';
import Image from './../../image/Image';
const NavbarLink = function(props) {
return (
@ -51,10 +52,13 @@ class Navbar extends React.Component {
{/* Logo */}
<NavLink to="/" className="c-navbar__logo-container" activeClassName="is-active">
<img
<Image
src={ require('./../../images/logo.svg') }
className="c-navbar__logo"
alt={ Language.get("site.name") }
title={ Language.get("site.name") }
width="780"
height="200"
/>
</NavLink>

24
public/page/home/sections/PlatformsSection.jsx

@ -38,7 +38,7 @@ const Platform = (props) => {
if(props.to) {
children = (
<a href={props.to} target="_blank" className="p-home-page__brands-link">
<a href={props.to} target="_blank" className="p-home-page__brands-link" title={props.title}>
{image}
</a>
);
@ -77,12 +77,14 @@ export default (props) => {
src={require('./../../../images/branding/shopify/shopify_glyph.svg')}
from="left"
to="//www.shopify.com"
title={ Language.get("pages.home.platforms.shopify") }
/>
{/* React */}
<Platform
src={require('./../../../images/branding/react/react-logo.svg')}
from="top"
to="//reactjs.org"
title={ Language.get("pages.home.platforms.react") }
/>
{/* MonoGame */}
@ -90,6 +92,7 @@ export default (props) => {
src={require('./../../../images/branding/monogame/monogame-logo.svg')}
from="bottom"
to="http://www.monogame.net"
title={ Language.get("pages.home.platforms.monogame") }
/>
{/* PGSQL */}
@ -97,6 +100,7 @@ export default (props) => {
src={require('./../../../images/branding/pgsql/pgsql-logo.svg')}
from="right"
to="//www.postgresql.org"
title={ Language.get("pages.home.platforms.pgsql") }
/>
{/* NodeJS */}
@ -104,6 +108,7 @@ export default (props) => {
src={require('./../../../images/branding/nodejs/nodejs-logo.svg')}
from="top"
to="//nodejs.org"
title={ Language.get("pages.home.platforms.nodejs") }
/>
{/* C# */}
@ -111,6 +116,7 @@ export default (props) => {
src={require('./../../../images/branding/csharp/csharp-logo.svg')}
from="top"
to="//docs.microsoft.com/en-us/dotnet/csharp/"
title={ Language.get("pages.home.platforms.csharp") }
/>
{/* PHP */}
@ -118,6 +124,7 @@ export default (props) => {
src={require('./../../../images/branding/php/php-logo.svg')}
from="top"
to="//php.net"
title={ Language.get("pages.home.platforms.php") }
/>
{/* Java */}
@ -125,13 +132,15 @@ export default (props) => {
src={require('./../../../images/branding/java/java-logo.svg')}
from="top"
to="//java.com"
title={ Language.get("pages.home.platforms.java") }
/>
{/* neto */}
<Platform
src={require('./../../../images/branding/neto/neto-logo.svg')}
from="bottom"
to="http://www.monogame.net"
to="//www.neto.com.au"
title={ Language.get("pages.home.platforms.neto") }
/>
{/* MySQL */}
@ -139,6 +148,7 @@ export default (props) => {
src={require('./../../../images/branding/mysql/mysql-logo.svg')}
from="bottom"
to="//www.mysql.com"
title={ Language.get("pages.home.platforms.mysql") }
/>
{/* Heroku */}
@ -146,6 +156,7 @@ export default (props) => {
src={require('./../../../images/branding/heroku/heroku-logo.svg')}
from="bottom"
to="//heroku.com"
title={ Language.get("pages.home.platforms.heroku") }
/>
{/* OpenGL */}
@ -153,6 +164,7 @@ export default (props) => {
src={require('./../../../images/branding/opengl/opengl-logo.svg')}
from="bottom"
to="//www.opengl.org"
title={ Language.get("pages.home.platforms.opengl") }
/>
{/* Discord */}
@ -160,6 +172,7 @@ export default (props) => {
src={ require('./../../../images/branding/discord/discord-logo.svg') }
from="right"
to="//discordapp.com"
title={ Language.get("pages.home.platforms.discord") }
/>
{/* Twitch */}
@ -167,6 +180,7 @@ export default (props) => {
src={ require('./../../../images/branding/twitch/twitch-logo.svg') }
from="right"
to="//twitch.tv"
title={ Language.get("pages.home.platforms.twitch") }
/>
{/* Twitter */}
@ -174,15 +188,15 @@ export default (props) => {
src={require('./../../../images/branding/twitter/twitter-logo.svg')}
from="left"
to="//twitter.com"
title={ Language.get("pages.home.platforms.twitter") }
/>
{/* Google Cloud */}
<Platform
src={
require('./../../../images/branding/google-cloud/google-cloud-logo.svg')
}
src={ require('./../../../images/branding/google-cloud/google-cloud-logo.svg') }
from="left"
to="//console.cloud.google.com"
title={ Language.get("pages.home.platforms.googlecloud") }
/>
</div>