diff --git a/package.json b/package.json index 11af750..6c67683 100644 --- a/package.json +++ b/package.json @@ -4,18 +4,26 @@ "description": "Portfolio Site", "main": "src/index.jsx", "scripts": { - "start": "parcel index.html" + "start": "parcel index.html", + "build": "parcel build index.html" }, "author": "", "license": "BSD-2-Clause", "devDependencies": { "@babel/core": "^7.12.3", - "@babel/plugin-transform-react-jsx": "^7.12.1", + "@babel/plugin-transform-react-jsx": "^7.12.5", + "cssnano": "^4.1.10", "parcel-bundler": "^1.12.4" }, "dependencies": { "@material-ui/core": "^4.11.0", - "preact": "^10.5.5" + "@types/react": "^16.9.56", + "fontsource-roboto": "^3.0.3", + "preact": "^10.5.5", + "preact-async-route": "^2.2.1", + "preact-router": "^3.2.1", + "react": "^16.14.0", + "react-dom": "^16.14.0" }, "skipLibCheck": true, "alias": { diff --git a/src/Contact.jsx b/src/Contact.jsx new file mode 100644 index 0000000..45fe305 --- /dev/null +++ b/src/Contact.jsx @@ -0,0 +1,55 @@ +import { h, render, Component } from "preact"; +import Header from "./Header"; +import { + Container, + Card, + CardHeader, + CardContent, + Typography, + List, + ListItem, + ListItemText, + Link, +} from "@material-ui/core"; + +class Contact extends Component { + render() { + return ( + +
+ +

+ + + + + + LinkedIn:{" "} + + https://www.linkedin.com/in/warwick-new-96491a147/ + + + + Email:{" "} + + warwick.l.e.new@gmail.com + + + + Phone Number:{" "} + + 07445 728 181 + + + + + + + ); + } +} + +export default Contact; diff --git a/src/GameProjects.jsx b/src/GameProjects.jsx index 3ea6640..5f17cce 100644 --- a/src/GameProjects.jsx +++ b/src/GameProjects.jsx @@ -12,6 +12,7 @@ import { Button, } from "@material-ui/core"; import Monq from "../static/images/Monq.jpg"; +import Graphics from "../static/images/Graphics.png"; class GameProjects extends Component { constructor(props) { @@ -34,13 +35,13 @@ levels to show that off nor create a hook to keep people interested in the game. { header: "Graphics", subheader: "Bsc (hons) Computing for Games - Falmouth University", - image: undefined, - imageAltText: "Need up to date image", + image: Graphics, + imageAltText: "Generated terrain", content: `This is where I learned how to create a graphics engine from scratch using OpenGL and was the project which I enjoyed the most during my bachelors degree. I especially enjoyed how deep I jumped into C++ to improve it's memory footprint returning to this project in my final year of university.`, - buttonText: "Need link", + buttonText: undefined, buttonLink: undefined, }, ]; diff --git a/src/Greeting.jsx b/src/Greeting.jsx index 437e610..52ce4a3 100644 --- a/src/Greeting.jsx +++ b/src/Greeting.jsx @@ -8,7 +8,7 @@ import { Button, } from "@material-ui/core"; import CV from "../static/cv.pdf"; -import PortfolioVideo from "../static/video/Portfolio.mp4"; +import PortfolioVideo from "../static/video/Portfolio.webm"; class Greeting extends Component { render() { @@ -23,8 +23,8 @@ class Greeting extends Component { width: "100%", left: "50%", right: "50%", - top: "50%", - height: "100%", + top: "25%", + height: "50%", objectFit: "cover", transform: "translate(-50%,-50%)", zIndex: "-1", @@ -32,7 +32,7 @@ class Greeting extends Component { //width="100%" //height="315" > - +

diff --git a/src/Header.jsx b/src/Header.jsx index 8540c82..cf09fbf 100644 --- a/src/Header.jsx +++ b/src/Header.jsx @@ -1,14 +1,42 @@ import { h, render, Component } from "preact"; -import { AppBar, Toolbar, Container, Typography } from "@material-ui/core"; +import { + AppBar, + Toolbar, + Container, + Typography, + Button, + Box, + Link, +} from "@material-ui/core"; +import { makeStyles } from "@material-ui/core/styles"; class Header extends Component { + constructor(props) { + super(props); + this.styles = makeStyles({ + toolbarButtons: { + marginLeft: "auto", + }, + }); + } + render() { + const classes = this.styles(); return ( - - Warwick New - + + Warwick New + + + ); diff --git a/src/Home.jsx b/src/Home.jsx new file mode 100644 index 0000000..50a50bf --- /dev/null +++ b/src/Home.jsx @@ -0,0 +1,23 @@ +import { h, render, Component } from "preact"; +import { Container } from "@material-ui/core"; +import Header from "./Header"; +import Greeting from "./Greeting"; +import WebProjects from "./WebProjects"; +import GameProjects from "./GameProjects"; + +class Home extends Component { + render() { + return ( + +

+ + + + + + + ); + } +} + +export default Home; diff --git a/src/index.jsx b/src/index.jsx index 6dd1777..5bc56c0 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -1,24 +1,26 @@ import { h, render, Component } from "preact"; -import { Container, Grid, Button, Typography } from "@material-ui/core"; +import Router from "preact-router"; +import AsyncRoute from "preact-async-route"; import { ThemeProvider } from "@material-ui/core/styles"; import CssBaseline from "@material-ui/core/CssBaseline"; +import Home from "./Home"; import theme from "./theme"; -import Header from "./Header"; -import Greeting from "./Greeting"; -import WebProjects from "./WebProjects"; -import GameProjects from "./GameProjects"; +import "fontsource-roboto"; class App extends Component { render() { return ( -
- - - - - + + + + import("./Contact.jsx").then((module) => module.default) + } + /> + ); } diff --git a/static/images/Graphics.png b/static/images/Graphics.png new file mode 100644 index 0000000..6950520 Binary files /dev/null and b/static/images/Graphics.png differ diff --git a/static/video/Portfolio.webm b/static/video/Portfolio.webm new file mode 100644 index 0000000..1552943 Binary files /dev/null and b/static/video/Portfolio.webm differ