diff --git a/src/PersonalData.ts b/src/PersonalData.ts
index cffc1c2..3610517 100644
--- a/src/PersonalData.ts
+++ b/src/PersonalData.ts
@@ -37,7 +37,11 @@ export const personalData: PersonalData = {
position: 'Software Engineer',
company: 'Q2 Interactive',
timerange: '2009 - 2013',
- description: '',
+ description: `Development and project lead of multiple web applications:
+ - CRM system (PHP backend with Android frontend),
+ - Accounting web app,
+ - e-commerce sites.`,
+ tags: ['PHP', 'Java', 'Server hosting', 'Linux', 'Android']
}
]
},
diff --git a/src/app/components/job/JobCard.tsx b/src/app/components/job/JobCard.tsx
index 34d040e..c83d9f1 100644
--- a/src/app/components/job/JobCard.tsx
+++ b/src/app/components/job/JobCard.tsx
@@ -1,6 +1,7 @@
import React from 'react';
import Card from 'react-bootstrap/Card';
-import { useAutoFocus, useFocusedElement } from '../../hooks/FocusedElement';
+import { useAutoFocus } from '../../hooks/FocusedElement';
+import { Placeholder } from 'react-bootstrap';
export type Props = {
heading?: string,
@@ -10,6 +11,20 @@ export type Props = {
description: string
};
+export function JobCardPlaceholder() {
+ return
+
+
+
+
+
+ {' '}
+
+
+
+
+}
+
export default function JobCard(props: Props) {
const focusRef = useAutoFocus([props.position, props.company, props.timerange].join(' - '))
return (
@@ -22,7 +37,7 @@ export default function JobCard(props: Props) {
{props.company}, {props.timerange}
- {props.description}
+ {props.description}
);
diff --git a/src/app/components/job/JobsAccordion.tsx b/src/app/components/job/JobsAccordion.tsx
index b196cc0..7b8530a 100644
--- a/src/app/components/job/JobsAccordion.tsx
+++ b/src/app/components/job/JobsAccordion.tsx
@@ -40,7 +40,7 @@ export default function JobsAccordion(props: JobListProps) {
{jobs.previous?.map((job, index) => (
-
+
{job.description}
diff --git a/src/app/components/job/JobsCards.tsx b/src/app/components/job/JobsCards.tsx
index d4d1a40..addf361 100644
--- a/src/app/components/job/JobsCards.tsx
+++ b/src/app/components/job/JobsCards.tsx
@@ -3,7 +3,7 @@ import React from 'react';
import Container from 'react-bootstrap/Container';
import Col from 'react-bootstrap/Col';
import Row from 'react-bootstrap/Row';
-import JobCard from './JobCard';
+import JobCard, { JobCardPlaceholder } from './JobCard';
import { partition } from '../../utils';
import { JobListProps } from './types';
@@ -16,6 +16,13 @@ const defaultProps = {
currentHeading: 'Currently',
}
+export function JobsCardsPlaceholder() {
+ return
+
+
+
+}
+
export default function JobsCards(props: JobListProps) {
const {jobs} = props
const config = {...defaultProps, ...props}
diff --git a/src/app/components/job/JobsHistory.tsx b/src/app/components/job/JobsHistory.tsx
index 70bf469..e2878f3 100644
--- a/src/app/components/job/JobsHistory.tsx
+++ b/src/app/components/job/JobsHistory.tsx
@@ -4,7 +4,7 @@ import Container from 'react-bootstrap/Container';
import useSize from '../../hooks/Size';
import { JobListProps } from './types';
import JobsAccordion from './JobsAccordion';
-import JobsCards from './JobsCards';
+import JobsCards, { JobsCardsPlaceholder } from './JobsCards';
export type Props = {
heading: string,
@@ -18,7 +18,8 @@ const defaultProps = {
export default function JobHistory(props: Props) {
const {SizeWrapper, size} = useSize()
- const jobsList = size.width < 600 ? :
+ const jobsList = size.width === 0 ? : (
+ size.width < 600 ? : )
return (
diff --git a/src/app/globals.css b/src/app/globals.css
index df30714..4b0e015 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -61,3 +61,9 @@ body {
.accordion-button.collapsed {
background-color: lavender;
}
+.accordion {
+ margin: 1rem;
+}
+.multiline {
+ white-space: pre-line;
+}