diff --git a/src/PersonalData.ts b/src/PersonalData.ts index 764a84b..dcc91cd 100644 --- a/src/PersonalData.ts +++ b/src/PersonalData.ts @@ -1,6 +1,7 @@ import { PersonalData } from "./PersonalDataTypes"; export const personalData: PersonalData = { + updatedDate: '2023-05-26', name: "David Hrdina Němeček", brief: "Software developer, people manager.", diff --git a/src/PersonalDataTypes.ts b/src/PersonalDataTypes.ts index 8bc9add..dabd4cf 100644 --- a/src/PersonalDataTypes.ts +++ b/src/PersonalDataTypes.ts @@ -25,6 +25,7 @@ export type Skills = { } export type PersonalData = { + updatedDate: string, name: string, brief: string, contacts: Contact[], diff --git a/src/app/components/AboutBrief.tsx b/src/app/components/AboutBrief.tsx index 7f58dda..94ace7b 100644 --- a/src/app/components/AboutBrief.tsx +++ b/src/app/components/AboutBrief.tsx @@ -2,14 +2,19 @@ import React, { useContext } from 'react'; import Container from 'react-bootstrap/Container'; import Image from 'react-bootstrap/Image' import { usePersonContext } from './PersonContext'; +import { Col, Row } from 'react-bootstrap'; export default function AboutBrief() { const person = usePersonContext() return ( - - Photograph of the person -

{person.name}

-

{person.brief}

+ + + Photograph of the person + +

{person.name}

+

{person.brief}

+ +
) } diff --git a/src/app/components/Contacts.tsx b/src/app/components/Contacts.tsx index 302a3dd..9b0d17b 100644 --- a/src/app/components/Contacts.tsx +++ b/src/app/components/Contacts.tsx @@ -2,6 +2,7 @@ import React, { ReactNode } from 'react' import { usePersonContext } from './PersonContext' import Container from 'react-bootstrap/esm/Container' import { useAutoFocus } from '../FocusedElement' +import { Col, Row } from 'react-bootstrap' export function Contact(props: {icon?: string, text: string}) { let textElement: ReactNode = {props.text} @@ -21,10 +22,10 @@ export function Contact(props: {icon?: string, text: string}) { textElement = {props.text} } return ( - + {textElement} - + ) } @@ -32,11 +33,13 @@ export function Contacts() { const person = usePersonContext() const focus = useAutoFocus('contacts') return ( - +

Contacts

+ {person.contacts.map((contact, index) => ( ))} +
) } \ No newline at end of file diff --git a/src/app/components/Education.tsx b/src/app/components/Education.tsx index 227795e..fa4f4bf 100644 --- a/src/app/components/Education.tsx +++ b/src/app/components/Education.tsx @@ -6,11 +6,11 @@ import JobHistory from './JobHistory'; export default function WorkExperience() { const person = usePersonContext() - return person.education && ( + return person.education ? ( - ) + ) : <> } diff --git a/src/app/components/Footer.tsx b/src/app/components/Footer.tsx new file mode 100644 index 0000000..1058300 --- /dev/null +++ b/src/app/components/Footer.tsx @@ -0,0 +1,13 @@ +import React from 'react'; +import { Container } from 'react-bootstrap'; +import { usePersonContext } from './PersonContext'; + +export default function Footer() { + const personalData = usePersonContext() + return ( + +

Created by {personalData.name}, last updated on {personalData.updatedDate}

+

CV engineered by Dejvino

+
+ ) +} \ No newline at end of file diff --git a/src/app/globals.css b/src/app/globals.css index e3aeffa..e318ef8 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -2,6 +2,25 @@ @import 'bootstrap/dist/css/bootstrap.min.css'; @import 'bootstrap-icons/font/bootstrap-icons.min.css'; +body { + background-color: lightgrey; +} + +.main-container { + background-color: white; + padding-top: 1rem; + padding-bottom: 0.2rem; +} +.footer { + margin-top: 2rem; +} +.tiny { + font-size: 75%; +} +h2, h3, h4 { + margin-top: 1em; +} + .job-card { margin-top: 1em; } diff --git a/src/app/page.tsx b/src/app/page.tsx index d8a61fd..e081d86 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,22 +1,26 @@ 'use client' import React from 'react'; import Container from 'react-bootstrap/Container'; -import JobsHistory from './components/WorkExperience'; import AboutBrief from './components/AboutBrief'; import Skills from './components/Skills'; import { Contacts } from './components/Contacts'; import WorkExperience from './components/WorkExperience'; import Education from './components/Education'; +import { Col, Row } from 'react-bootstrap'; +import Footer from './components/Footer'; export default function Home() { return ( - - - - - - + + + + + + + + +