Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2025-11-19 03:01:53 +10:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'upstream/develop' into develop

Browse Source
This commit is contained in:
gianantoniopini
2020-12-07 15:06:43 +01:00
parent fe2e56bda0 bce80a9101
commit 7af9b1469d
25 changed files with 5083 additions and 9964 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/builder/center/Artboard.js
View File

@ -1,4 +1,4 @@
import React, { memo, useEffect, useState } from 'react';
import React, { memo } from 'react';
import { Helmet } from 'react-helmet';
import { useTranslation } from 'react-i18next';
import { useSelector } from '../../../contexts/ResumeContext';
@ -13,14 +13,9 @@ import styles from './Artboard.module.css';
const Artboard = () => {
const state = useSelector();
const { t } = useTranslation();
const [width, setWidth] = useState(0);
const { id, name, metadata } = state;
const { template } = metadata;
useEffect(() => {
setWidth(typeof window !== `undefined` && window && window.innerWidth);
}, [typeof window !== `undefined` && window && window.innerWidth]);
return (
<>
<Helmet>
@ -30,14 +25,7 @@ const Artboard = () => {
<link rel="canonical" href={`https://rxresu.me/app/builder/${id}`} />
</Helmet>
<div
id="page"
className={styles.container}
style={{
transform: `scale(${width / 1680})`,
transformOrigin: `${width / 1680 > 1.0 ? `top left` : ``}`,
}}
>
<div id="page" className={styles.container}>
{template === 'onyx' && <Onyx data={state} />}
{template === 'pikachu' && <Pikachu data={state} />}
{template === 'gengar' && <Gengar data={state} />}

5
src/components/builder/center/Artboard.module.css
View File

@ -1,10 +1,11 @@
@media screen {
.container {
width: 210mm;
min-height: 297mm;
height: 297mm;
overflow: scroll;
margin: 2rem auto;
box-shadow: var(--shadow);
@apply my-16 bg-white rounded;
@apply bg-white rounded;
}
}

2
src/i18n/locales/fr.json
View File

@ -9,7 +9,7 @@
"required": "Requis",
"website": "Site web",
"date": "Date",
"present": "Aujourd’hui",
"present": "Présent",
"position": "Poste",
"startDate": "Début",
"endDate": "Fin",

4
src/pages/app/builder.module.css
View File

@ -10,7 +10,9 @@
}
.center {
@apply relative z-0 h-screen overflow-scroll;
width: calc(100vw / 2);
@apply relative z-0 h-screen overflow-scroll flex flex-col justify-items-center;
}
.right {

1
src/pages/r/view.js
View File

@ -52,6 +52,7 @@ const ResumeViewer = ({ id }) => {
</Helmet>
<div
id="page"
className={styles.page}
style={{ backgroundColor: resume.metadata.colors.background }}
>

3
src/templates/Castform.js
View File

@ -12,7 +12,7 @@ import ProjectsA from './blocks/Projects/ProjectsA';
import ReferencesA from './blocks/References/ReferencesA';
import SkillsA from './blocks/Skills/SkillsA';
import WorkA from './blocks/Work/WorkA';
import BirthDateA from './blocks/BirthDate/BirthDateA'
import BirthDateA from './blocks/BirthDate/BirthDateA';
const Blocks = {
objective: ObjectiveA,
@ -55,7 +55,6 @@ const Castform = ({ data }) => {
return (
<PageContext.Provider value={{ data, heading: HeadingD }}>
<div
id="page"
className="rounded"
style={{
fontFamily: data.metadata.font,

3
src/templates/Celebi.js
View File

@ -14,7 +14,7 @@ import ProjectsA from './blocks/Projects/ProjectsA';
import ReferencesA from './blocks/References/ReferencesA';
import SkillsA from './blocks/Skills/SkillsA';
import WorkA from './blocks/Work/WorkA';
import BirthDateA from './blocks/BirthDate/BirthDateA'
import BirthDateA from './blocks/BirthDate/BirthDateA';
const Blocks = {
objective: ObjectiveA,
@ -86,7 +86,6 @@ const Celebi = ({ data }) => {
return (
<PageContext.Provider value={{ data, heading: HeadingE }}>
<div
id="page"
className="relative rounded"
style={{
fontFamily: data.metadata.font,

19
src/templates/Gengar.js
View File

@ -13,7 +13,7 @@ import ProjectsA from './blocks/Projects/ProjectsA';
import ReferencesB from './blocks/References/ReferencesB';
import SkillsA from './blocks/Skills/SkillsA';
import WorkA from './blocks/Work/WorkA';
import BirthDateC from './blocks/BirthDate/BirthDateC'
import BirthDateC from './blocks/BirthDate/BirthDateC';
const Blocks = {
objective: ObjectiveA,
@ -59,7 +59,6 @@ const Gengar = ({ data }) => {
return (
<PageContext.Provider value={{ data, heading: HeadingC }}>
<div
id="page"
className="rounded"
style={{
fontFamily: data.metadata.font,
@ -80,14 +79,28 @@ const Gengar = ({ data }) => {
<Profile />
</div>
<div className="flex flex-col mt-4 text-xs">
<h6 className="font-bold text-xs uppercase tracking-wide mb-1">
Address
</h6>
<span>{data.profile.address.line1}</span>
<span>{data.profile.address.line2}</span>
<span>
{data.profile.address.city} {data.profile.address.pincode}
</span>
</div>
<hr
className="w-1/4 my-5 opacity-25"
style={{ borderColor: data.metadata.colors.background }}
/>
<div className="grid gap-4">
<BirthDateC />
<h6 className="font-bold text-xs uppercase tracking-wide mb-1">
Contacts
</h6>
<ContactB />
<BirthDateC />
</div>
</div>

3
src/templates/Glalie.js
View File

@ -13,7 +13,7 @@ import ProjectsA from './blocks/Projects/ProjectsA';
import ReferencesA from './blocks/References/ReferencesA';
import SkillsA from './blocks/Skills/SkillsA';
import WorkA from './blocks/Work/WorkA';
import BirthDateA from './blocks/BirthDate/BirthDateA'
import BirthDateA from './blocks/BirthDate/BirthDateA';
const Blocks = {
objective: ObjectiveA,
@ -54,7 +54,6 @@ const Glalie = ({ data }) => {
return (
<PageContext.Provider value={{ data, heading: HeadingB }}>
<div
id="page"
className="rounded"
style={{
fontFamily: data.metadata.font,

3
src/templates/Onyx.js
View File

@ -12,7 +12,7 @@ import ProjectsA from './blocks/Projects/ProjectsA';
import ReferencesA from './blocks/References/ReferencesA';
import SkillsA from './blocks/Skills/SkillsA';
import WorkA from './blocks/Work/WorkA';
import BirthDateB from './blocks/BirthDate/BirthDateB'
import BirthDateB from './blocks/BirthDate/BirthDateB';
const Blocks = {
objective: ObjectiveA,
@ -33,7 +33,6 @@ const Onyx = ({ data }) => {
return (
<PageContext.Provider value={{ data, heading: HeadingA }}>
<div
id="page"
className="p-8 rounded"
style={{
fontFamily: data.metadata.font,

3
src/templates/Pikachu.js
View File

@ -12,7 +12,7 @@ import ProjectsA from './blocks/Projects/ProjectsA';
import ReferencesA from './blocks/References/ReferencesA';
import SkillsA from './blocks/Skills/SkillsA';
import WorkA from './blocks/Work/WorkA';
import BirthDateB from './blocks/BirthDate/BirthDateB'
import BirthDateB from './blocks/BirthDate/BirthDateB';
const Blocks = {
work: WorkA,
@ -32,7 +32,6 @@ const Pikachu = ({ data }) => {
return (
<PageContext.Provider value={{ data, heading: HeadingB }}>
<div
id="page"
className="p-8 rounded"
style={{
fontFamily: data.metadata.font,

12
src/templates/blocks/BirthDate/BirthDateA.js
View File

@ -14,13 +14,19 @@ const BirthDateA = () => {
{t('builder.profile.birthDate')}
</h6>
<div>
<span>{formatDate({ date: data.profile.birthDate, language: data.metadata.language, includeDay: true })}</span>
<span>
{formatDate({
date: data.profile.birthDate,
language: data.metadata.language,
includeDay: true,
})}
</span>
</div>
</div>
);
}
return null;
}
};
export default memo(BirthDateA);
export default memo(BirthDateA);

16
src/templates/blocks/BirthDate/BirthDateB.js
View File

@ -1,12 +1,12 @@
import React, { memo, useContext } from 'react';
import PageContext from '../../../contexts/PageContext';
import { get } from 'lodash';
import PageContext from '../../../contexts/PageContext';
import Icons from '../Icons';
import { formatDate } from '../../../utils';
const BirthDateB = () => {
const { data } = useContext(PageContext);
const Icon = get(Icons, "birthdaycake");
const Icon = get(Icons, 'birthdaycake');
if (data.profile.birthDate) {
return (
@ -16,12 +16,18 @@ const BirthDateB = () => {
className="mr-2"
style={{ color: data.metadata.colors.primary }}
/>
<span className="font-medium break-all">{formatDate({ date: data.profile.birthDate, language: data.metadata.language, includeDay: true })}</span>
<span className="font-medium break-all">
{formatDate({
date: data.profile.birthDate,
language: data.metadata.language,
includeDay: true,
})}
</span>
</div>
);
}
return null;
}
};
export default memo(BirthDateB);
export default memo(BirthDateB);

16
src/templates/blocks/BirthDate/BirthDateC.js
View File

@ -1,12 +1,12 @@
import React, { memo, useContext } from 'react';
import PageContext from '../../../contexts/PageContext';
import { get } from 'lodash';
import PageContext from '../../../contexts/PageContext';
import Icons from '../Icons';
import { formatDate } from '../../../utils';
const BirthDateC = () => {
const { data } = useContext(PageContext);
const Icon = get(Icons, "birthdaycake");
const Icon = get(Icons, 'birthdaycake');
if (data.profile.birthDate) {
return (
@ -16,12 +16,18 @@ const BirthDateC = () => {
className="mr-2"
style={{ color: data.metadata.colors.background }}
/>
<span className="font-medium break-all">{formatDate({ date: data.profile.birthDate, language: data.metadata.language, includeDay: true })}</span>
<span className="font-medium break-all">
{formatDate({
date: data.profile.birthDate,
language: data.metadata.language,
includeDay: true,
})}
</span>
</div>
);
}
return null;
}
};
export default memo(BirthDateC);
export default memo(BirthDateC);

4
src/templates/blocks/Icons.js
View File

@ -9,7 +9,7 @@ import {
FaStackOverflow,
FaBehance,
FaGitlab,
FaBirthdayCake
FaBirthdayCake,
} from 'react-icons/fa';
import { MdPhone, MdEmail } from 'react-icons/md';
@ -26,7 +26,7 @@ const Icons = {
stackoverflow: FaStackOverflow,
behance: FaBehance,
gitlab: FaGitlab,
birthdaycake: FaBirthdayCake
birthdaycake: FaBirthdayCake,
};
export default Icons;

31
src/templates/blocks/Projects/ProjectsA.js
View File

@ -18,22 +18,25 @@ const ProjectItem = ({ item, language }) => {
)}
</div>
{item.date && (
<h6 className="text-xs font-medium text-right">
(
{formatDateRange(
{
startDate: item.date,
endDate: item.endDate,
language,
},
t,
)}
)
</h6>
)}
<h6 className="text-xs font-medium text-right">
(
{formatDateRange(
{
startDate: item.date,
endDate: item.endDate,
language,
},
t,
)}
)
</h6>
)}
</div>
{item.summary && (
<ReactMarkdown className="markdown mt-2 text-sm" source={item.summary} />
<ReactMarkdown
className="markdown mt-2 text-sm"
source={item.summary}
/>
)}
</div>
);

3
src/utils/index.js
View File

@ -21,8 +21,7 @@ export const isFileImage = (file) => {
};
export const formatDate = ({ date, language = 'en', includeDay = false }) => {
const monthYearTemplate = 'MMMM YYYY';
const template = includeDay ? 'DD ' + monthYearTemplate : monthYearTemplate;
const template = includeDay ? 'DD MMMM YYYY' : 'MMMM YYYY';
return dayjs(date).locale(language.substr(0, 2)).format(template);
};