{template === 'onyx' &&
}
{template === 'pikachu' &&
}
{template === 'gengar' &&
}
diff --git a/src/components/builder/center/Artboard.module.css b/src/components/builder/center/Artboard.module.css
index 045ab997..5ad63bf9 100644
--- a/src/components/builder/center/Artboard.module.css
+++ b/src/components/builder/center/Artboard.module.css
@@ -1,22 +1,9 @@
@media screen {
.container {
- width: 210mm;
- height: 297mm;
- zoom: 0.5;
+ width: 794px;
+ min-height: 1122px;
overflow: scroll;
box-shadow: var(--shadow);
@apply my-16 bg-white rounded;
}
}
-
-@media screen and (min-width: 1366px) {
- .container {
- zoom: 0.65;
- }
-}
-
-@media screen and (min-width: 1440px) {
- .container {
- zoom: 0.8;
- }
-}
\ No newline at end of file
diff --git a/src/components/builder/left/LeftSidebar.module.css b/src/components/builder/left/LeftSidebar.module.css
index 65c96f6d..cc4dbcbe 100644
--- a/src/components/builder/left/LeftSidebar.module.css
+++ b/src/components/builder/left/LeftSidebar.module.css
@@ -1,6 +1,5 @@
.container {
z-index: 10;
- box-shadow: var(--left-shadow);
@apply w-full h-screen overflow-scroll p-8;
@apply grid gap-8;
}
\ No newline at end of file
diff --git a/src/components/builder/right/RightSidebar.module.css b/src/components/builder/right/RightSidebar.module.css
index de68bb23..7f0ccf8c 100644
--- a/src/components/builder/right/RightSidebar.module.css
+++ b/src/components/builder/right/RightSidebar.module.css
@@ -1,6 +1,5 @@
.container {
z-index: 10;
- box-shadow: var(--right-shadow);
@apply w-full h-screen overflow-scroll p-8;
@apply grid gap-8;
}
diff --git a/src/components/dashboard/ResumePreview.js b/src/components/dashboard/ResumePreview.js
index e651e140..bb47bb23 100644
--- a/src/components/dashboard/ResumePreview.js
+++ b/src/components/dashboard/ResumePreview.js
@@ -1,16 +1,16 @@
import { Menu, MenuItem } from '@material-ui/core';
import { navigate } from 'gatsby';
-import moment from 'moment';
+import moment from 'moment/min/moment-with-locales';
import React, { useContext, useState } from 'react';
+import { useTranslation } from 'react-i18next';
import { MdMoreHoriz, MdOpenInNew } from 'react-icons/md';
import { toast } from 'react-toastify';
-import { useTranslation } from 'react-i18next';
import DatabaseContext from '../../contexts/DatabaseContext';
import ModalContext from '../../contexts/ModalContext';
import styles from './ResumePreview.module.css';
const ResumePreview = ({ resume }) => {
- const { t } = useTranslation();
+ const { t, i18n } = useTranslation();
const [anchorEl, setAnchorEl] = useState(null);
const { emitter, events } = useContext(ModalContext);
const { duplicateResume, deleteResume } = useContext(DatabaseContext);
@@ -84,7 +84,9 @@ const ResumePreview = ({ resume }) => {
{resume.updatedAt && (
{t('dashboard.lastUpdated', {
- timestamp: moment(resume.updatedAt).fromNow(),
+ timestamp: moment(resume.updatedAt)
+ .locale(i18n.language.substr(0, 2))
+ .fromNow(),
})}
)}
diff --git a/src/i18n/index.js b/src/i18n/index.js
index 0a24620c..721dbded 100644
--- a/src/i18n/index.js
+++ b/src/i18n/index.js
@@ -8,20 +8,24 @@ const languages = [
name: 'English (US)',
},
{
- code: 'kn',
- name: 'Kannada (ಕನ್ನಡ)',
+ code: 'fi',
+ name: 'Finnish (Suomalainen)',
},
{
- code: 'es',
- name: 'Spanish (Español)',
+ code: 'fr',
+ name: 'French (Français)',
+ },
+ {
+ code: 'kn',
+ name: 'Kannada (ಕನ್ನಡ)',
},
{
code: 'ptBr',
name: 'Portuguese (Brazilian)',
},
{
- code: 'fi',
- name: 'Finnish (Suomalainen)',
+ code: 'es',
+ name: 'Spanish (Español)',
},
];
diff --git a/src/i18n/locales/index.js b/src/i18n/locales/index.js
index 9e669fcd..65e3588d 100644
--- a/src/i18n/locales/index.js
+++ b/src/i18n/locales/index.js
@@ -1,13 +1,15 @@
import en from './en.json';
-import kn from './kn.json';
import es from './es.json';
-import ptBr from './pt-br.json';
import fi from './fi.json';
+import fr from './fr.json';
+import kn from './kn.json';
+import ptBr from './pt-br.json';
export default {
en: { translation: en },
- kn: { translation: kn },
es: { translation: es },
- ptBr: { translation: ptBr },
fi: { translation: fi },
+ fr: { translation: fr },
+ kn: { translation: kn },
+ ptBr: { translation: ptBr },
};
diff --git a/src/pages/app/builder.module.css b/src/pages/app/builder.module.css
index c53f47c0..c475f80e 100644
--- a/src/pages/app/builder.module.css
+++ b/src/pages/app/builder.module.css
@@ -1,33 +1,19 @@
.container {
- @apply w-screen h-screen grid grid-cols-10;
+ @apply relative h-screen w-screen overflow-hidden flex items-start justify-center;
}
.left {
- @apply col-span-3;
+ width: calc(100vw / 4);
+ box-shadow: var(--left-shadow);
+ @apply bg-primary-50 absolute top-0 bottom-0 left-0 z-10;
}
.center {
- @apply col-span-4 h-screen overflow-scroll bg-primary-100 grid justify-center items-center;
+ @apply relative z-0 h-screen overflow-scroll;
}
.right {
- @apply col-span-3;
+ width: calc(100vw / 4);
+ box-shadow: var(--right-shadow);
+ @apply bg-primary-50 absolute top-0 bottom-0 right-0 z-10;
}
-
-@media screen and (min-width: 1440px) {
- .container {
- @apply grid-cols-11;
- }
-
- .left {
- @apply col-span-3;
- }
-
- .center {
- @apply col-span-5;
- }
-
- .right {
- @apply col-span-3;
- }
-}
\ No newline at end of file
diff --git a/src/templates/blocks/Awards/AwardsA.js b/src/templates/blocks/Awards/AwardsA.js
index 4ea2c96e..2e54824f 100644
--- a/src/templates/blocks/Awards/AwardsA.js
+++ b/src/templates/blocks/Awards/AwardsA.js
@@ -1,27 +1,34 @@
-import moment from 'moment';
+import moment from 'moment/min/moment-with-locales';
import React, { memo, useContext } from 'react';
+import { useTranslation } from 'react-i18next';
import ReactMarkdown from 'react-markdown';
import PageContext from '../../../contexts/PageContext';
import { safetyCheck } from '../../../utils';
-const AwardItem = (x) => (
-
-
-
-
{x.title}
-
{x.awarder}
+const AwardItem = (x) => {
+ const { i18n } = useTranslation();
+
+ return (
+
+
+
+
{x.title}
+ {x.awarder}
+
+ {x.date && (
+
+ {moment(x.date)
+ .locale(i18n.language.substr(0, 2))
+ .format('MMMM YYYY')}
+
+ )}
- {x.date && (
-
- {moment(x.date).format('MMMM YYYY')}
-
+ {x.summary && (
+
)}
- {x.summary && (
-
- )}
-
-);
+ );
+};
const AwardsA = () => {
const { data, heading: Heading } = useContext(PageContext);
diff --git a/src/templates/blocks/Certifications/CertificationsA.js b/src/templates/blocks/Certifications/CertificationsA.js
index 08d9d2f2..52bcd2d9 100644
--- a/src/templates/blocks/Certifications/CertificationsA.js
+++ b/src/templates/blocks/Certifications/CertificationsA.js
@@ -1,27 +1,34 @@
-import moment from 'moment';
+import moment from 'moment/min/moment-with-locales';
import React, { memo, useContext } from 'react';
+import { useTranslation } from 'react-i18next';
import ReactMarkdown from 'react-markdown';
import PageContext from '../../../contexts/PageContext';
import { safetyCheck } from '../../../utils';
-const CertificationItem = (x) => (
-
-
-
-
{x.title}
-
{x.issuer}
+const CertificationItem = (x) => {
+ const { i18n } = useTranslation();
+
+ return (
+
+
+
+
{x.title}
+ {x.issuer}
+
+ {x.date && (
+
+ {moment(x.date)
+ .locale(i18n.language.substr(0, 2))
+ .format('MMMM YYYY')}
+
+ )}
- {x.date && (
-
- {moment(x.date).format('MMMM YYYY')}
-
+ {x.summary && (
+
)}
- {x.summary && (
-
- )}
-
-);
+ );
+};
const CertificationsA = () => {
const { data, heading: Heading } = useContext(PageContext);
diff --git a/src/templates/blocks/Projects/ProjectsA.js b/src/templates/blocks/Projects/ProjectsA.js
index f8a196a2..b92ff558 100644
--- a/src/templates/blocks/Projects/ProjectsA.js
+++ b/src/templates/blocks/Projects/ProjectsA.js
@@ -1,31 +1,38 @@
-import moment from 'moment';
+import moment from 'moment/min/moment-with-locales';
import React, { memo, useContext } from 'react';
+import { useTranslation } from 'react-i18next';
import ReactMarkdown from 'react-markdown';
import PageContext from '../../../contexts/PageContext';
import { safetyCheck } from '../../../utils';
-const ProjectItem = (x) => (
-
-
-
-
{x.title}
- {x.link && (
-
- {x.link}
-
+const ProjectItem = (x) => {
+ const { i18n } = useTranslation();
+
+ return (
+
+
+
+ {x.date && (
+
+ {moment(x.date)
+ .locale(i18n.language.substr(0, 2))
+ .format('MMMM YYYY')}
+
)}
- {x.date && (
-
- {moment(x.date).format('MMMM YYYY')}
-
+ {x.summary && (
+
)}
- {x.summary && (
-
- )}
-
-);
+ );
+};
const ProjectsA = () => {
const { data, heading: Heading } = useContext(PageContext);
diff --git a/src/utils/index.js b/src/utils/index.js
index 82e6d2e3..963a657c 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -1,5 +1,5 @@
import { get, isEmpty } from 'lodash';
-import moment from 'moment';
+import moment from 'moment/min/moment-with-locales';
import { useTranslation } from 'react-i18next';
export const getModalText = (isEditMode, type) => {
@@ -22,10 +22,19 @@ export const isFileImage = (file) => {
return file && acceptedImageTypes.includes(file.type);
};
-export const formatDateRange = ({ startDate, endDate }) =>
- `${moment(startDate).format('MMMM Y')} — ${
- moment(endDate).isValid() ? moment(endDate).format('MMMM Y') : 'Present'
- }`;
+export const formatDateRange = ({ startDate, endDate }) => {
+ const { i18n } = useTranslation();
+
+ const start = `${moment(startDate)
+ .locale(i18n.language.substr(0, 2))
+ .format('MMMM Y')}`;
+
+ const end = moment(endDate).isValid()
+ ? `${moment(endDate).locale(i18n.language.substr(0, 2)).format('MMMM Y')}`
+ : 'Present';
+
+ return `${start} - ${end}`;
+};
export const getFieldProps = (formik, schema, name) => ({
touched: get(formik, `touched.${name}`, false),