mirror of
https://github.com/AmruthPillai/Reactive-Resume.git
synced 2025-11-13 00:03:27 +10:00
fix(client): 🐛 do not allow private resumes to be viewable or downloadable through the link
This commit is contained in:
Amruth Pillai
@ -1,4 +1,4 @@
|
||||
<img src="/client/public/images/logos/logo.png" alt="Reactive Resume" width="256px" height="256px" />
|
||||
<img src="/client/public/logo/dark.png" alt="Reactive Resume" width="256px" height="256px" />
|
||||
|
||||
# Reactive Resume
|
||||
|
||||
@ -30,6 +30,7 @@ You have complete control over what goes into your resume, how it looks, what co
|
||||
- [Donations](#donations)
|
||||
- [GitHub Sponsor](#github-sponsor)
|
||||
- [PayPal](#paypal)
|
||||
- [GitHub Star History](#github-star-history)
|
||||
- [Infrastructure](#infrastructure)
|
||||
- [Contributors Wall](#contributors-wall)
|
||||
- [License](#license)
|
||||
|
||||
@ -12,6 +12,9 @@
|
||||
"@next/next/no-img-element": "off",
|
||||
"@next/next/no-sync-scripts": "off",
|
||||
|
||||
// React
|
||||
"react/no-unescaped-entities": "off",
|
||||
|
||||
// React Hooks
|
||||
"react-hooks/exhaustive-deps": "off",
|
||||
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
.controller {
|
||||
@apply z-20 flex items-center justify-center shadow-lg;
|
||||
@apply flex rounded-l-full rounded-r-full px-4;
|
||||
@apply bg-neutral-50 dark:bg-neutral-800;
|
||||
@apply bg-zinc-50 dark:bg-zinc-900;
|
||||
@apply opacity-70 transition-opacity duration-200 hover:opacity-100;
|
||||
|
||||
> button {
|
||||
@ -23,6 +23,6 @@
|
||||
}
|
||||
|
||||
> hr {
|
||||
@apply mx-3 h-5 w-0.5 bg-neutral-900/40 dark:bg-neutral-50/20;
|
||||
@apply mx-3 h-5 w-0.5 bg-zinc-900/40 dark:bg-zinc-50/20;
|
||||
}
|
||||
}
|
||||
|
||||
@ -12,7 +12,6 @@ import {
|
||||
ZoomOut,
|
||||
} from '@mui/icons-material';
|
||||
import { ButtonBase, Divider, Tooltip, useMediaQuery, useTheme } from '@mui/material';
|
||||
import clsx from 'clsx';
|
||||
import dayjs from 'dayjs';
|
||||
import get from 'lodash/get';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
@ -26,6 +25,7 @@ import { printResumeAsPdf, PrintResumeAsPdfParams } from '@/services/printer';
|
||||
import { togglePageBreakLine, togglePageOrientation, toggleSidebar } from '@/store/build/buildSlice';
|
||||
import { useAppDispatch, useAppSelector } from '@/store/hooks';
|
||||
import getResumeUrl from '@/utils/getResumeUrl';
|
||||
import { cn } from '@/utils/styles';
|
||||
|
||||
import styles from './ArtboardController.module.scss';
|
||||
|
||||
@ -60,7 +60,7 @@ const ArtboardController: React.FC<ReactZoomPanPinchHandlers> = ({ zoomIn, zoomO
|
||||
const url = getResumeUrl(resume, { withHost: true });
|
||||
await navigator.clipboard.writeText(url);
|
||||
|
||||
toast.success(t<string>('common.toast.success.resume-link-copied'));
|
||||
toast.success(t('common.toast.success.resume-link-copied'));
|
||||
};
|
||||
|
||||
const handleExportPDF = async () => {
|
||||
@ -77,40 +77,40 @@ const ArtboardController: React.FC<ReactZoomPanPinchHandlers> = ({ zoomIn, zoomO
|
||||
|
||||
return (
|
||||
<div
|
||||
className={clsx({
|
||||
className={cn({
|
||||
[styles.container]: true,
|
||||
[styles.pushLeft]: left.open,
|
||||
[styles.pushRight]: right.open,
|
||||
})}
|
||||
>
|
||||
<div className={styles.controller}>
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.undo')}>
|
||||
<ButtonBase onClick={handleUndo} className={clsx({ 'pointer-events-none opacity-50': past.length < 2 })}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.undo')}>
|
||||
<ButtonBase onClick={handleUndo} className={cn({ 'pointer-events-none opacity-50': past.length < 2 })}>
|
||||
<UndoOutlined fontSize="medium" />
|
||||
</ButtonBase>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.redo')}>
|
||||
<ButtonBase onClick={handleRedo} className={clsx({ 'pointer-events-none opacity-50': future.length === 0 })}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.redo')}>
|
||||
<ButtonBase onClick={handleRedo} className={cn({ 'pointer-events-none opacity-50': future.length === 0 })}>
|
||||
<RedoOutlined fontSize="medium" />
|
||||
</ButtonBase>
|
||||
</Tooltip>
|
||||
|
||||
<Divider />
|
||||
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.zoom-in')}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.zoom-in')}>
|
||||
<ButtonBase onClick={() => zoomIn(0.25)}>
|
||||
<ZoomIn fontSize="medium" />
|
||||
</ButtonBase>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.zoom-out')}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.zoom-out')}>
|
||||
<ButtonBase onClick={() => zoomOut(0.25)}>
|
||||
<ZoomOut fontSize="medium" />
|
||||
</ButtonBase>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.center-artboard')}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.center-artboard')}>
|
||||
<ButtonBase onClick={() => centerView(0.95)}>
|
||||
<FilterCenterFocus fontSize="medium" />
|
||||
</ButtonBase>
|
||||
@ -120,10 +120,10 @@ const ArtboardController: React.FC<ReactZoomPanPinchHandlers> = ({ zoomIn, zoomO
|
||||
|
||||
{isDesktop && (
|
||||
<>
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.toggle-orientation')}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.toggle-orientation')}>
|
||||
<ButtonBase
|
||||
onClick={handleTogglePageOrientation}
|
||||
className={clsx({ 'pointer-events-none opacity-50': pages.length === 1 })}
|
||||
className={cn({ 'pointer-events-none opacity-50': pages.length === 1 })}
|
||||
>
|
||||
{orientation === 'vertical' ? (
|
||||
<AlignHorizontalCenter fontSize="medium" />
|
||||
@ -133,13 +133,13 @@ const ArtboardController: React.FC<ReactZoomPanPinchHandlers> = ({ zoomIn, zoomO
|
||||
</ButtonBase>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.toggle-page-break-line')}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.toggle-page-break-line')}>
|
||||
<ButtonBase onClick={handleTogglePageBreakLine}>
|
||||
<InsertPageBreak fontSize="medium" />
|
||||
</ButtonBase>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.toggle-sidebars')}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.toggle-sidebars')}>
|
||||
<ButtonBase onClick={handleToggleSidebar}>
|
||||
<ViewSidebar fontSize="medium" />
|
||||
</ButtonBase>
|
||||
@ -149,13 +149,13 @@ const ArtboardController: React.FC<ReactZoomPanPinchHandlers> = ({ zoomIn, zoomO
|
||||
</>
|
||||
)}
|
||||
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.copy-link')}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.copy-link')}>
|
||||
<ButtonBase onClick={handleCopyLink}>
|
||||
<Link fontSize="medium" />
|
||||
</ButtonBase>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.export-pdf')}>
|
||||
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.export-pdf')}>
|
||||
<ButtonBase onClick={handleExportPDF} disabled={isLoading}>
|
||||
<Download fontSize="medium" />
|
||||
</ButtonBase>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
.center {
|
||||
@apply mx-0 flex flex-grow pt-12 lg:pt-16;
|
||||
@apply transition-[margin-left,margin-right] duration-200;
|
||||
@apply bg-neutral-200 dark:bg-neutral-900;
|
||||
@apply bg-zinc-100 dark:bg-zinc-900;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import clsx from 'clsx';
|
||||
import get from 'lodash/get';
|
||||
import isEmpty from 'lodash/isEmpty';
|
||||
import { TransformComponent, TransformWrapper } from 'react-zoom-pan-pinch';
|
||||
|
||||
import { useAppSelector } from '@/store/hooks';
|
||||
import { cn } from '@/utils/styles';
|
||||
|
||||
import ArtboardController from './ArtboardController';
|
||||
import styles from './Center.module.scss';
|
||||
@ -19,7 +19,7 @@ const Center = () => {
|
||||
if (isEmpty(resume)) return null;
|
||||
|
||||
return (
|
||||
<div className={clsx(styles.center)}>
|
||||
<div className={cn(styles.center)}>
|
||||
<Header />
|
||||
|
||||
<TransformWrapper
|
||||
@ -35,7 +35,7 @@ const Center = () => {
|
||||
<>
|
||||
<TransformComponent wrapperClass={styles.wrapper}>
|
||||
<div
|
||||
className={clsx({
|
||||
className={cn({
|
||||
[styles.artboard]: true,
|
||||
'flex-col': orientation === 'vertical',
|
||||
})}
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
.header {
|
||||
@apply mx-0 flex justify-between shadow;
|
||||
@apply bg-neutral-800 text-neutral-100;
|
||||
@apply bg-zinc-900 text-zinc-100;
|
||||
@apply transition-[margin-left,margin-right] duration-200;
|
||||
|
||||
button > svg {
|
||||
@apply text-base text-neutral-100;
|
||||
@apply text-base text-zinc-100;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -20,7 +20,6 @@ import {
|
||||
useMediaQuery,
|
||||
useTheme,
|
||||
} from '@mui/material';
|
||||
import clsx from 'clsx';
|
||||
import get from 'lodash/get';
|
||||
import { useRouter } from 'next/router';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
@ -37,6 +36,7 @@ import { setSidebarState, toggleSidebar } from '@/store/build/buildSlice';
|
||||
import { useAppDispatch, useAppSelector } from '@/store/hooks';
|
||||
import { setModalState } from '@/store/modal/modalSlice';
|
||||
import getResumeUrl from '@/utils/getResumeUrl';
|
||||
import { cn } from '@/utils/styles';
|
||||
|
||||
import styles from './Header.module.scss';
|
||||
|
||||
@ -102,7 +102,7 @@ const Header = () => {
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
}),
|
||||
);
|
||||
};
|
||||
|
||||
@ -132,14 +132,14 @@ const Header = () => {
|
||||
const url = getResumeUrl(resume, { withHost: true });
|
||||
await navigator.clipboard.writeText(url);
|
||||
|
||||
toast.success(t<string>('common.toast.success.resume-link-copied'));
|
||||
toast.success(t('common.toast.success.resume-link-copied'));
|
||||
};
|
||||
|
||||
return (
|
||||
<AppBar elevation={0} position="fixed">
|
||||
<Toolbar
|
||||
variant="regular"
|
||||
className={clsx({
|
||||
className={cn({
|
||||
[styles.header]: true,
|
||||
[styles.pushLeft]: left.open,
|
||||
[styles.pushRight]: right.open,
|
||||
@ -165,14 +165,14 @@ const Header = () => {
|
||||
<ListItemIcon>
|
||||
<DriveFileRenameOutline className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('builder.header.menu.rename')}</ListItemText>
|
||||
<ListItemText>{t('builder.header.menu.rename')}</ListItemText>
|
||||
</MenuItem>
|
||||
|
||||
<MenuItem onClick={handleDuplicate}>
|
||||
<ListItemIcon>
|
||||
<CopyAll className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('builder.header.menu.duplicate')}</ListItemText>
|
||||
<ListItemText>{t('builder.header.menu.duplicate')}</ListItemText>
|
||||
</MenuItem>
|
||||
|
||||
{resume.public ? (
|
||||
@ -180,27 +180,27 @@ const Header = () => {
|
||||
<ListItemIcon>
|
||||
<LinkIcon className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('builder.header.menu.share-link')}</ListItemText>
|
||||
<ListItemText>{t('builder.header.menu.share-link')}</ListItemText>
|
||||
</MenuItem>
|
||||
) : (
|
||||
<Tooltip arrow placement="right" title={t<string>('builder.header.menu.tooltips.share-link')}>
|
||||
<Tooltip arrow placement="right" title={t('builder.header.menu.tooltips.share-link')}>
|
||||
<div>
|
||||
<MenuItem>
|
||||
<ListItemIcon>
|
||||
<LinkIcon className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('builder.header.menu.share-link')}</ListItemText>
|
||||
<ListItemText>{t('builder.header.menu.share-link')}</ListItemText>
|
||||
</MenuItem>
|
||||
</div>
|
||||
</Tooltip>
|
||||
)}
|
||||
|
||||
<Tooltip arrow placement="right" title={t<string>('builder.header.menu.tooltips.delete')}>
|
||||
<Tooltip arrow placement="right" title={t('builder.header.menu.tooltips.delete')}>
|
||||
<MenuItem onClick={handleDelete}>
|
||||
<ListItemIcon>
|
||||
<Delete className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('builder.header.menu.delete')}</ListItemText>
|
||||
<ListItemText>{t('builder.header.menu.delete')}</ListItemText>
|
||||
</MenuItem>
|
||||
</Tooltip>
|
||||
</Menu>
|
||||
|
||||
@ -18,8 +18,8 @@
|
||||
content: 'Page Break';
|
||||
top: calc(297mm - 19px);
|
||||
|
||||
@apply absolute w-full border-b border-dashed border-neutral-800/75;
|
||||
@apply flex items-end justify-end pr-2 pb-0.5 text-xs font-bold text-neutral-800/75;
|
||||
@apply absolute w-full border-b border-dashed border-zinc-900/75;
|
||||
@apply flex items-end justify-end pr-2 pb-0.5 text-xs font-bold text-zinc-900/75;
|
||||
@apply print:hidden;
|
||||
|
||||
:global(.preview-mode) &,
|
||||
|
||||
@ -49,9 +49,7 @@ const Page: React.FC<Props> = ({ page, showPageNumbers = false }) => {
|
||||
{TemplatePage && <TemplatePage page={page} />}
|
||||
</div>
|
||||
|
||||
{showPageNumbers && (
|
||||
<h4 className={styles.pageNumber}>{`${t<string>('builder.common.glossary.page')} ${page + 1}`}</h4>
|
||||
)}
|
||||
{showPageNumbers && <h4 className={styles.pageNumber}>{`${t('builder.common.glossary.page')} ${page + 1}`}</h4>}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
.container {
|
||||
@apply h-screen w-[95vw] md:w-[70vw] lg:w-[50vw] xl:w-[30vw] 2xl:w-[28vw];
|
||||
@apply bg-neutral-50 text-neutral-900 dark:bg-neutral-900 dark:text-neutral-50;
|
||||
@apply relative flex border-r-2 border-neutral-50/10;
|
||||
@apply bg-zinc-100 text-zinc-900 dark:bg-zinc-900 dark:text-zinc-100;
|
||||
@apply relative flex border-r-2 border-zinc-100/10;
|
||||
|
||||
nav {
|
||||
@apply absolute inset-y-0 left-0;
|
||||
@apply w-14 py-4 md:w-16 md:px-2;
|
||||
@apply bg-neutral-100 shadow dark:bg-neutral-800;
|
||||
@apply bg-zinc-100 shadow dark:bg-zinc-900;
|
||||
@apply flex flex-col items-center justify-between;
|
||||
|
||||
hr {
|
||||
@ -29,7 +29,7 @@
|
||||
> section {
|
||||
@apply grid gap-4;
|
||||
@apply pt-5 pb-7 first:pt-0;
|
||||
@apply border-b border-neutral-900/10 last:border-b-0 dark:border-neutral-50/10;
|
||||
@apply border-b border-zinc-900/10 last:border-b-0 dark:border-zinc-100/10;
|
||||
|
||||
hr {
|
||||
@apply my-2;
|
||||
|
||||
@ -8,7 +8,7 @@ import React, { ReactComponentElement, useMemo } from 'react';
|
||||
import { Section as SectionRecord } from 'schema';
|
||||
import { validate } from 'uuid';
|
||||
|
||||
import Logo from '@/components/shared/Logo';
|
||||
import Icon from '@/components/shared/Icon';
|
||||
import { getCustomSections, getSectionsByType, left } from '@/config/sections';
|
||||
import { setSidebarState } from '@/store/build/buildSlice';
|
||||
import { useAppDispatch, useAppSelector } from '@/store/hooks';
|
||||
@ -69,7 +69,7 @@ const LeftSidebar = () => {
|
||||
sectionsComponents.push(
|
||||
<section key={id} id={id}>
|
||||
{component}
|
||||
</section>
|
||||
</section>,
|
||||
);
|
||||
|
||||
if (addMore) {
|
||||
@ -89,7 +89,7 @@ const LeftSidebar = () => {
|
||||
elements.push(
|
||||
<section key={newId} id={`section-${newId}`}>
|
||||
{newComponent}
|
||||
</section>
|
||||
</section>,
|
||||
);
|
||||
}
|
||||
sectionsComponents.push(...elements);
|
||||
@ -112,7 +112,9 @@ const LeftSidebar = () => {
|
||||
<nav className="overflow-y-auto">
|
||||
<div>
|
||||
<Link href="/dashboard">
|
||||
<Logo size={40} />
|
||||
<IconButton>
|
||||
<Icon size={24} />
|
||||
</IconButton>
|
||||
</Link>
|
||||
<Divider />
|
||||
</div>
|
||||
@ -123,7 +125,7 @@ const LeftSidebar = () => {
|
||||
arrow
|
||||
key={id}
|
||||
placement="right"
|
||||
title={t<string>(`builder.leftSidebar.sections.${id}.heading`, get(sections, `${id}.name`))}
|
||||
title={t(`builder.leftSidebar.sections.${id}.heading`, get(sections, `${id}.name`))}
|
||||
>
|
||||
<IconButton onClick={() => handleClick(id)}>{icon}</IconButton>
|
||||
</Tooltip>
|
||||
@ -132,7 +134,7 @@ const LeftSidebar = () => {
|
||||
{customSections.map(({ id }) => (
|
||||
<Tooltip
|
||||
key={id}
|
||||
title={t<string>(`builder.leftSidebar.sections.${id}.heading`, get(sections, `${id}.name`))}
|
||||
title={t(`builder.leftSidebar.sections.${id}.heading`, get(sections, `${id}.name`))}
|
||||
placement="right"
|
||||
arrow
|
||||
>
|
||||
@ -157,8 +159,8 @@ const LeftSidebar = () => {
|
||||
|
||||
<div className="py-6 text-right">
|
||||
<Button fullWidth variant="outlined" startIcon={<Add />} onClick={handleAddSection}>
|
||||
{t<string>('builder.common.actions.add', {
|
||||
token: t<string>('builder.leftSidebar.sections.section.heading'),
|
||||
{t('builder.common.actions.add', {
|
||||
token: t('builder.leftSidebar.sections.section.heading'),
|
||||
})}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
@ -24,7 +24,7 @@ const Basics = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="sections.basics" name={t<string>('builder.leftSidebar.sections.basics.heading')} />
|
||||
<Heading path="sections.basics" name={t('builder.leftSidebar.sections.basics.heading')} />
|
||||
|
||||
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
|
||||
<div className="grid items-center gap-4 sm:col-span-2 sm:grid-cols-3">
|
||||
@ -33,10 +33,10 @@ const Basics = () => {
|
||||
</div>
|
||||
|
||||
<div className="grid w-full gap-2 sm:col-span-2">
|
||||
<ResumeInput label={t<string>('builder.leftSidebar.sections.basics.name.label')} path="basics.name" />
|
||||
<ResumeInput label={t('builder.leftSidebar.sections.basics.name.label')} path="basics.name" />
|
||||
|
||||
<Button variant="outlined" startIcon={<PhotoFilter />} onClick={handleClick}>
|
||||
{t<string>('builder.leftSidebar.sections.basics.actions.photo-filters')}
|
||||
{t('builder.leftSidebar.sections.basics.actions.photo-filters')}
|
||||
</Button>
|
||||
|
||||
<Popover
|
||||
@ -59,28 +59,24 @@ const Basics = () => {
|
||||
|
||||
<ResumeInput
|
||||
type="date"
|
||||
label={t<string>('builder.leftSidebar.sections.basics.birthdate.label')}
|
||||
label={t('builder.leftSidebar.sections.basics.birthdate.label')}
|
||||
path="basics.birthdate"
|
||||
className="sm:col-span-2"
|
||||
/>
|
||||
<ResumeInput
|
||||
label={t<string>('builder.common.form.email.label')}
|
||||
path="basics.email"
|
||||
className="sm:col-span-2"
|
||||
/>
|
||||
<ResumeInput label={t<string>('builder.common.form.phone.label')} path="basics.phone" />
|
||||
<ResumeInput label={t<string>('builder.common.form.url.label')} path="basics.website" />
|
||||
<ResumeInput label={t('builder.common.form.email.label')} path="basics.email" className="sm:col-span-2" />
|
||||
<ResumeInput label={t('builder.common.form.phone.label')} path="basics.phone" />
|
||||
<ResumeInput label={t('builder.common.form.url.label')} path="basics.website" />
|
||||
|
||||
<Divider className="sm:col-span-2" />
|
||||
|
||||
<ResumeInput
|
||||
label={t<string>('builder.leftSidebar.sections.basics.headline.label')}
|
||||
label={t('builder.leftSidebar.sections.basics.headline.label')}
|
||||
path="basics.headline"
|
||||
className="sm:col-span-2"
|
||||
/>
|
||||
<ResumeInput
|
||||
type="textarea"
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
path="basics.summary"
|
||||
className="sm:col-span-2"
|
||||
markdownSupported
|
||||
|
||||
@ -8,28 +8,19 @@ const Location = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="sections.location" name={t<string>('builder.leftSidebar.sections.location.heading')} />
|
||||
<Heading path="sections.location" name={t('builder.leftSidebar.sections.location.heading')} />
|
||||
|
||||
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
|
||||
<ResumeInput
|
||||
label={t<string>('builder.leftSidebar.sections.location.address.label')}
|
||||
label={t('builder.leftSidebar.sections.location.address.label')}
|
||||
path="basics.location.address"
|
||||
className="sm:col-span-2"
|
||||
/>
|
||||
<ResumeInput label={t('builder.leftSidebar.sections.location.city.label')} path="basics.location.city" />
|
||||
<ResumeInput label={t('builder.leftSidebar.sections.location.region.label')} path="basics.location.region" />
|
||||
<ResumeInput label={t('builder.leftSidebar.sections.location.country.label')} path="basics.location.country" />
|
||||
<ResumeInput
|
||||
label={t<string>('builder.leftSidebar.sections.location.city.label')}
|
||||
path="basics.location.city"
|
||||
/>
|
||||
<ResumeInput
|
||||
label={t<string>('builder.leftSidebar.sections.location.region.label')}
|
||||
path="basics.location.region"
|
||||
/>
|
||||
<ResumeInput
|
||||
label={t<string>('builder.leftSidebar.sections.location.country.label')}
|
||||
path="basics.location.country"
|
||||
/>
|
||||
<ResumeInput
|
||||
label={t<string>('builder.leftSidebar.sections.location.postal-code.label')}
|
||||
label={t('builder.leftSidebar.sections.location.postal-code.label')}
|
||||
path="basics.location.postalCode"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -30,9 +30,9 @@ const PhotoFilters = () => {
|
||||
const handleSetBorder = (value: boolean) => dispatch(setResumeState({ path: 'basics.photo.filters.border', value }));
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-2 p-5 dark:bg-neutral-800">
|
||||
<div className="flex flex-col gap-2 p-5 dark:bg-zinc-900">
|
||||
<div>
|
||||
<h4 className="font-medium">{t<string>('builder.leftSidebar.sections.basics.photo-filters.size.heading')}</h4>
|
||||
<h4 className="font-medium">{t('builder.leftSidebar.sections.basics.photo-filters.size.heading')}</h4>
|
||||
|
||||
<div className="mx-2">
|
||||
<Slider
|
||||
@ -54,20 +54,18 @@ const PhotoFilters = () => {
|
||||
<Divider />
|
||||
|
||||
<div>
|
||||
<h4 className="font-medium">
|
||||
{t<string>('builder.leftSidebar.sections.basics.photo-filters.effects.heading')}
|
||||
</h4>
|
||||
<h4 className="font-medium">{t('builder.leftSidebar.sections.basics.photo-filters.effects.heading')}</h4>
|
||||
|
||||
<div className="flex items-center">
|
||||
<FormControlLabel
|
||||
label={t<string>('builder.leftSidebar.sections.basics.photo-filters.effects.grayscale.label')}
|
||||
label={t('builder.leftSidebar.sections.basics.photo-filters.effects.grayscale.label')}
|
||||
control={
|
||||
<Checkbox color="secondary" checked={grayscale} onChange={(_, value) => handleSetGrayscale(value)} />
|
||||
}
|
||||
/>
|
||||
|
||||
<FormControlLabel
|
||||
label={t<string>('builder.leftSidebar.sections.basics.photo-filters.effects.border.label')}
|
||||
label={t('builder.leftSidebar.sections.basics.photo-filters.effects.border.label')}
|
||||
control={<Checkbox color="secondary" checked={border} onChange={(_, value) => handleSetBorder(value)} />}
|
||||
/>
|
||||
</div>
|
||||
@ -76,7 +74,7 @@ const PhotoFilters = () => {
|
||||
<Divider />
|
||||
|
||||
<div className="flex flex-col gap-2">
|
||||
<h4 className="font-medium">{t<string>('builder.leftSidebar.sections.basics.photo-filters.shape.heading')}</h4>
|
||||
<h4 className="font-medium">{t('builder.leftSidebar.sections.basics.photo-filters.shape.heading')}</h4>
|
||||
|
||||
<ToggleButtonGroup exclusive value={shape} onChange={(_, value) => handleChangeShape(value)}>
|
||||
<ToggleButton size="small" value="square" className="w-14">
|
||||
|
||||
@ -49,7 +49,7 @@ const PhotoUpload: React.FC = () => {
|
||||
const file = event.target.files[0];
|
||||
|
||||
if (file.size > FILE_UPLOAD_MAX_SIZE) {
|
||||
toast.error(t<string>('common.toast.error.upload-photo-size'));
|
||||
toast.error(t('common.toast.error.upload-photo-size'));
|
||||
return;
|
||||
}
|
||||
|
||||
@ -67,8 +67,8 @@ const PhotoUpload: React.FC = () => {
|
||||
<Tooltip
|
||||
title={
|
||||
isEmpty(photo.url)
|
||||
? (t<string>('builder.leftSidebar.sections.basics.photo-upload.tooltip.upload') as string)
|
||||
: (t<string>('builder.leftSidebar.sections.basics.photo-upload.tooltip.remove') as string)
|
||||
? (t('builder.leftSidebar.sections.basics.photo-upload.tooltip.upload') as string)
|
||||
: (t('builder.leftSidebar.sections.basics.photo-upload.tooltip.remove') as string)
|
||||
}
|
||||
>
|
||||
<Avatar sx={{ width: 96, height: 96 }} src={photo.url} />
|
||||
|
||||
@ -28,7 +28,7 @@ const Profiles = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="sections.profiles" name={t<string>('builder.leftSidebar.sections.profiles.heading')} />
|
||||
<Heading path="sections.profiles" name={t('builder.leftSidebar.sections.profiles.heading')} />
|
||||
|
||||
<List
|
||||
path="basics.profiles"
|
||||
@ -40,8 +40,8 @@ const Profiles = () => {
|
||||
|
||||
<footer className="flex justify-end">
|
||||
<Button variant="outlined" startIcon={<Add />} onClick={handleAdd}>
|
||||
{t<string>('builder.common.actions.add', {
|
||||
token: t<string>('builder.leftSidebar.sections.profiles.heading', { count: 1 }),
|
||||
{t('builder.common.actions.add', {
|
||||
token: t('builder.leftSidebar.sections.profiles.heading', { count: 1 }),
|
||||
})}
|
||||
</Button>
|
||||
</footer>
|
||||
|
||||
@ -98,8 +98,8 @@ const Section: React.FC<Props> = ({
|
||||
<SectionSettings path={path} />
|
||||
|
||||
<Button variant="outlined" startIcon={<Add />} onClick={handleAdd}>
|
||||
{t<string>('builder.common.actions.add', {
|
||||
token: t<string>(`builder.leftSidebar.${path}.heading`, { defaultValue: heading }),
|
||||
{t('builder.common.actions.add', {
|
||||
token: t(`builder.leftSidebar.${path}.heading`, { defaultValue: heading }),
|
||||
})}
|
||||
</Button>
|
||||
</footer>
|
||||
@ -107,7 +107,7 @@ const Section: React.FC<Props> = ({
|
||||
{addMore ? (
|
||||
<div className="py-6 text-right">
|
||||
<Button fullWidth variant="outlined" startIcon={<Add />} onClick={handleDuplicateSection}>
|
||||
{t<string>('builder.common.actions.duplicate')}
|
||||
{t('builder.common.actions.duplicate')}
|
||||
</Button>
|
||||
</div>
|
||||
) : (
|
||||
|
||||
@ -32,7 +32,7 @@ const SectionSettings: React.FC<Props> = ({ path }) => {
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Tooltip title={t<string>('builder.common.columns.tooltip')}>
|
||||
<Tooltip title={t('builder.common.columns.tooltip')}>
|
||||
<ButtonBase onClick={handleClick} sx={{ padding: 1, borderRadius: 1 }} className="opacity-50 hover:opacity-75">
|
||||
<ViewWeek /> <span className="ml-1.5 text-xs">{columns}</span>
|
||||
</ButtonBase>
|
||||
@ -47,8 +47,8 @@ const SectionSettings: React.FC<Props> = ({ path }) => {
|
||||
horizontal: 'left',
|
||||
}}
|
||||
>
|
||||
<div className="p-5 dark:bg-neutral-800">
|
||||
<h4 className="mb-2 font-medium">{t<string>('builder.common.columns.heading')}</h4>
|
||||
<div className="p-5 dark:bg-zinc-900">
|
||||
<h4 className="mb-2 font-medium">{t('builder.common.columns.heading')}</h4>
|
||||
|
||||
<ToggleButtonGroup exclusive value={columns} onChange={(_, value: number) => handleSetColumns(value)}>
|
||||
{[1, 2, 3, 4].map((index) => (
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
.container {
|
||||
@apply h-screen w-[95vw] md:w-[70vw] lg:w-[50vw] xl:w-[30vw] 2xl:w-[28vw];
|
||||
@apply bg-neutral-50 text-neutral-900 dark:bg-neutral-900 dark:text-neutral-50;
|
||||
@apply relative flex border-l-2 border-neutral-50/10;
|
||||
@apply bg-zinc-50 text-zinc-900 dark:bg-zinc-900 dark:text-zinc-50;
|
||||
@apply relative flex border-l-2 border-zinc-50/10;
|
||||
|
||||
nav {
|
||||
@apply absolute inset-y-0 right-0;
|
||||
@apply w-12 py-4 md:w-16 md:px-2;
|
||||
@apply bg-neutral-100 shadow dark:bg-neutral-800;
|
||||
@apply bg-zinc-100 shadow dark:bg-zinc-900;
|
||||
@apply flex flex-col items-center justify-between;
|
||||
|
||||
hr {
|
||||
@ -29,7 +29,7 @@
|
||||
> section {
|
||||
@apply grid gap-4;
|
||||
@apply pt-5 pb-7 first:pt-0;
|
||||
@apply border-b border-neutral-900/10 last:border-b-0 dark:border-neutral-50/10;
|
||||
@apply border-b border-zinc-900/10 last:border-b-0 dark:border-zinc-50/10;
|
||||
|
||||
hr {
|
||||
@apply my-2;
|
||||
|
||||
@ -45,7 +45,7 @@ const RightSidebar = () => {
|
||||
<div className={styles.container}>
|
||||
<nav className="overflow-y-auto">
|
||||
<div>
|
||||
<Avatar size={40} />
|
||||
<Avatar size={24} />
|
||||
<Divider />
|
||||
</div>
|
||||
|
||||
@ -55,7 +55,7 @@ const RightSidebar = () => {
|
||||
key={id}
|
||||
arrow
|
||||
placement="right"
|
||||
title={t<string>(`builder.rightSidebar.sections.${id}.heading`, { defaultValue: capitalize(id) })}
|
||||
title={t(`builder.rightSidebar.sections.${id}.heading`, { defaultValue: capitalize(id) })}
|
||||
>
|
||||
<IconButton onClick={() => handleClick(id)}>{icon}</IconButton>
|
||||
</Tooltip>
|
||||
|
||||
@ -18,7 +18,7 @@ const CustomCSS = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const customCSS: CustomCSSType = useAppSelector((state) =>
|
||||
get(state.resume.present, 'metadata.css', {} as CustomCSSType)
|
||||
get(state.resume.present, 'metadata.css', {} as CustomCSSType),
|
||||
);
|
||||
|
||||
const handleChange = (value: string | undefined) => {
|
||||
@ -27,7 +27,7 @@ const CustomCSS = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="metadata.css" name={t<string>('builder.rightSidebar.sections.css.heading')} isHideable />
|
||||
<Heading path="metadata.css" name={t('builder.rightSidebar.sections.css.heading')} isHideable />
|
||||
|
||||
<Editor
|
||||
height="200px"
|
||||
|
||||
@ -20,12 +20,12 @@ const Export = () => {
|
||||
|
||||
const pdfListItemText = {
|
||||
normal: {
|
||||
primary: t<string>('builder.rightSidebar.sections.export.pdf.normal.primary'),
|
||||
secondary: t<string>('builder.rightSidebar.sections.export.pdf.normal.secondary'),
|
||||
primary: t('builder.rightSidebar.sections.export.pdf.normal.primary'),
|
||||
secondary: t('builder.rightSidebar.sections.export.pdf.normal.secondary'),
|
||||
},
|
||||
loading: {
|
||||
primary: t<string>('builder.rightSidebar.sections.export.pdf.loading.primary'),
|
||||
secondary: t<string>('builder.rightSidebar.sections.export.pdf.loading.secondary'),
|
||||
primary: t('builder.rightSidebar.sections.export.pdf.loading.primary'),
|
||||
secondary: t('builder.rightSidebar.sections.export.pdf.loading.secondary'),
|
||||
},
|
||||
};
|
||||
|
||||
@ -55,7 +55,7 @@ const Export = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="metadata.export" name={t<string>('builder.rightSidebar.sections.export.heading')} />
|
||||
<Heading path="metadata.export" name={t('builder.rightSidebar.sections.export.heading')} />
|
||||
|
||||
<List sx={{ padding: 0 }}>
|
||||
<ListItem sx={{ padding: 0 }}>
|
||||
@ -63,8 +63,8 @@ const Export = () => {
|
||||
<Schema />
|
||||
|
||||
<ListItemText
|
||||
primary={t<string>('builder.rightSidebar.sections.export.json.primary')}
|
||||
secondary={t<string>('builder.rightSidebar.sections.export.json.secondary')}
|
||||
primary={t('builder.rightSidebar.sections.export.json.primary')}
|
||||
secondary={t('builder.rightSidebar.sections.export.json.secondary')}
|
||||
/>
|
||||
</ListItemButton>
|
||||
</ListItem>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
.page {
|
||||
@apply relative border pl-4 pb-4 dark:border-neutral-100/10;
|
||||
@apply rounded bg-neutral-100 dark:bg-neutral-800;
|
||||
@apply relative border pl-4 pb-4 dark:border-zinc-100/10;
|
||||
@apply rounded bg-zinc-100 dark:bg-zinc-900;
|
||||
|
||||
.delete {
|
||||
@apply opacity-50 hover:opacity-75;
|
||||
@ -28,14 +28,14 @@
|
||||
|
||||
.base {
|
||||
@apply absolute inset-0 w-4/5;
|
||||
@apply rounded bg-neutral-200 dark:bg-neutral-700;
|
||||
@apply rounded bg-zinc-200 dark:bg-zinc-800;
|
||||
}
|
||||
}
|
||||
|
||||
.section {
|
||||
@apply relative my-3 w-full px-4 py-2;
|
||||
@apply cursor-move break-all rounded text-xs capitalize;
|
||||
@apply bg-neutral-800/90 text-neutral-50 dark:bg-neutral-50/90 dark:text-neutral-800;
|
||||
@apply bg-zinc-900/90 text-zinc-50 dark:bg-zinc-50/90 dark:text-zinc-900;
|
||||
|
||||
&.disabled {
|
||||
@apply opacity-60;
|
||||
|
||||
@ -60,9 +60,9 @@ const Layout = () => {
|
||||
<>
|
||||
<Heading
|
||||
path="metadata.layout"
|
||||
name={t<string>('builder.rightSidebar.sections.layout.heading')}
|
||||
name={t('builder.rightSidebar.sections.layout.heading')}
|
||||
action={
|
||||
<Tooltip title={t<string>('builder.rightSidebar.sections.layout.tooltip.reset-layout')}>
|
||||
<Tooltip title={t('builder.rightSidebar.sections.layout.tooltip.reset-layout')}>
|
||||
<IconButton onClick={handleResetLayout}>
|
||||
<Restore />
|
||||
</IconButton>
|
||||
@ -76,14 +76,14 @@ const Layout = () => {
|
||||
<div key={pageIndex} className={styles.page}>
|
||||
<div className="flex items-center justify-between pr-3">
|
||||
<p className={styles.heading}>
|
||||
{t<string>('builder.common.glossary.page')} {pageIndex + 1}
|
||||
{t('builder.common.glossary.page')} {pageIndex + 1}
|
||||
</p>
|
||||
|
||||
<div className={clsx(styles.delete, { hidden: pageIndex === 0 })}>
|
||||
<Tooltip
|
||||
title={
|
||||
t<string>('builder.common.actions.delete', {
|
||||
token: t<string>('builder.common.glossary.page'),
|
||||
t('builder.common.actions.delete', {
|
||||
token: t('builder.common.glossary.page'),
|
||||
}) as string
|
||||
}
|
||||
>
|
||||
@ -136,7 +136,7 @@ const Layout = () => {
|
||||
|
||||
<div className="flex items-center justify-end">
|
||||
<Button variant="outlined" startIcon={<Add />} onClick={handleAddPage}>
|
||||
{t<string>('builder.common.actions.add', { token: t<string>('builder.common.glossary.page') })}
|
||||
{t('builder.common.actions.add', { token: t('builder.common.glossary.page') })}
|
||||
</Button>
|
||||
</div>
|
||||
</DragDropContext>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
.section {
|
||||
@apply grid gap-2 rounded p-6;
|
||||
@apply bg-neutral-100 dark:bg-neutral-800;
|
||||
@apply bg-zinc-100 dark:bg-zinc-900;
|
||||
|
||||
h2 {
|
||||
@apply inline-flex items-center gap-2 text-base font-medium;
|
||||
|
||||
@ -12,53 +12,51 @@ const Links = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="metadata.links" name={t<string>('builder.rightSidebar.sections.links.heading')} />
|
||||
<Heading path="metadata.links" name={t('builder.rightSidebar.sections.links.heading')} />
|
||||
|
||||
<div className={styles.container}>
|
||||
<div className={styles.section}>
|
||||
<h2>
|
||||
<Savings fontSize="small" />
|
||||
{t<string>('builder.rightSidebar.sections.links.donate.heading')}
|
||||
{t('builder.rightSidebar.sections.links.donate.heading')}
|
||||
</h2>
|
||||
|
||||
<p>{t<string>('builder.rightSidebar.sections.links.donate.body')}</p>
|
||||
<p>{t('builder.rightSidebar.sections.links.donate.body')}</p>
|
||||
|
||||
<a href={DONATION_URL} target="_blank" rel="noreferrer">
|
||||
<Button startIcon={<Coffee />}>{t<string>('builder.rightSidebar.sections.links.donate.button')}</Button>
|
||||
<Button startIcon={<Coffee />}>{t('builder.rightSidebar.sections.links.donate.button')}</Button>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div className={styles.section}>
|
||||
<h2>
|
||||
<BugReport fontSize="small" />
|
||||
{t<string>('builder.rightSidebar.sections.links.bugs-features.heading')}
|
||||
{t('builder.rightSidebar.sections.links.bugs-features.heading')}
|
||||
</h2>
|
||||
|
||||
<p>{t<string>('builder.rightSidebar.sections.links.bugs-features.body')}</p>
|
||||
<p>{t('builder.rightSidebar.sections.links.bugs-features.body')}</p>
|
||||
|
||||
<a href={GITHUB_ISSUES_URL} target="_blank" rel="noreferrer">
|
||||
<Button startIcon={<GitHub />}>
|
||||
{t<string>('builder.rightSidebar.sections.links.bugs-features.button')}
|
||||
</Button>
|
||||
<Button startIcon={<GitHub />}>{t('builder.rightSidebar.sections.links.bugs-features.button')}</Button>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<a href={GITHUB_URL} target="_blank" rel="noreferrer">
|
||||
<Button variant="text" startIcon={<Link />}>
|
||||
{t<string>('builder.rightSidebar.sections.links.github')}
|
||||
{t('builder.rightSidebar.sections.links.github')}
|
||||
</Button>
|
||||
</a>
|
||||
|
||||
<a href={REDDIT_URL} target="_blank" rel="noreferrer">
|
||||
<Button variant="text" startIcon={<Link />}>
|
||||
{t<string>('builder.rightSidebar.sections.links.reddit')}
|
||||
{t('builder.rightSidebar.sections.links.reddit')}
|
||||
</Button>
|
||||
</a>
|
||||
|
||||
<a href={DOCS_URL} target="_blank" rel="noreferrer">
|
||||
<Button variant="text" startIcon={<Link />}>
|
||||
{t<string>('builder.rightSidebar.sections.links.docs')}
|
||||
{t('builder.rightSidebar.sections.links.docs')}
|
||||
</Button>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -55,7 +55,7 @@ const Settings = () => {
|
||||
const themeString = useMemo(() => (isDarkMode ? 'Matte Black Everything' : 'As bright as your future'), [isDarkMode]);
|
||||
|
||||
const { mutateAsync: loadSampleDataMutation } = useMutation<Resume, ServerError, LoadSampleDataParams>(
|
||||
loadSampleData
|
||||
loadSampleData,
|
||||
);
|
||||
const { mutateAsync: resetResumeMutation } = useMutation<Resume, ServerError, ResetResumeParams>(resetResume);
|
||||
|
||||
@ -96,13 +96,13 @@ const Settings = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="metadata.settings" name={t<string>('builder.rightSidebar.sections.settings.heading')} />
|
||||
<Heading path="metadata.settings" name={t('builder.rightSidebar.sections.settings.heading')} />
|
||||
|
||||
<List disablePadding>
|
||||
{/* Global Settings */}
|
||||
<>
|
||||
<ListSubheader disableSticky className="rounded">
|
||||
{t<string>('builder.rightSidebar.sections.settings.global.heading')}
|
||||
{t('builder.rightSidebar.sections.settings.global.heading')}
|
||||
</ListSubheader>
|
||||
|
||||
<ListItem>
|
||||
@ -110,7 +110,7 @@ const Settings = () => {
|
||||
<Palette />
|
||||
</ListItemIcon>
|
||||
<ListItemText
|
||||
primary={t<string>('builder.rightSidebar.sections.settings.global.theme.primary')}
|
||||
primary={t('builder.rightSidebar.sections.settings.global.theme.primary')}
|
||||
secondary={themeString}
|
||||
/>
|
||||
<ThemeSwitch checked={isDarkMode} onChange={(_, value: boolean) => handleSetTheme(value)} />
|
||||
@ -119,8 +119,8 @@ const Settings = () => {
|
||||
<ListItem className="flex-col">
|
||||
<ListItemText
|
||||
className="w-full"
|
||||
primary={t<string>('builder.rightSidebar.sections.settings.global.date.primary')}
|
||||
secondary={t<string>('builder.rightSidebar.sections.settings.global.date.secondary')}
|
||||
primary={t('builder.rightSidebar.sections.settings.global.date.primary')}
|
||||
secondary={t('builder.rightSidebar.sections.settings.global.date.secondary')}
|
||||
/>
|
||||
<Autocomplete<string, false, true, false>
|
||||
disableClearable
|
||||
@ -135,8 +135,8 @@ const Settings = () => {
|
||||
<ListItem className="flex-col">
|
||||
<ListItemText
|
||||
className="w-full"
|
||||
primary={t<string>('builder.rightSidebar.sections.settings.global.language.primary')}
|
||||
secondary={t<string>('builder.rightSidebar.sections.settings.global.language.secondary')}
|
||||
primary={t('builder.rightSidebar.sections.settings.global.language.primary')}
|
||||
secondary={t('builder.rightSidebar.sections.settings.global.language.secondary')}
|
||||
/>
|
||||
<Autocomplete<Language, false, true, false>
|
||||
disableClearable
|
||||
@ -160,14 +160,14 @@ const Settings = () => {
|
||||
{/* Page Settings */}
|
||||
<>
|
||||
<ListSubheader disableSticky className="rounded">
|
||||
{t<string>('builder.rightSidebar.sections.settings.page.heading')}
|
||||
{t('builder.rightSidebar.sections.settings.page.heading')}
|
||||
</ListSubheader>
|
||||
|
||||
<ListItem className="flex-col">
|
||||
<ListItemText
|
||||
className="w-full"
|
||||
primary={t<string>('builder.rightSidebar.sections.settings.page.format.primary')}
|
||||
secondary={t<string>('builder.rightSidebar.sections.settings.page.format.secondary')}
|
||||
primary={t('builder.rightSidebar.sections.settings.page.format.primary')}
|
||||
secondary={t('builder.rightSidebar.sections.settings.page.format.secondary')}
|
||||
/>
|
||||
<Autocomplete<PageConfig['format'], false, true, false>
|
||||
disableClearable
|
||||
@ -182,11 +182,11 @@ const Settings = () => {
|
||||
|
||||
<ListItem>
|
||||
<ListItemText
|
||||
primary={t<string>('builder.rightSidebar.sections.settings.page.orientation.primary')}
|
||||
primary={t('builder.rightSidebar.sections.settings.page.orientation.primary')}
|
||||
secondary={
|
||||
pages.length === 1
|
||||
? t<string>('builder.rightSidebar.sections.settings.page.orientation.disabled')
|
||||
: t<string>('builder.rightSidebar.sections.settings.page.orientation.secondary')
|
||||
? t('builder.rightSidebar.sections.settings.page.orientation.disabled')
|
||||
: t('builder.rightSidebar.sections.settings.page.orientation.secondary')
|
||||
}
|
||||
/>
|
||||
<Switch
|
||||
@ -199,8 +199,8 @@ const Settings = () => {
|
||||
|
||||
<ListItem>
|
||||
<ListItemText
|
||||
primary={t<string>('builder.rightSidebar.sections.settings.page.break-line.primary')}
|
||||
secondary={t<string>('builder.rightSidebar.sections.settings.page.break-line.secondary')}
|
||||
primary={t('builder.rightSidebar.sections.settings.page.break-line.primary')}
|
||||
secondary={t('builder.rightSidebar.sections.settings.page.break-line.secondary')}
|
||||
/>
|
||||
<Switch color="secondary" checked={breakLine} onChange={() => dispatch(togglePageBreakLine())} />
|
||||
</ListItem>
|
||||
@ -209,7 +209,7 @@ const Settings = () => {
|
||||
{/* Resume Settings */}
|
||||
<>
|
||||
<ListSubheader disableSticky className="rounded">
|
||||
{t<string>('builder.rightSidebar.sections.settings.resume.heading')}
|
||||
{t('builder.rightSidebar.sections.settings.resume.heading')}
|
||||
</ListSubheader>
|
||||
|
||||
<ListItem disableGutters>
|
||||
@ -218,8 +218,8 @@ const Settings = () => {
|
||||
<Anchor />
|
||||
</ListItemIcon>
|
||||
<ListItemText
|
||||
primary={t<string>('builder.rightSidebar.sections.settings.resume.sample.primary')}
|
||||
secondary={t<string>('builder.rightSidebar.sections.settings.resume.sample.secondary')}
|
||||
primary={t('builder.rightSidebar.sections.settings.resume.sample.primary')}
|
||||
secondary={t('builder.rightSidebar.sections.settings.resume.sample.secondary')}
|
||||
/>
|
||||
</ListItemButton>
|
||||
</ListItem>
|
||||
@ -231,11 +231,9 @@ const Settings = () => {
|
||||
</ListItemIcon>
|
||||
<ListItemText
|
||||
primary={
|
||||
confirmReset
|
||||
? 'Are you sure?'
|
||||
: t<string>('builder.rightSidebar.sections.settings.resume.reset.primary')
|
||||
confirmReset ? 'Are you sure?' : t('builder.rightSidebar.sections.settings.resume.reset.primary')
|
||||
}
|
||||
secondary={t<string>('builder.rightSidebar.sections.settings.resume.reset.secondary')}
|
||||
secondary={t('builder.rightSidebar.sections.settings.resume.reset.secondary')}
|
||||
/>
|
||||
</ListItemButton>
|
||||
</ListItem>
|
||||
|
||||
@ -29,19 +29,19 @@ const Sharing = () => {
|
||||
|
||||
await navigator.clipboard.writeText(text);
|
||||
|
||||
toast.success(t<string>('common.toast.success.resume-link-copied'));
|
||||
toast.success(t('common.toast.success.resume-link-copied'));
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="metadata.sharing" name={t<string>('builder.rightSidebar.sections.sharing.heading')} />
|
||||
<Heading path="metadata.sharing" name={t('builder.rightSidebar.sections.sharing.heading')} />
|
||||
|
||||
<List sx={{ padding: 0 }}>
|
||||
<ListItem className="flex flex-col" sx={{ padding: 0 }}>
|
||||
<div className="flex w-full items-center justify-between">
|
||||
<ListItemText
|
||||
primary={t<string>('builder.rightSidebar.sections.sharing.visibility.title')}
|
||||
secondary={t<string>('builder.rightSidebar.sections.sharing.visibility.subtitle')}
|
||||
primary={t('builder.rightSidebar.sections.sharing.visibility.title')}
|
||||
secondary={t('builder.rightSidebar.sections.sharing.visibility.subtitle')}
|
||||
/>
|
||||
<Switch color="secondary" checked={isPublic} onChange={(_, value) => handleSetVisibility(value)} />
|
||||
</div>
|
||||
@ -63,7 +63,7 @@ const Sharing = () => {
|
||||
|
||||
<div className="mt-1 flex w-full">
|
||||
<FormControlLabel
|
||||
label={t<string>('builder.rightSidebar.sections.sharing.short-url.label')}
|
||||
label={t('builder.rightSidebar.sections.sharing.short-url.label')}
|
||||
control={
|
||||
<Checkbox className="mr-1" checked={showShortUrl} onChange={(_, value) => setShowShortUrl(value)} />
|
||||
}
|
||||
|
||||
@ -24,7 +24,7 @@ const Templates = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="metadata.templates" name={t<string>('builder.rightSidebar.sections.templates.heading')} />
|
||||
<Heading path="metadata.templates" name={t('builder.rightSidebar.sections.templates.heading')} />
|
||||
|
||||
<div className={styles.container}>
|
||||
{Object.values(templateMap).map((template) => (
|
||||
|
||||
@ -17,7 +17,7 @@ const Theme = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const { background, text, primary } = useAppSelector<ThemeConfig>((state) =>
|
||||
get(state.resume.present, 'metadata.theme')
|
||||
get(state.resume.present, 'metadata.theme'),
|
||||
);
|
||||
|
||||
const handleChange = (property: string, color: string) => {
|
||||
@ -26,7 +26,7 @@ const Theme = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="metadata.theme" name={t<string>('builder.rightSidebar.sections.theme.heading')} />
|
||||
<Heading path="metadata.theme" name={t('builder.rightSidebar.sections.theme.heading')} />
|
||||
|
||||
<div className={styles.container}>
|
||||
<div className={styles.colorOptions}>
|
||||
@ -36,18 +36,18 @@ const Theme = () => {
|
||||
</div>
|
||||
|
||||
<ColorPicker
|
||||
label={t<string>('builder.rightSidebar.sections.theme.form.primary.label')}
|
||||
label={t('builder.rightSidebar.sections.theme.form.primary.label')}
|
||||
color={primary}
|
||||
className="col-span-2"
|
||||
onChange={(color) => handleChange('primary', color)}
|
||||
/>
|
||||
<ColorPicker
|
||||
label={t<string>('builder.rightSidebar.sections.theme.form.background.label')}
|
||||
label={t('builder.rightSidebar.sections.theme.form.background.label')}
|
||||
color={background}
|
||||
onChange={(color) => handleChange('background', color)}
|
||||
/>
|
||||
<ColorPicker
|
||||
label={t<string>('builder.rightSidebar.sections.theme.form.text.label')}
|
||||
label={t('builder.rightSidebar.sections.theme.form.text.label')}
|
||||
color={text}
|
||||
onChange={(color) => handleChange('text', color)}
|
||||
/>
|
||||
|
||||
@ -46,7 +46,7 @@ const Widgets: React.FC<WidgetProps> = ({ label, category }) => {
|
||||
setResumeState({
|
||||
path: `metadata.typography.${property}.${category}`,
|
||||
value: property === 'family' ? (value as Font).family : value,
|
||||
})
|
||||
}),
|
||||
);
|
||||
};
|
||||
|
||||
@ -64,7 +64,7 @@ const Widgets: React.FC<WidgetProps> = ({ label, category }) => {
|
||||
step={1}
|
||||
marks={[
|
||||
{ value: 12, label: '12px' },
|
||||
{ value: 24, label: t<string>('builder.rightSidebar.sections.typography.form.font-size.label') },
|
||||
{ value: 24, label: t('builder.rightSidebar.sections.typography.form.font-size.label') },
|
||||
{ value: 36, label: '36px' },
|
||||
]}
|
||||
valueLabelDisplay="auto"
|
||||
@ -82,10 +82,7 @@ const Widgets: React.FC<WidgetProps> = ({ label, category }) => {
|
||||
value={fonts.find((font) => font.family === family[category])}
|
||||
onChange={(_, font: Font | null) => handleChange('family', font)}
|
||||
renderInput={(params) => (
|
||||
<TextField
|
||||
{...params}
|
||||
label={t<string>('builder.rightSidebar.sections.typography.form.font-family.label')}
|
||||
/>
|
||||
<TextField {...params} label={t('builder.rightSidebar.sections.typography.form.font-family.label')} />
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
@ -98,13 +95,10 @@ const Typography = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading path="metadata.typography" name={t<string>('builder.rightSidebar.sections.typography.heading')} />
|
||||
<Heading path="metadata.typography" name={t('builder.rightSidebar.sections.typography.heading')} />
|
||||
|
||||
<Widgets
|
||||
label={t<string>('builder.rightSidebar.sections.typography.widgets.headings.label')}
|
||||
category="heading"
|
||||
/>
|
||||
<Widgets label={t<string>('builder.rightSidebar.sections.typography.widgets.body.label')} category="body" />
|
||||
<Widgets label={t('builder.rightSidebar.sections.typography.widgets.headings.label')} category="heading" />
|
||||
<Widgets label={t('builder.rightSidebar.sections.typography.widgets.body.label')} category="body" />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
aspect-ratio: 1 / 1.41;
|
||||
|
||||
@apply flex items-center justify-center shadow;
|
||||
@apply cursor-pointer rounded-sm bg-neutral-100 transition-opacity hover:opacity-80 dark:bg-neutral-800;
|
||||
@apply cursor-pointer rounded-sm bg-zinc-100 transition-opacity hover:opacity-80 dark:bg-zinc-900;
|
||||
}
|
||||
|
||||
footer {
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
aspect-ratio: 1 / 1.41;
|
||||
|
||||
@apply relative cursor-pointer rounded-sm shadow;
|
||||
@apply bg-neutral-100 transition-opacity hover:opacity-80 dark:bg-neutral-800;
|
||||
@apply bg-zinc-100 transition-opacity hover:opacity-80 dark:bg-zinc-900;
|
||||
}
|
||||
|
||||
footer {
|
||||
|
||||
@ -76,7 +76,7 @@ const ResumePreview: React.FC<Props> = ({ resume }) => {
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
}),
|
||||
);
|
||||
};
|
||||
|
||||
@ -94,7 +94,7 @@ const ResumePreview: React.FC<Props> = ({ resume }) => {
|
||||
const url = getResumeUrl(resume, { withHost: true });
|
||||
await navigator.clipboard.writeText(url);
|
||||
|
||||
toast.success(t<string>('common.toast.success.resume-link-copied'));
|
||||
toast.success(t('common.toast.success.resume-link-copied'));
|
||||
};
|
||||
|
||||
const handleDelete = async () => {
|
||||
@ -122,7 +122,7 @@ const ResumePreview: React.FC<Props> = ({ resume }) => {
|
||||
<footer>
|
||||
<div className={styles.meta}>
|
||||
<p>{resume.name}</p>
|
||||
<p>{t<string>('dashboard.resume.timestamp', { timestamp: getRelativeTime(resume.updatedAt) })}</p>
|
||||
<p>{t('dashboard.resume.timestamp', { timestamp: getRelativeTime(resume.updatedAt) })}</p>
|
||||
</div>
|
||||
|
||||
<ButtonBase className={styles.menu} onClick={handleOpenMenu}>
|
||||
@ -134,21 +134,21 @@ const ResumePreview: React.FC<Props> = ({ resume }) => {
|
||||
<ListItemIcon>
|
||||
<OpenInNew className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('dashboard.resume.menu.open')}</ListItemText>
|
||||
<ListItemText>{t('dashboard.resume.menu.open')}</ListItemText>
|
||||
</MenuItem>
|
||||
|
||||
<MenuItem onClick={handleRename}>
|
||||
<ListItemIcon>
|
||||
<DriveFileRenameOutline className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('dashboard.resume.menu.rename')}</ListItemText>
|
||||
<ListItemText>{t('dashboard.resume.menu.rename')}</ListItemText>
|
||||
</MenuItem>
|
||||
|
||||
<MenuItem onClick={handleDuplicate}>
|
||||
<ListItemIcon>
|
||||
<ContentCopy className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('dashboard.resume.menu.duplicate')}</ListItemText>
|
||||
<ListItemText>{t('dashboard.resume.menu.duplicate')}</ListItemText>
|
||||
</MenuItem>
|
||||
|
||||
{resume.public ? (
|
||||
@ -156,27 +156,27 @@ const ResumePreview: React.FC<Props> = ({ resume }) => {
|
||||
<ListItemIcon>
|
||||
<LinkIcon className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('dashboard.resume.menu.share-link')}</ListItemText>
|
||||
<ListItemText>{t('dashboard.resume.menu.share-link')}</ListItemText>
|
||||
</MenuItem>
|
||||
) : (
|
||||
<Tooltip arrow placement="right" title={t<string>('dashboard.resume.menu.tooltips.share-link')}>
|
||||
<Tooltip arrow placement="right" title={t('dashboard.resume.menu.tooltips.share-link')}>
|
||||
<div>
|
||||
<MenuItem>
|
||||
<ListItemIcon>
|
||||
<LinkIcon className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('dashboard.resume.menu.share-link')}</ListItemText>
|
||||
<ListItemText>{t('dashboard.resume.menu.share-link')}</ListItemText>
|
||||
</MenuItem>
|
||||
</div>
|
||||
</Tooltip>
|
||||
)}
|
||||
|
||||
<Tooltip arrow placement="right" title={t<string>('dashboard.resume.menu.tooltips.delete')}>
|
||||
<Tooltip arrow placement="right" title={t('dashboard.resume.menu.tooltips.delete')}>
|
||||
<MenuItem onClick={handleDelete}>
|
||||
<ListItemIcon>
|
||||
<DeleteOutline className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('dashboard.resume.menu.delete')}</ListItemText>
|
||||
<ListItemText>{t('dashboard.resume.menu.delete')}</ListItemText>
|
||||
</MenuItem>
|
||||
</Tooltip>
|
||||
</Menu>
|
||||
|
||||
44
client/components/home/Actions.tsx
Normal file
44
client/components/home/Actions.tsx
Normal file
@ -0,0 +1,44 @@
|
||||
import { Button } from '@mui/material';
|
||||
import Link from 'next/link';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
|
||||
import { FLAG_DISABLE_SIGNUPS } from '@/constants/flags';
|
||||
import { logout } from '@/store/auth/authSlice';
|
||||
import { useAppDispatch, useAppSelector } from '@/store/hooks';
|
||||
import { setModalState } from '@/store/modal/modalSlice';
|
||||
|
||||
const HomeActions = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const isLoggedIn = useAppSelector((state) => state.auth.isLoggedIn);
|
||||
|
||||
const handleLogin = () => dispatch(setModalState({ modal: 'auth.login', state: { open: true } }));
|
||||
const handleRegister = () => dispatch(setModalState({ modal: 'auth.register', state: { open: true } }));
|
||||
const handleLogout = () => dispatch(logout());
|
||||
|
||||
return isLoggedIn ? (
|
||||
<>
|
||||
<Link href="/dashboard" passHref>
|
||||
<Button size="large">{t('landing.actions.app')}</Button>
|
||||
</Link>
|
||||
|
||||
<Button size="large" variant="outlined" onClick={handleLogout}>
|
||||
{t('landing.actions.logout')}
|
||||
</Button>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Button size="large" onClick={handleLogin}>
|
||||
{t('landing.actions.login')}
|
||||
</Button>
|
||||
|
||||
<Button size="large" variant="outlined" onClick={handleRegister} disabled={FLAG_DISABLE_SIGNUPS}>
|
||||
{t('landing.actions.register')}
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default HomeActions;
|
||||
16
client/components/home/Background.tsx
Normal file
16
client/components/home/Background.tsx
Normal file
@ -0,0 +1,16 @@
|
||||
const HeroBackground = () => (
|
||||
<div
|
||||
aria-hidden="true"
|
||||
className="absolute left-[calc(50%-4rem)] top-10 -z-10 transform-gpu blur-3xl sm:left-[calc(50%-18rem)] lg:left-48 lg:top-[calc(50%-30rem)] xl:left-[calc(50%-24rem)]"
|
||||
>
|
||||
<div
|
||||
className="aspect-[1108/632] h-96 w-[69.25rem] bg-gradient-to-r from-[#6f8cbb] to-[#c93b37] opacity-40 dark:opacity-20"
|
||||
style={{
|
||||
clipPath:
|
||||
'polygon(73.6% 51.7%, 91.7% 11.8%, 100% 46.4%, 97.4% 82.2%, 92.5% 84.9%, 75.7% 64%, 55.3% 47.5%, 46.5% 49.4%, 45% 62.9%, 50.3% 87.2%, 21.3% 64.1%, 0.1% 100%, 5.4% 51.1%, 21.4% 63.9%, 58.9% 0.2%, 73.6% 51.7%)',
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
export default HeroBackground;
|
||||
47
client/components/home/Footer.tsx
Normal file
47
client/components/home/Footer.tsx
Normal file
@ -0,0 +1,47 @@
|
||||
import GitHubButton from 'react-github-btn';
|
||||
|
||||
import { useAppSelector } from '@/store/hooks';
|
||||
|
||||
import { Copyright } from '../shared/Copyright';
|
||||
import Logo from '../shared/Logo';
|
||||
import { Separator } from '../ui/Separator';
|
||||
|
||||
const Footer = () => {
|
||||
const theme = useAppSelector((state) => state.build.theme);
|
||||
|
||||
return (
|
||||
<footer className="fixed inset-x-0 bottom-0 -z-50 h-[450px] bg-zinc-50 dark:bg-zinc-950">
|
||||
<Separator />
|
||||
|
||||
<div className="container grid py-12 sm:grid-cols-3 lg:grid-cols-4">
|
||||
<div className="flex flex-col gap-y-2">
|
||||
<Logo size={96} className="-ml-2" />
|
||||
|
||||
<h2 className="text-xl font-medium">Reactive Resume</h2>
|
||||
|
||||
<p className="prose prose-sm prose-zinc leading-relaxed opacity-60 dark:prose-invert">
|
||||
A free and open-source resume builder that simplifies the tasks of creating, updating, and sharing your
|
||||
resume.
|
||||
</p>
|
||||
|
||||
<div className="mt-6">
|
||||
<GitHubButton
|
||||
data-size="large"
|
||||
data-show-count="true"
|
||||
data-icon="octicon-star"
|
||||
data-color-scheme={theme ? 'dark' : 'light'}
|
||||
href="https://github.com/AmruthPillai/Reactive-Resume"
|
||||
aria-label="Star AmruthPillai/Reactive-Resume on GitHub"
|
||||
>
|
||||
Star
|
||||
</GitHubButton>
|
||||
</div>
|
||||
|
||||
<Copyright className="mt-4" />
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
};
|
||||
|
||||
export default Footer;
|
||||
24
client/components/home/Header.tsx
Normal file
24
client/components/home/Header.tsx
Normal file
@ -0,0 +1,24 @@
|
||||
import Link from 'next/link';
|
||||
|
||||
import Logo from '../shared/Logo';
|
||||
import HomeActions from './Actions';
|
||||
|
||||
const Header = () => (
|
||||
<header className="fixed inset-x-0 top-0 z-50">
|
||||
<nav className="bg-gradient-to-b from-zinc-50 to-transparent py-3 dark:from-zinc-950">
|
||||
<div className="container flex items-center justify-between">
|
||||
<div className="lg:flex-1">
|
||||
<Link href="/">
|
||||
<Logo size={48} />
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="space-x-4">
|
||||
<HomeActions />
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
);
|
||||
|
||||
export default Header;
|
||||
0
client/components/home/Hero.tsx
Normal file
0
client/components/home/Hero.tsx
Normal file
28
client/components/home/Pattern.tsx
Normal file
28
client/components/home/Pattern.tsx
Normal file
@ -0,0 +1,28 @@
|
||||
const HeroPattern = () => (
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
className="absolute inset-0 -z-10 h-full w-full stroke-zinc-950/10 opacity-60 [mask-image:radial-gradient(100%_100%_at_top_right,white,transparent)] dark:stroke-zinc-50/10 dark:opacity-40"
|
||||
>
|
||||
<defs>
|
||||
<pattern
|
||||
id="983e3e4c-de6d-4c3f-8d64-b9761d1534cc"
|
||||
width={200}
|
||||
height={200}
|
||||
x="50%"
|
||||
y={-1}
|
||||
patternUnits="userSpaceOnUse"
|
||||
>
|
||||
<path d="M.5 200V.5H200" fill="none" />
|
||||
</pattern>
|
||||
</defs>
|
||||
<svg x="50%" y={-1} className="overflow-visible fill-zinc-100/20 dark:fill-zinc-900/20">
|
||||
<path
|
||||
d="M-200 0h201v201h-201Z M600 0h201v201h-201Z M-400 600h201v201h-201Z M200 800h201v201h-201Z"
|
||||
strokeWidth={0}
|
||||
/>
|
||||
</svg>
|
||||
<rect width="100%" height="100%" strokeWidth={0} fill="url(#983e3e4c-de6d-4c3f-8d64-b9761d1534cc)" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
export default HeroPattern;
|
||||
@ -1,6 +1,6 @@
|
||||
.testimony {
|
||||
@apply grid gap-2;
|
||||
@apply rounded border-2 p-4 dark:border-neutral-800;
|
||||
@apply rounded border-2 p-4 dark:border-zinc-900;
|
||||
|
||||
blockquote {
|
||||
@apply text-justify text-xs leading-normal opacity-90;
|
||||
51
client/components/home/sections/Logo.tsx
Normal file
51
client/components/home/sections/Logo.tsx
Normal file
@ -0,0 +1,51 @@
|
||||
import { cn } from '@/utils/styles';
|
||||
|
||||
type LogoProps = { brand: string };
|
||||
|
||||
const Logo = ({ brand }: LogoProps) => (
|
||||
<div className={cn('col-span-2 col-start-2 sm:col-start-auto lg:col-span-1', brand === 'twilio' && 'sm:col-start-2')}>
|
||||
{/* Show on Light Theme */}
|
||||
<img
|
||||
className="block max-h-12 object-contain dark:hidden"
|
||||
src={`/images/brand-logos/dark/${brand}.svg`}
|
||||
alt={brand}
|
||||
width={212}
|
||||
height={48}
|
||||
/>
|
||||
{/* Show on Dark Theme */}
|
||||
<img
|
||||
className="hidden max-h-12 object-contain dark:block"
|
||||
src={`/images/brand-logos/light/${brand}.svg`}
|
||||
alt={brand}
|
||||
width={212}
|
||||
height={48}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
const logoList: string[] = ['amazon', 'google', 'postman', 'twilio', 'zalando'];
|
||||
|
||||
const LogoSection = () => (
|
||||
<section className="relative py-24 sm:py-32">
|
||||
<div className="mx-auto max-w-7xl px-6 lg:px-8">
|
||||
<p className="text-center text-lg leading-relaxed">
|
||||
Reactive Resume has helped people land jobs at these great companies:
|
||||
</p>
|
||||
<div className="mx-auto mt-10 grid max-w-lg grid-cols-4 items-center gap-x-8 gap-y-10 sm:max-w-xl sm:grid-cols-6 sm:gap-x-10 lg:mx-0 lg:max-w-none lg:grid-cols-5">
|
||||
{logoList.map((brand) => (
|
||||
<Logo key={brand} brand={brand} />
|
||||
))}
|
||||
</div>
|
||||
|
||||
<p className="mx-auto mt-8 max-w-sm text-center leading-relaxed">
|
||||
If this app has helped you with your job hunt, let me know by reaching out through{' '}
|
||||
<a href="https://www.amruthpillai.com/#contact" target="_blank" rel="noreferrer" className="hover:underline">
|
||||
this contact form
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
export default LogoSection;
|
||||
27
client/components/home/sections/Stats.tsx
Normal file
27
client/components/home/sections/Stats.tsx
Normal file
@ -0,0 +1,27 @@
|
||||
type Statistic = {
|
||||
name: string;
|
||||
value: string;
|
||||
};
|
||||
|
||||
const stats: Statistic[] = [
|
||||
{ name: 'GitHub Stars', value: '11,800+' },
|
||||
{ name: 'Users Signed Up', value: '300,000+' },
|
||||
{ name: 'Resumes Generated', value: '400,000+' },
|
||||
];
|
||||
|
||||
const StatsSection = () => (
|
||||
<section className="relative py-24 sm:py-32">
|
||||
<div className="mx-auto max-w-7xl px-6 lg:px-8">
|
||||
<dl className="grid grid-cols-1 gap-x-8 gap-y-16 text-center lg:grid-cols-3">
|
||||
{stats.map((stat, index) => (
|
||||
<div key={index} className="mx-auto flex max-w-xs flex-col gap-y-4">
|
||||
<dt className="text-base leading-7 opacity-60">{stat.name}</dt>
|
||||
<dd className="order-first text-3xl font-semibold tracking-tight sm:text-5xl">{stat.value}</dd>
|
||||
</div>
|
||||
))}
|
||||
</dl>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
export default StatsSection;
|
||||
@ -63,12 +63,12 @@ const Avatar: React.FC<Props> = ({ size = 64, interactive = true }) => {
|
||||
<Menu anchorEl={anchorEl} onClose={handleClose} open={Boolean(anchorEl)}>
|
||||
<MenuItem onClick={handleOpenProfile}>
|
||||
<div>
|
||||
<span className="text-xs opacity-50">{t<string>('common.avatar.menu.greeting')},</span>
|
||||
<span className="text-xs opacity-50">{t('common.avatar.menu.greeting')},</span>
|
||||
<p>{user?.name}</p>
|
||||
</div>
|
||||
</MenuItem>
|
||||
<Divider />
|
||||
<MenuItem onClick={handleLogout}>{t<string>('common.avatar.menu.logout')}</MenuItem>
|
||||
<MenuItem onClick={handleLogout}>{t('common.avatar.menu.logout')}</MenuItem>
|
||||
</Menu>
|
||||
</>
|
||||
);
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
.content {
|
||||
@apply rounded px-6 text-sm shadow lg:w-1/2 xl:w-2/5;
|
||||
@apply absolute inset-4 sm:inset-x-4 sm:inset-y-auto lg:inset-auto;
|
||||
@apply overflow-scroll bg-neutral-50 dark:bg-neutral-900 lg:overflow-auto;
|
||||
@apply overflow-scroll bg-zinc-100 dark:bg-zinc-900 lg:overflow-auto;
|
||||
@apply max-h-[90vh] min-h-fit;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
@ -10,7 +10,7 @@
|
||||
}
|
||||
|
||||
.header {
|
||||
@apply sticky top-0 left-0 right-0 z-50 bg-neutral-50 pt-6 dark:bg-neutral-900;
|
||||
@apply sticky top-0 left-0 right-0 z-50 bg-zinc-100 pt-6 dark:bg-zinc-900;
|
||||
@apply flex items-center justify-between;
|
||||
@apply w-full border-b pb-5 dark:border-white/10;
|
||||
|
||||
@ -33,7 +33,7 @@
|
||||
}
|
||||
|
||||
.footer {
|
||||
@apply sticky bottom-0 left-0 right-0 z-50 bg-neutral-50 pb-6 dark:bg-neutral-900;
|
||||
@apply sticky bottom-0 left-0 right-0 z-50 bg-zinc-100 pb-6 dark:bg-zinc-900;
|
||||
@apply flex items-center justify-end gap-x-4;
|
||||
@apply w-full border-t pt-5 dark:border-white/10;
|
||||
}
|
||||
|
||||
19
client/components/shared/Copyright.tsx
Normal file
19
client/components/shared/Copyright.tsx
Normal file
@ -0,0 +1,19 @@
|
||||
import clsx from 'clsx';
|
||||
|
||||
type Props = {
|
||||
className?: string;
|
||||
};
|
||||
|
||||
export const Copyright = ({ className }: Props) => (
|
||||
<div
|
||||
className={clsx('prose prose-sm prose-zinc flex flex-col gap-y-1 text-xs opacity-40 dark:prose-invert', className)}
|
||||
>
|
||||
<span className="font-medium">v4.0.0</span>
|
||||
<span>
|
||||
Licensed under <a href="https://github.com/AmruthPillai/Reactive-Resume/blob/main/LICENSE">MIT</a>
|
||||
</span>
|
||||
<span>
|
||||
A passion project by <a href="https://www.amruthpillai.com/">Amruth Pillai</a>
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
@ -10,7 +10,7 @@ const Footer: React.FC<Props> = ({ className }) => {
|
||||
|
||||
return (
|
||||
<div className={clsx('text-xs', className)}>
|
||||
<p>{t<string>('common.footer.license')}</p>
|
||||
<p>{t('common.footer.license')}</p>
|
||||
|
||||
<p>
|
||||
<Trans t={t} i18nKey="common.footer.credit">
|
||||
|
||||
@ -62,7 +62,7 @@ const Heading: React.FC<Props> = ({
|
||||
{editMode ? (
|
||||
<TextField size="small" value={heading} className="w-3/4" onChange={handleChange} />
|
||||
) : (
|
||||
<h1>{t<string>(`builder.leftSidebar.${path}.heading`, { defaultValue: heading })}</h1>
|
||||
<h1>{t(`builder.leftSidebar.${path}.heading`, { defaultValue: heading })}</h1>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@ -72,19 +72,19 @@ const Heading: React.FC<Props> = ({
|
||||
})}
|
||||
>
|
||||
{isEditable && (
|
||||
<Tooltip title={t<string>('builder.common.tooltip.rename-section')}>
|
||||
<Tooltip title={t('builder.common.tooltip.rename-section')}>
|
||||
<IconButton onClick={toggleEditMode}>{editMode ? <Check /> : <DriveFileRenameOutline />}</IconButton>
|
||||
</Tooltip>
|
||||
)}
|
||||
|
||||
{isHideable && (
|
||||
<Tooltip title={t<string>('builder.common.tooltip.toggle-visibility')}>
|
||||
<Tooltip title={t('builder.common.tooltip.toggle-visibility')}>
|
||||
<IconButton onClick={toggleVisibility}>{visibility ? <Visibility /> : <VisibilityOff />}</IconButton>
|
||||
</Tooltip>
|
||||
)}
|
||||
|
||||
{isDeletable && (
|
||||
<Tooltip title={t<string>('builder.common.tooltip.delete-section')}>
|
||||
<Tooltip title={t('builder.common.tooltip.delete-section')}>
|
||||
<IconButton onClick={handleDelete}>
|
||||
<Delete />
|
||||
</IconButton>
|
||||
|
||||
27
client/components/shared/Icon.tsx
Normal file
27
client/components/shared/Icon.tsx
Normal file
@ -0,0 +1,27 @@
|
||||
import clsx from 'clsx';
|
||||
import Image from 'next/image';
|
||||
|
||||
import { useAppSelector } from '@/store/hooks';
|
||||
|
||||
type Props = {
|
||||
className?: string;
|
||||
size?: 256 | 96 | 64 | 48 | 40 | 32 | 24 | 16;
|
||||
};
|
||||
|
||||
const Icon: React.FC<Props> = ({ size = 64, className }) => {
|
||||
const theme = useAppSelector((state) => state.build.theme);
|
||||
const iconTheme = theme === 'light' ? 'dark' : 'light';
|
||||
|
||||
return (
|
||||
<Image
|
||||
alt="Reactive Resume"
|
||||
src={`/icon/${iconTheme}.svg`}
|
||||
className={clsx('rounded', className)}
|
||||
width={size}
|
||||
height={size}
|
||||
priority
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default Icon;
|
||||
@ -1,5 +1,5 @@
|
||||
.container {
|
||||
@apply rounded-lg border dark:border-neutral-50/10;
|
||||
@apply rounded-lg border dark:border-zinc-50/10;
|
||||
|
||||
.empty {
|
||||
@apply py-8 text-center;
|
||||
|
||||
@ -60,13 +60,13 @@ const List: React.FC<Props> = ({
|
||||
|
||||
dispatch(setResumeState({ path, value: newList }));
|
||||
},
|
||||
[list, dispatch, path]
|
||||
[list, dispatch, path],
|
||||
);
|
||||
|
||||
return (
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<div className={clsx(styles.container, className)}>
|
||||
{isEmpty(list) && <div className={styles.empty}>{t<string>('builder.common.list.empty-text')}</div>}
|
||||
{isEmpty(list) && <div className={styles.empty}>{t('builder.common.list.empty-text')}</div>}
|
||||
|
||||
{list.map((item, index) => {
|
||||
const title = get(item, titleKey, '');
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
.item {
|
||||
@apply flex items-center justify-between;
|
||||
@apply py-5 pl-5 pr-2;
|
||||
@apply border-b border-neutral-900/10 last:border-0 dark:border-neutral-50/10;
|
||||
@apply border-b border-zinc-900/10 last:border-0 dark:border-zinc-50/10;
|
||||
@apply cursor-move transition-opacity;
|
||||
|
||||
.meta {
|
||||
|
||||
@ -126,25 +126,25 @@ const ListItem: React.FC<Props> = ({ item, path, index, title, subtitle, onMove,
|
||||
<ListItemIcon>
|
||||
<DriveFileRenameOutline className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('builder.common.list.actions.edit')}</ListItemText>
|
||||
<ListItemText>{t('builder.common.list.actions.edit')}</ListItemText>
|
||||
</MenuItem>
|
||||
|
||||
<MenuItem onClick={() => handleDuplicate(item)}>
|
||||
<ListItemIcon>
|
||||
<FileCopy className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('builder.common.list.actions.duplicate')}</ListItemText>
|
||||
<ListItemText>{t('builder.common.list.actions.duplicate')}</ListItemText>
|
||||
</MenuItem>
|
||||
|
||||
<Divider />
|
||||
|
||||
<Tooltip arrow placement="right" title={t<string>('builder.common.tooltip.delete-item')}>
|
||||
<Tooltip arrow placement="right" title={t('builder.common.tooltip.delete-item')}>
|
||||
<div>
|
||||
<MenuItem onClick={() => handleDelete(item)}>
|
||||
<ListItemIcon>
|
||||
<DeleteOutline className="scale-90" />
|
||||
</ListItemIcon>
|
||||
<ListItemText>{t<string>('builder.common.list.actions.delete')}</ListItemText>
|
||||
<ListItemText>{t('builder.common.list.actions.delete')}</ListItemText>
|
||||
</MenuItem>
|
||||
</div>
|
||||
</Tooltip>
|
||||
|
||||
@ -1,11 +1,26 @@
|
||||
import clsx from 'clsx';
|
||||
import Image from 'next/image';
|
||||
|
||||
import { useAppSelector } from '@/store/hooks';
|
||||
|
||||
type Props = {
|
||||
size?: 256 | 64 | 48 | 40 | 32;
|
||||
className?: string;
|
||||
size?: 256 | 96 | 64 | 48 | 40 | 32 | 24 | 16;
|
||||
};
|
||||
|
||||
const Logo: React.FC<Props> = ({ size = 64 }) => (
|
||||
<Image alt="Reactive Resume" src="/images/logos/logo.svg" className="rounded" width={size} height={size} priority />
|
||||
const Logo: React.FC<Props> = ({ size = 64, className }) => {
|
||||
const theme = useAppSelector((state) => state.build.theme);
|
||||
|
||||
return (
|
||||
<Image
|
||||
alt="Reactive Resume"
|
||||
src={`/logo/${theme}.svg`}
|
||||
className={clsx('rounded', className)}
|
||||
width={size}
|
||||
height={size}
|
||||
priority
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default Logo;
|
||||
|
||||
25
client/components/ui/Separator.tsx
Normal file
25
client/components/ui/Separator.tsx
Normal file
@ -0,0 +1,25 @@
|
||||
import * as SeparatorPrimitive from '@radix-ui/react-separator';
|
||||
import * as React from 'react';
|
||||
|
||||
import { cn } from '@/utils/styles';
|
||||
|
||||
const Separator = React.forwardRef<
|
||||
React.ElementRef<typeof SeparatorPrimitive.Root>,
|
||||
React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
|
||||
>(({ className, orientation = 'horizontal', decorative = true, ...props }, ref) => (
|
||||
<SeparatorPrimitive.Root
|
||||
ref={ref}
|
||||
decorative={decorative}
|
||||
orientation={orientation}
|
||||
className={cn(
|
||||
'shrink-0 dark:bg-zinc-900 bg-zinc-100',
|
||||
orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
|
||||
Separator.displayName = SeparatorPrimitive.Root.displayName;
|
||||
|
||||
export { Separator };
|
||||
@ -1,9 +1,10 @@
|
||||
import { createTheme, ThemeOptions } from '@mui/material/styles';
|
||||
import colors from 'tailwindcss/colors';
|
||||
|
||||
const theme: ThemeOptions = {
|
||||
typography: {
|
||||
fontSize: 12,
|
||||
fontFamily: 'Inter, sans-serif',
|
||||
fontFamily: '"IBM Plex Sans", sans-serif',
|
||||
},
|
||||
components: {
|
||||
MuiButton: {
|
||||
@ -48,6 +49,15 @@ const theme: ThemeOptions = {
|
||||
},
|
||||
},
|
||||
},
|
||||
MuiModal: {
|
||||
defaultProps: {
|
||||
componentsProps: {
|
||||
backdrop: {
|
||||
className: 'backdrop-blur-sm',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@ -55,8 +65,9 @@ export const lightTheme = createTheme({
|
||||
...theme,
|
||||
palette: {
|
||||
mode: 'light',
|
||||
primary: { main: '#404040' }, // neutral[700]
|
||||
secondary: { main: '#0d9488' }, // teal[600]
|
||||
background: { default: colors.zinc[50], paper: colors.zinc[100] },
|
||||
primary: { main: colors.zinc[900], ...colors.zinc },
|
||||
secondary: { main: colors.teal[500], ...colors.teal },
|
||||
},
|
||||
});
|
||||
|
||||
@ -64,7 +75,8 @@ export const darkTheme = createTheme({
|
||||
...theme,
|
||||
palette: {
|
||||
mode: 'dark',
|
||||
primary: { main: '#f5f5f5' }, // neutral[100]
|
||||
secondary: { main: '#2dd4bf' }, // teal[400]
|
||||
background: { default: colors.zinc[950], paper: colors.zinc[900] },
|
||||
primary: { main: colors.zinc[100], ...colors.zinc },
|
||||
secondary: { main: colors.teal[600], ...colors.teal },
|
||||
},
|
||||
});
|
||||
|
||||
11
client/constants/tilt.ts
Normal file
11
client/constants/tilt.ts
Normal file
@ -0,0 +1,11 @@
|
||||
import { ReactParallaxTiltProps } from 'react-parallax-tilt';
|
||||
|
||||
export const defaultTiltProps: ReactParallaxTiltProps = {
|
||||
scale: 1.05,
|
||||
tiltMaxAngleX: 8,
|
||||
tiltMaxAngleY: 8,
|
||||
perspective: 1400,
|
||||
glareEnable: true,
|
||||
glareMaxOpacity: 0.1,
|
||||
glareColor: '#fafafa',
|
||||
};
|
||||
@ -54,16 +54,16 @@ const ForgotPasswordModal: React.FC = () => {
|
||||
<BaseModal
|
||||
icon={<Password />}
|
||||
isOpen={isOpen}
|
||||
heading={t<string>('modals.auth.forgot-password.heading')}
|
||||
heading={t('modals.auth.forgot-password.heading')}
|
||||
handleClose={handleClose}
|
||||
footerChildren={
|
||||
<Button type="submit" disabled={isLoading} onClick={handleSubmit(onSubmit)}>
|
||||
{t<string>('modals.auth.forgot-password.actions.send-email')}
|
||||
{t('modals.auth.forgot-password.actions.send-email')}
|
||||
</Button>
|
||||
}
|
||||
>
|
||||
<div className="grid gap-4">
|
||||
<p>{t<string>('modals.auth.forgot-password.body')}</p>
|
||||
<p>{t('modals.auth.forgot-password.body')}</p>
|
||||
|
||||
<form className="grid gap-4 xl:w-2/3">
|
||||
<Controller
|
||||
@ -72,7 +72,7 @@ const ForgotPasswordModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
autoFocus
|
||||
label={t<string>('modals.auth.forgot-password.form.email.label')}
|
||||
label={t('modals.auth.forgot-password.form.email.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -81,7 +81,7 @@ const ForgotPasswordModal: React.FC = () => {
|
||||
/>
|
||||
</form>
|
||||
|
||||
<p className="text-xs">{t<string>('modals.auth.forgot-password.help-text')}</p>
|
||||
<p className="text-xs">{t('modals.auth.forgot-password.help-text')}</p>
|
||||
</div>
|
||||
</BaseModal>
|
||||
</>
|
||||
|
||||
@ -53,7 +53,7 @@ const LoginModal: React.FC = () => {
|
||||
const { mutateAsync: loginMutation } = useMutation<void, ServerError, LoginParams>(login);
|
||||
|
||||
const { mutateAsync: loginWithGoogleMutation } = useMutation<void, ServerError, LoginWithGoogleParams>(
|
||||
loginWithGoogle
|
||||
loginWithGoogle,
|
||||
);
|
||||
|
||||
const handleClose = () => {
|
||||
@ -105,7 +105,7 @@ const LoginModal: React.FC = () => {
|
||||
<BaseModal
|
||||
icon={<Login />}
|
||||
isOpen={isOpen}
|
||||
heading={t<string>('modals.auth.login.heading')}
|
||||
heading={t('modals.auth.login.heading')}
|
||||
handleClose={handleClose}
|
||||
footerChildren={
|
||||
<div className="flex gap-4">
|
||||
@ -114,12 +114,12 @@ const LoginModal: React.FC = () => {
|
||||
)}
|
||||
|
||||
<Button type="submit" onClick={handleSubmit(onSubmit)} disabled={isLoading}>
|
||||
{t<string>('modals.auth.login.actions.login')}
|
||||
{t('modals.auth.login.actions.login')}
|
||||
</Button>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<p>{t<string>('modals.auth.login.body')}</p>
|
||||
<p>{t('modals.auth.login.body')}</p>
|
||||
|
||||
<form className="grid gap-4 xl:w-2/3">
|
||||
<Controller
|
||||
@ -128,9 +128,9 @@ const LoginModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
autoFocus
|
||||
label={t<string>('modals.auth.login.form.username.label')}
|
||||
label={t('modals.auth.login.form.username.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || t<string>('modals.auth.login.form.username.help-text')}
|
||||
helperText={fieldState.error?.message || t('modals.auth.login.form.username.help-text')}
|
||||
{...field}
|
||||
/>
|
||||
)}
|
||||
@ -142,7 +142,7 @@ const LoginModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
type={showPassword ? 'text' : 'password'}
|
||||
label={t<string>('modals.auth.login.form.password.label')}
|
||||
label={t('modals.auth.login.form.password.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
InputProps={{ endAdornment: <PasswordVisibility /> }}
|
||||
|
||||
@ -61,7 +61,7 @@ const RegisterModal: React.FC = () => {
|
||||
const { mutateAsync, isLoading } = useMutation<void, ServerError, RegisterParams>(registerUser);
|
||||
|
||||
const { mutateAsync: loginWithGoogleMutation } = useMutation<void, ServerError, LoginWithGoogleParams>(
|
||||
loginWithGoogle
|
||||
loginWithGoogle,
|
||||
);
|
||||
|
||||
const handleClose = () => {
|
||||
@ -95,7 +95,7 @@ const RegisterModal: React.FC = () => {
|
||||
<BaseModal
|
||||
icon={<HowToReg />}
|
||||
isOpen={isOpen}
|
||||
heading={t<string>('modals.auth.register.heading')}
|
||||
heading={t('modals.auth.register.heading')}
|
||||
handleClose={handleClose}
|
||||
footerChildren={
|
||||
<div className="flex gap-4">
|
||||
@ -104,12 +104,12 @@ const RegisterModal: React.FC = () => {
|
||||
)}
|
||||
|
||||
<Button type="submit" onClick={handleSubmit(onSubmit)} disabled={isLoading}>
|
||||
{t<string>('modals.auth.register.actions.register')}
|
||||
{t('modals.auth.register.actions.register')}
|
||||
</Button>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<p>{t<string>('modals.auth.register.body')}</p>
|
||||
<p>{t('modals.auth.register.body')}</p>
|
||||
|
||||
<form className="grid gap-4 md:grid-cols-2">
|
||||
<Controller
|
||||
@ -118,7 +118,7 @@ const RegisterModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
autoFocus
|
||||
label={t<string>('modals.auth.register.form.name.label')}
|
||||
label={t('modals.auth.register.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -131,7 +131,7 @@ const RegisterModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('modals.auth.register.form.username.label')}
|
||||
label={t('modals.auth.register.form.username.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -145,7 +145,7 @@ const RegisterModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
type="email"
|
||||
label={t<string>('modals.auth.register.form.email.label')}
|
||||
label={t('modals.auth.register.form.email.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
@ -160,7 +160,7 @@ const RegisterModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
type="password"
|
||||
label={t<string>('modals.auth.register.form.password.label')}
|
||||
label={t('modals.auth.register.form.password.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -174,7 +174,7 @@ const RegisterModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
type="password"
|
||||
label={t<string>('modals.auth.register.form.confirm-password.label')}
|
||||
label={t('modals.auth.register.form.confirm-password.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
|
||||
@ -65,15 +65,15 @@ const ResetPasswordModal: React.FC = () => {
|
||||
<BaseModal
|
||||
icon={<LockReset />}
|
||||
isOpen={isOpen}
|
||||
heading={t<string>('modals.auth.reset-password.heading')}
|
||||
heading={t('modals.auth.reset-password.heading')}
|
||||
handleClose={handleClose}
|
||||
footerChildren={
|
||||
<Button type="submit" disabled={isLoading} onClick={handleSubmit(onSubmit)}>
|
||||
{t<string>('modals.auth.reset-password.actions.set-password')}
|
||||
{t('modals.auth.reset-password.actions.set-password')}
|
||||
</Button>
|
||||
}
|
||||
>
|
||||
<p>{t<string>('modals.auth.reset-password.body')}</p>
|
||||
<p>{t('modals.auth.reset-password.body')}</p>
|
||||
|
||||
<form className="grid gap-4 md:grid-cols-2">
|
||||
<Controller
|
||||
@ -83,7 +83,7 @@ const ResetPasswordModal: React.FC = () => {
|
||||
<TextField
|
||||
autoFocus
|
||||
type="password"
|
||||
label={t<string>('modals.auth.reset-password.form.password.label')}
|
||||
label={t('modals.auth.reset-password.form.password.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -97,7 +97,7 @@ const ResetPasswordModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
type="password"
|
||||
label={t<string>('modals.auth.reset-password.form.confirm-password.label')}
|
||||
label={t('modals.auth.reset-password.form.confirm-password.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
|
||||
@ -89,7 +89,7 @@ const UserProfileModal = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
autoFocus
|
||||
label={t<string>('modals.auth.profile.form.name.label')}
|
||||
label={t('modals.auth.profile.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -114,16 +114,16 @@ const UserProfileModal = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
disabled
|
||||
label={t<string>('modals.auth.profile.form.email.label')}
|
||||
label={t('modals.auth.profile.form.email.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={t<string>('modals.auth.profile.form.email.help-text')}
|
||||
helperText={t('modals.auth.profile.form.email.help-text')}
|
||||
{...field}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Button onClick={handleUpdate}>{t<string>('modals.auth.profile.actions.save')}</Button>
|
||||
<Button onClick={handleUpdate}>{t('modals.auth.profile.actions.save')}</Button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@ -133,12 +133,10 @@ const UserProfileModal = () => {
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
<CrisisAlert />
|
||||
<h5 className="font-medium">{t<string>('modals.auth.profile.delete-account.heading')}</h5>
|
||||
<h5 className="font-medium">{t('modals.auth.profile.delete-account.heading')}</h5>
|
||||
</div>
|
||||
|
||||
<p className="text-xs opacity-75">
|
||||
{t<string>('modals.auth.profile.delete-account.body', { keyword: 'delete' })}
|
||||
</p>
|
||||
<p className="text-xs opacity-75">{t('modals.auth.profile.delete-account.body', { keyword: 'delete' })}</p>
|
||||
|
||||
<div className="flex max-w-xs flex-col gap-4">
|
||||
<TextField
|
||||
@ -149,7 +147,7 @@ const UserProfileModal = () => {
|
||||
|
||||
<div>
|
||||
<Button variant="contained" color="error" disabled={!isDeleteTextValid} onClick={handleDelete}>
|
||||
{t<string>('modals.auth.profile.delete-account.actions.delete')}
|
||||
{t('modals.auth.profile.delete-account.actions.delete')}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -50,8 +50,8 @@ const AwardModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -73,7 +73,7 @@ const AwardModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -101,7 +101,7 @@ const AwardModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.title.label')}
|
||||
label={t('builder.common.form.title.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -115,7 +115,7 @@ const AwardModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.leftSidebar.sections.awards.form.awarder.label')}
|
||||
label={t('builder.leftSidebar.sections.awards.form.awarder.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -130,7 +130,7 @@ const AwardModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.date.label')}
|
||||
label={t('builder.common.form.date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -154,7 +154,7 @@ const AwardModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
placeholder="https://"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
@ -171,7 +171,7 @@ const AwardModal: React.FC = () => {
|
||||
multiline
|
||||
minRows={3}
|
||||
maxRows={6}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
|
||||
@ -50,8 +50,8 @@ const CertificateModal: React.FC = () => {
|
||||
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -73,7 +73,7 @@ const CertificateModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -101,7 +101,7 @@ const CertificateModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.name.label')}
|
||||
label={t('builder.common.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -115,7 +115,7 @@ const CertificateModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.leftSidebar.sections.certifications.form.issuer.label')}
|
||||
label={t('builder.leftSidebar.sections.certifications.form.issuer.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -130,7 +130,7 @@ const CertificateModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.date.label')}
|
||||
label={t('builder.common.form.date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -154,7 +154,7 @@ const CertificateModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
placeholder="https://"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
@ -171,7 +171,7 @@ const CertificateModal: React.FC = () => {
|
||||
multiline
|
||||
minRows={3}
|
||||
maxRows={6}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
|
||||
@ -2,7 +2,6 @@ import { joiResolver } from '@hookform/resolvers/joi';
|
||||
import { Add, DriveFileRenameOutline } from '@mui/icons-material';
|
||||
import { Button, Slider, TextField } from '@mui/material';
|
||||
import { DatePicker } from '@mui/x-date-pickers/DatePicker';
|
||||
import { Custom } from 'schema';
|
||||
import dayjs from 'dayjs';
|
||||
import Joi from 'joi';
|
||||
import get from 'lodash/get';
|
||||
@ -10,6 +9,7 @@ import isEmpty from 'lodash/isEmpty';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
import { useEffect, useMemo } from 'react';
|
||||
import { Controller, useForm } from 'react-hook-form';
|
||||
import { Custom } from 'schema';
|
||||
|
||||
import ArrayInput from '@/components/shared/ArrayInput';
|
||||
import BaseModal from '@/components/shared/BaseModal';
|
||||
@ -68,8 +68,8 @@ const CustomModal: React.FC = () => {
|
||||
|
||||
const heading = useAppSelector((state) => get(state.resume.present, `${path}.name`));
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -91,7 +91,7 @@ const CustomModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: 'builder.sections.custom',
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -119,7 +119,7 @@ const CustomModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.title.label')}
|
||||
label={t('builder.common.form.title.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -132,7 +132,7 @@ const CustomModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.subtitle.label')}
|
||||
label={t('builder.common.form.subtitle.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -147,7 +147,7 @@ const CustomModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.start-date.label')}
|
||||
label={t('builder.common.form.start-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -173,7 +173,7 @@ const CustomModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.end-date.label')}
|
||||
label={t('builder.common.form.end-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -181,7 +181,7 @@ const CustomModal: React.FC = () => {
|
||||
<TextField
|
||||
{...params}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || t<string>('builder.common.form.end-date.help-text')}
|
||||
helperText={fieldState.error?.message || t('builder.common.form.end-date.help-text')}
|
||||
/>
|
||||
),
|
||||
}}
|
||||
@ -197,7 +197,7 @@ const CustomModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
placeholder="https://"
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
@ -212,7 +212,7 @@ const CustomModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.level.label')}
|
||||
label={t('builder.common.form.level.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
@ -226,11 +226,13 @@ const CustomModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<div className="col-span-2">
|
||||
<h4 className="mb-3 font-semibold">{t<string>('builder.common.form.levelNum.label')}</h4>
|
||||
<h4 className="mb-3 font-semibold">{t('builder.common.form.levelNum.label')}</h4>
|
||||
|
||||
<div className="px-10">
|
||||
<Slider
|
||||
{...field}
|
||||
name={field.name}
|
||||
value={field.value}
|
||||
onChange={(_, value) => field.onChange(value as number)}
|
||||
marks={[
|
||||
{
|
||||
value: 0,
|
||||
@ -250,7 +252,7 @@ const CustomModal: React.FC = () => {
|
||||
defaultValue={0}
|
||||
color="secondary"
|
||||
valueLabelDisplay="auto"
|
||||
aria-label={t<string>('builder.common.form.levelNum.label')}
|
||||
aria-label={t('builder.common.form.levelNum.label')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -267,7 +269,7 @@ const CustomModal: React.FC = () => {
|
||||
maxRows={6}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
{...field}
|
||||
/>
|
||||
@ -279,7 +281,7 @@ const CustomModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<ArrayInput
|
||||
label={t<string>('builder.common.form.keywords.label')}
|
||||
label={t('builder.common.form.keywords.label')}
|
||||
value={field.value as string[]}
|
||||
onChange={field.onChange}
|
||||
errors={fieldState.error}
|
||||
|
||||
@ -63,8 +63,8 @@ const EducationModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -86,7 +86,7 @@ const EducationModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -114,7 +114,7 @@ const EducationModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.leftSidebar.sections.education.form.institution.label')}
|
||||
label={t('builder.leftSidebar.sections.education.form.institution.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -128,7 +128,7 @@ const EducationModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.leftSidebar.sections.education.form.degree.label')}
|
||||
label={t('builder.leftSidebar.sections.education.form.degree.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -141,7 +141,7 @@ const EducationModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.leftSidebar.sections.education.form.area-study.label')}
|
||||
label={t('builder.leftSidebar.sections.education.form.area-study.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -154,7 +154,7 @@ const EducationModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.leftSidebar.sections.education.form.grade.label')}
|
||||
label={t('builder.leftSidebar.sections.education.form.grade.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -169,7 +169,7 @@ const EducationModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.start-date.label')}
|
||||
label={t('builder.common.form.start-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -195,7 +195,7 @@ const EducationModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.end-date.label')}
|
||||
label={t('builder.common.form.end-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -203,7 +203,7 @@ const EducationModal: React.FC = () => {
|
||||
<TextField
|
||||
{...params}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || t<string>('builder.common.form.end-date.help-text')}
|
||||
helperText={fieldState.error?.message || t('builder.common.form.end-date.help-text')}
|
||||
/>
|
||||
),
|
||||
}}
|
||||
@ -219,7 +219,7 @@ const EducationModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
placeholder="https://"
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
@ -237,7 +237,7 @@ const EducationModal: React.FC = () => {
|
||||
multiline
|
||||
minRows={3}
|
||||
maxRows={6}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
@ -251,7 +251,7 @@ const EducationModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<ArrayInput
|
||||
label={t<string>('builder.leftSidebar.sections.education.form.courses.label')}
|
||||
label={t('builder.leftSidebar.sections.education.form.courses.label')}
|
||||
value={field.value as string[]}
|
||||
onChange={field.onChange}
|
||||
errors={fieldState.error}
|
||||
|
||||
@ -41,8 +41,8 @@ const InterestModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -64,7 +64,7 @@ const InterestModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -92,7 +92,7 @@ const InterestModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.name.label')}
|
||||
label={t('builder.common.form.name.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
@ -106,7 +106,7 @@ const InterestModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<ArrayInput
|
||||
label={t<string>('builder.common.form.keywords.label')}
|
||||
label={t('builder.common.form.keywords.label')}
|
||||
value={field.value as string[]}
|
||||
onChange={field.onChange}
|
||||
errors={fieldState.error}
|
||||
|
||||
@ -1,13 +1,13 @@
|
||||
import { joiResolver } from '@hookform/resolvers/joi';
|
||||
import { Add, DriveFileRenameOutline } from '@mui/icons-material';
|
||||
import { Button, Slider, TextField } from '@mui/material';
|
||||
import { Language, SectionPath } from 'schema';
|
||||
import Joi from 'joi';
|
||||
import get from 'lodash/get';
|
||||
import isEmpty from 'lodash/isEmpty';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
import { useEffect, useMemo } from 'react';
|
||||
import { Controller, useForm } from 'react-hook-form';
|
||||
import { Language, SectionPath } from 'schema';
|
||||
|
||||
import BaseModal from '@/components/shared/BaseModal';
|
||||
import { useAppDispatch, useAppSelector } from '@/store/hooks';
|
||||
@ -42,8 +42,8 @@ const LanguageModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -65,7 +65,7 @@ const LanguageModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -93,7 +93,7 @@ const LanguageModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.name.label')}
|
||||
label={t('builder.common.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -107,7 +107,7 @@ const LanguageModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.common.form.level.label')}
|
||||
label={t('builder.common.form.level.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -120,11 +120,13 @@ const LanguageModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<div className="col-span-2">
|
||||
<h4 className="mb-3 font-semibold">{t<string>('builder.common.form.levelNum.label')}</h4>
|
||||
<h4 className="mb-3 font-semibold">{t('builder.common.form.levelNum.label')}</h4>
|
||||
|
||||
<div className="px-10">
|
||||
<Slider
|
||||
{...field}
|
||||
name={field.name}
|
||||
value={field.value}
|
||||
onChange={(_, value) => field.onChange(value as number)}
|
||||
marks={[
|
||||
{
|
||||
value: 0,
|
||||
@ -144,7 +146,7 @@ const LanguageModal: React.FC = () => {
|
||||
defaultValue={0}
|
||||
color="secondary"
|
||||
valueLabelDisplay="auto"
|
||||
aria-label={t<string>('builder.common.form.levelNum.label')}
|
||||
aria-label={t('builder.common.form.levelNum.label')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -42,11 +42,11 @@ const ProfileModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = t<string>('builder.common.actions.add', {
|
||||
token: t<string>('builder.leftSidebar.sections.profiles.heading', { count: 1 }),
|
||||
const addText = t('builder.common.actions.add', {
|
||||
token: t('builder.leftSidebar.sections.profiles.heading', { count: 1 }),
|
||||
});
|
||||
const editText = t<string>('builder.common.actions.edit', {
|
||||
token: t<string>('builder.leftSidebar.sections.profiles.heading', { count: 1 }),
|
||||
const editText = t('builder.common.actions.edit', {
|
||||
token: t('builder.leftSidebar.sections.profiles.heading', { count: 1 }),
|
||||
});
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
@ -69,7 +69,7 @@ const ProfileModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -97,7 +97,7 @@ const ProfileModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.leftSidebar.sections.profiles.form.network.label')}
|
||||
label={t('builder.leftSidebar.sections.profiles.form.network.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -111,7 +111,7 @@ const ProfileModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.leftSidebar.sections.profiles.form.username.label')}
|
||||
label={t('builder.leftSidebar.sections.profiles.form.username.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
InputProps={{
|
||||
@ -127,7 +127,7 @@ const ProfileModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
className="col-span-2"
|
||||
placeholder="https://"
|
||||
error={!!fieldState.error}
|
||||
|
||||
@ -59,8 +59,8 @@ const ProjectModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -82,7 +82,7 @@ const ProjectModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -110,7 +110,7 @@ const ProjectModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.name.label')}
|
||||
label={t('builder.common.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -124,7 +124,7 @@ const ProjectModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.common.form.description.label')}
|
||||
label={t('builder.common.form.description.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -139,7 +139,7 @@ const ProjectModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.start-date.label')}
|
||||
label={t('builder.common.form.start-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -165,7 +165,7 @@ const ProjectModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.end-date.label')}
|
||||
label={t('builder.common.form.end-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -173,7 +173,7 @@ const ProjectModal: React.FC = () => {
|
||||
<TextField
|
||||
{...params}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || t<string>('builder.common.form.end-date.help-text')}
|
||||
helperText={fieldState.error?.message || t('builder.common.form.end-date.help-text')}
|
||||
/>
|
||||
),
|
||||
}}
|
||||
@ -189,7 +189,7 @@ const ProjectModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
placeholder="https://"
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
@ -207,7 +207,7 @@ const ProjectModal: React.FC = () => {
|
||||
multiline
|
||||
minRows={3}
|
||||
maxRows={6}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
@ -221,7 +221,7 @@ const ProjectModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<ArrayInput
|
||||
label={t<string>('builder.common.form.keywords.label')}
|
||||
label={t('builder.common.form.keywords.label')}
|
||||
value={field.value as string[]}
|
||||
onChange={field.onChange}
|
||||
errors={fieldState.error}
|
||||
|
||||
@ -50,8 +50,8 @@ const PublicationModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -73,7 +73,7 @@ const PublicationModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -101,7 +101,7 @@ const PublicationModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.name.label')}
|
||||
label={t('builder.common.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -115,7 +115,7 @@ const PublicationModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.leftSidebar.sections.publications.form.publisher.label')}
|
||||
label={t('builder.leftSidebar.sections.publications.form.publisher.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -130,7 +130,7 @@ const PublicationModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.date.label')}
|
||||
label={t('builder.common.form.date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -154,7 +154,7 @@ const PublicationModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
placeholder="https://"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
@ -171,7 +171,7 @@ const PublicationModal: React.FC = () => {
|
||||
multiline
|
||||
minRows={3}
|
||||
maxRows={6}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
|
||||
@ -47,8 +47,8 @@ const ReferenceModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -70,7 +70,7 @@ const ReferenceModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -98,7 +98,7 @@ const ReferenceModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.name.label')}
|
||||
label={t('builder.common.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -112,7 +112,7 @@ const ReferenceModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.leftSidebar.sections.references.form.relationship.label')}
|
||||
label={t('builder.leftSidebar.sections.references.form.relationship.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -125,7 +125,7 @@ const ReferenceModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.phone.label')}
|
||||
label={t('builder.common.form.phone.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -138,7 +138,7 @@ const ReferenceModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.email.label')}
|
||||
label={t('builder.common.form.email.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -154,7 +154,7 @@ const ReferenceModal: React.FC = () => {
|
||||
multiline
|
||||
minRows={3}
|
||||
maxRows={6}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
|
||||
@ -1,13 +1,13 @@
|
||||
import { joiResolver } from '@hookform/resolvers/joi';
|
||||
import { Add, DriveFileRenameOutline } from '@mui/icons-material';
|
||||
import { Button, Slider, TextField } from '@mui/material';
|
||||
import { SectionPath, Skill } from 'schema';
|
||||
import Joi from 'joi';
|
||||
import get from 'lodash/get';
|
||||
import isEmpty from 'lodash/isEmpty';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
import { useEffect, useMemo } from 'react';
|
||||
import { Controller, useForm } from 'react-hook-form';
|
||||
import { SectionPath, Skill } from 'schema';
|
||||
|
||||
import ArrayInput from '@/components/shared/ArrayInput';
|
||||
import BaseModal from '@/components/shared/BaseModal';
|
||||
@ -45,8 +45,8 @@ const SkillModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -68,7 +68,7 @@ const SkillModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -96,7 +96,7 @@ const SkillModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.common.form.name.label')}
|
||||
label={t('builder.common.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -109,7 +109,7 @@ const SkillModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.level.label')}
|
||||
label={t('builder.common.form.level.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -122,11 +122,13 @@ const SkillModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<div className="col-span-2">
|
||||
<h4 className="mb-3 font-semibold">{t<string>('builder.common.form.levelNum.label')}</h4>
|
||||
<h4 className="mb-3 font-semibold">{t('builder.common.form.levelNum.label')}</h4>
|
||||
|
||||
<div className="px-3">
|
||||
<Slider
|
||||
{...field}
|
||||
name={field.name}
|
||||
value={field.value}
|
||||
onChange={(_, value) => field.onChange(value as number)}
|
||||
marks={[
|
||||
{
|
||||
value: 0,
|
||||
@ -146,7 +148,7 @@ const SkillModal: React.FC = () => {
|
||||
defaultValue={0}
|
||||
color="secondary"
|
||||
valueLabelDisplay="auto"
|
||||
aria-label={t<string>('builder.common.form.levelNum.label')}
|
||||
aria-label={t('builder.common.form.levelNum.label')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -158,7 +160,7 @@ const SkillModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<ArrayInput
|
||||
label={t<string>('builder.common.form.keywords.label')}
|
||||
label={t('builder.common.form.keywords.label')}
|
||||
value={field.value}
|
||||
onChange={field.onChange}
|
||||
errors={fieldState.error}
|
||||
|
||||
@ -56,8 +56,8 @@ const VolunteerModal: React.FC = () => {
|
||||
const item: FormData = get(payload, 'item', null);
|
||||
const isEditMode = useMemo(() => !!item, [item]);
|
||||
|
||||
const addText = useMemo(() => t<string>('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t<string>('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
const addText = useMemo(() => t('builder.common.actions.add', { token: heading }), [t, heading]);
|
||||
const editText = useMemo(() => t('builder.common.actions.edit', { token: heading }), [t, heading]);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
defaultValues: defaultState,
|
||||
@ -79,7 +79,7 @@ const VolunteerModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: `builder.${path}`,
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -107,7 +107,7 @@ const VolunteerModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.leftSidebar.sections.volunteer.form.organization.label')}
|
||||
label={t('builder.leftSidebar.sections.volunteer.form.organization.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -121,7 +121,7 @@ const VolunteerModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.common.form.position.label')}
|
||||
label={t('builder.common.form.position.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -136,7 +136,7 @@ const VolunteerModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.start-date.label')}
|
||||
label={t('builder.common.form.start-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -162,7 +162,7 @@ const VolunteerModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.end-date.label')}
|
||||
label={t('builder.common.form.end-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -170,7 +170,7 @@ const VolunteerModal: React.FC = () => {
|
||||
<TextField
|
||||
{...params}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || t<string>('builder.common.form.end-date.help-text')}
|
||||
helperText={fieldState.error?.message || t('builder.common.form.end-date.help-text')}
|
||||
/>
|
||||
),
|
||||
}}
|
||||
@ -186,7 +186,7 @@ const VolunteerModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
placeholder="https://"
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
@ -204,7 +204,7 @@ const VolunteerModal: React.FC = () => {
|
||||
multiline
|
||||
minRows={3}
|
||||
maxRows={6}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
|
||||
@ -58,17 +58,17 @@ const WorkModal: React.FC = () => {
|
||||
|
||||
const addText = useMemo(
|
||||
() =>
|
||||
t<string>('builder.common.actions.add', {
|
||||
token: t<string>(`builder.leftSidebar.${path}.heading`, { defaultValue: heading }),
|
||||
t('builder.common.actions.add', {
|
||||
token: t(`builder.leftSidebar.${path}.heading`, { defaultValue: heading }),
|
||||
}),
|
||||
[t, heading]
|
||||
[t, heading],
|
||||
);
|
||||
const editText = useMemo(
|
||||
() =>
|
||||
t<string>('builder.common.actions.edit', {
|
||||
token: t<string>(`builder.leftSidebar.${path}.heading`, { defaultValue: heading }),
|
||||
t('builder.common.actions.edit', {
|
||||
token: t(`builder.leftSidebar.${path}.heading`, { defaultValue: heading }),
|
||||
}),
|
||||
[t, heading]
|
||||
[t, heading],
|
||||
);
|
||||
|
||||
const { reset, control, handleSubmit } = useForm<FormData>({
|
||||
@ -91,7 +91,7 @@ const WorkModal: React.FC = () => {
|
||||
setModalState({
|
||||
modal: 'builder.sections.work',
|
||||
state: { open: false },
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
reset(defaultState);
|
||||
@ -119,7 +119,7 @@ const WorkModal: React.FC = () => {
|
||||
<TextField
|
||||
required
|
||||
autoFocus
|
||||
label={t<string>('builder.leftSidebar.sections.experience.form.name.label')}
|
||||
label={t('builder.leftSidebar.sections.experience.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -133,7 +133,7 @@ const WorkModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
required
|
||||
label={t<string>('builder.common.form.position.label')}
|
||||
label={t('builder.common.form.position.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -148,7 +148,7 @@ const WorkModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.start-date.label')}
|
||||
label={t('builder.common.form.start-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -174,7 +174,7 @@ const WorkModal: React.FC = () => {
|
||||
<DatePicker
|
||||
openTo="year"
|
||||
inputRef={field.ref}
|
||||
label={t<string>('builder.common.form.end-date.label')}
|
||||
label={t('builder.common.form.end-date.label')}
|
||||
value={dayjs(field.value)}
|
||||
views={['year', 'month', 'day']}
|
||||
slots={{
|
||||
@ -182,7 +182,7 @@ const WorkModal: React.FC = () => {
|
||||
<TextField
|
||||
{...params}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || t<string>('builder.common.form.end-date.help-text')}
|
||||
helperText={fieldState.error?.message || t('builder.common.form.end-date.help-text')}
|
||||
/>
|
||||
),
|
||||
}}
|
||||
@ -198,7 +198,7 @@ const WorkModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('builder.common.form.url.label')}
|
||||
label={t('builder.common.form.url.label')}
|
||||
placeholder="https://"
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
@ -216,7 +216,7 @@ const WorkModal: React.FC = () => {
|
||||
multiline
|
||||
minRows={3}
|
||||
maxRows={6}
|
||||
label={t<string>('builder.common.form.summary.label')}
|
||||
label={t('builder.common.form.summary.label')}
|
||||
className="col-span-2"
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message || <MarkdownSupported />}
|
||||
|
||||
@ -80,15 +80,15 @@ const CreateResumeModal: React.FC = () => {
|
||||
<BaseModal
|
||||
isOpen={isOpen}
|
||||
icon={<Add />}
|
||||
heading={t<string>('modals.dashboard.create-resume.heading')}
|
||||
heading={t('modals.dashboard.create-resume.heading')}
|
||||
handleClose={handleClose}
|
||||
footerChildren={
|
||||
<Button type="submit" disabled={isLoading} onClick={handleSubmit(onSubmit)}>
|
||||
{t<string>('modals.dashboard.create-resume.actions.create-resume')}
|
||||
{t('modals.dashboard.create-resume.actions.create-resume')}
|
||||
</Button>
|
||||
}
|
||||
>
|
||||
<p>{t<string>('modals.dashboard.create-resume.body')}</p>
|
||||
<p>{t('modals.dashboard.create-resume.body')}</p>
|
||||
|
||||
<form className="grid gap-4">
|
||||
<Controller
|
||||
@ -97,7 +97,7 @@ const CreateResumeModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
autoFocus
|
||||
label={t<string>('modals.dashboard.create-resume.form.name.label')}
|
||||
label={t('modals.dashboard.create-resume.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -110,7 +110,7 @@ const CreateResumeModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('modals.dashboard.create-resume.form.slug.label')}
|
||||
label={t('modals.dashboard.create-resume.form.slug.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -120,7 +120,7 @@ const CreateResumeModal: React.FC = () => {
|
||||
|
||||
<FormGroup>
|
||||
<FormControlLabel
|
||||
label={t<string>('modals.dashboard.create-resume.form.public.label')}
|
||||
label={t('modals.dashboard.create-resume.form.public.label')}
|
||||
control={
|
||||
<Controller
|
||||
name="isPublic"
|
||||
|
||||
@ -63,7 +63,7 @@ const ImportExternalModal: React.FC = () => {
|
||||
const file = event.target.files[0];
|
||||
|
||||
if (file.size > FILE_UPLOAD_MAX_SIZE) {
|
||||
toast.error(t<string>('common.toast.error.upload-file-size'));
|
||||
toast.error(t('common.toast.error.upload-file-size'));
|
||||
return;
|
||||
}
|
||||
|
||||
@ -78,13 +78,13 @@ const ImportExternalModal: React.FC = () => {
|
||||
<BaseModal
|
||||
isOpen={isOpen}
|
||||
icon={<ImportExport />}
|
||||
heading={t<string>('modals.dashboard.import-external.heading')}
|
||||
heading={t('modals.dashboard.import-external.heading')}
|
||||
handleClose={handleClose}
|
||||
>
|
||||
<div className="grid gap-5">
|
||||
<h2 className="inline-flex items-center gap-2 text-lg font-medium">
|
||||
<LinkedIn />
|
||||
{t<string>('modals.dashboard.import-external.linkedin.heading')}
|
||||
{t('modals.dashboard.import-external.linkedin.heading')}
|
||||
</h2>
|
||||
|
||||
<p className="mb-2">
|
||||
@ -110,7 +110,7 @@ const ImportExternalModal: React.FC = () => {
|
||||
startIcon={<UploadFile />}
|
||||
onClick={() => handleClick('linkedin')}
|
||||
>
|
||||
{t<string>('modals.dashboard.import-external.linkedin.actions.upload-archive')}
|
||||
{t('modals.dashboard.import-external.linkedin.actions.upload-archive')}
|
||||
</Button>
|
||||
|
||||
<input
|
||||
@ -128,7 +128,7 @@ const ImportExternalModal: React.FC = () => {
|
||||
<div className="grid gap-5">
|
||||
<h2 className="inline-flex items-center gap-2 text-lg font-medium">
|
||||
<Code />
|
||||
{t<string>('modals.dashboard.import-external.json-resume.heading')}
|
||||
{t('modals.dashboard.import-external.json-resume.heading')}
|
||||
</h2>
|
||||
|
||||
<p className="mb-2">
|
||||
@ -154,7 +154,7 @@ const ImportExternalModal: React.FC = () => {
|
||||
startIcon={<UploadFile />}
|
||||
onClick={() => handleClick('json-resume')}
|
||||
>
|
||||
{t<string>('modals.dashboard.import-external.json-resume.actions.upload-json')}
|
||||
{t('modals.dashboard.import-external.json-resume.actions.upload-json')}
|
||||
</Button>
|
||||
|
||||
<input
|
||||
@ -172,10 +172,10 @@ const ImportExternalModal: React.FC = () => {
|
||||
<div className="grid gap-5">
|
||||
<h2 className="inline-flex items-center gap-2 text-lg font-medium">
|
||||
<TrackChanges />
|
||||
{t<string>('modals.dashboard.import-external.reactive-resume.heading')}
|
||||
{t('modals.dashboard.import-external.reactive-resume.heading')}
|
||||
</h2>
|
||||
|
||||
<p className="mb-2">{t<string>('modals.dashboard.import-external.reactive-resume.body')}</p>
|
||||
<p className="mb-2">{t('modals.dashboard.import-external.reactive-resume.body')}</p>
|
||||
|
||||
<div className="flex gap-4">
|
||||
<Button
|
||||
@ -184,7 +184,7 @@ const ImportExternalModal: React.FC = () => {
|
||||
startIcon={<UploadFile />}
|
||||
onClick={() => handleClick('reactive-resume')}
|
||||
>
|
||||
{t<string>('modals.dashboard.import-external.reactive-resume.actions.upload-json')}
|
||||
{t('modals.dashboard.import-external.reactive-resume.actions.upload-json')}
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
@ -193,7 +193,7 @@ const ImportExternalModal: React.FC = () => {
|
||||
startIcon={<UploadFile />}
|
||||
onClick={() => handleClick('reactive-resume-v2')}
|
||||
>
|
||||
{t<string>('modals.dashboard.import-external.reactive-resume.actions.upload-json-v2')}
|
||||
{t('modals.dashboard.import-external.reactive-resume.actions.upload-json-v2')}
|
||||
</Button>
|
||||
|
||||
<input
|
||||
|
||||
@ -92,11 +92,11 @@ const RenameResumeModal: React.FC = () => {
|
||||
<BaseModal
|
||||
icon={<DriveFileRenameOutline />}
|
||||
isOpen={isOpen}
|
||||
heading={t<string>('modals.dashboard.rename-resume.heading')}
|
||||
heading={t('modals.dashboard.rename-resume.heading')}
|
||||
handleClose={handleClose}
|
||||
footerChildren={
|
||||
<Button type="submit" disabled={isLoading} onClick={handleSubmit(onSubmit)}>
|
||||
{t<string>('modals.dashboard.rename-resume.actions.rename-resume')}
|
||||
{t('modals.dashboard.rename-resume.actions.rename-resume')}
|
||||
</Button>
|
||||
}
|
||||
>
|
||||
@ -107,7 +107,7 @@ const RenameResumeModal: React.FC = () => {
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
autoFocus
|
||||
label={t<string>('modals.dashboard.rename-resume.form.name.label')}
|
||||
label={t('modals.dashboard.rename-resume.form.name.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
@ -120,7 +120,7 @@ const RenameResumeModal: React.FC = () => {
|
||||
control={control}
|
||||
render={({ field, fieldState }) => (
|
||||
<TextField
|
||||
label={t<string>('modals.dashboard.rename-resume.form.slug.label')}
|
||||
label={t('modals.dashboard.rename-resume.form.slug.label')}
|
||||
error={!!fieldState.error}
|
||||
helperText={fieldState.error?.message}
|
||||
{...field}
|
||||
|
||||
@ -3,48 +3,52 @@
|
||||
"scripts": {
|
||||
"dev": "react-env --prefix PUBLIC -- next dev",
|
||||
"lint": "next lint --fix",
|
||||
"build": "next build && npm run sitemap",
|
||||
"build": "next build",
|
||||
"start": "react-env --prefix PUBLIC -- next start",
|
||||
"sitemap": "next-sitemap --config next-sitemap.config.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"@beam-australia/react-env": "^3.1.1",
|
||||
"@emotion/css": "^11.11.0",
|
||||
"@emotion/css": "^11.11.2",
|
||||
"@emotion/react": "^11.11.1",
|
||||
"@emotion/styled": "^11.11.0",
|
||||
"@hello-pangea/dnd": "^16.2.0",
|
||||
"@hookform/resolvers": "3.1.0",
|
||||
"@fontsource/material-icons": "^5.0.5",
|
||||
"@hello-pangea/dnd": "^16.3.0",
|
||||
"@hookform/resolvers": "3.1.1",
|
||||
"@monaco-editor/react": "^4.5.1",
|
||||
"@mui/icons-material": "^5.11.16",
|
||||
"@mui/lab": "^5.0.0-alpha.133",
|
||||
"@mui/material": "^5.13.4",
|
||||
"@mui/system": "^5.13.2",
|
||||
"@mui/x-date-pickers": "6.6.0",
|
||||
"@mui/icons-material": "^5.14.0",
|
||||
"@mui/lab": "^5.0.0-alpha.136",
|
||||
"@mui/material": "^5.14.0",
|
||||
"@mui/system": "^5.14.0",
|
||||
"@mui/x-date-pickers": "6.9.2",
|
||||
"@radix-ui/react-separator": "^1.0.3",
|
||||
"@react-oauth/google": "^0.11.0",
|
||||
"@reduxjs/toolkit": "^1.9.5",
|
||||
"axios": "^1.4.0",
|
||||
"clsx": "^1.2.1",
|
||||
"dayjs": "^1.11.8",
|
||||
"dayjs": "^1.11.9",
|
||||
"downloadjs": "^1.4.7",
|
||||
"joi": "^17.9.2",
|
||||
"lodash": "^4.17.21",
|
||||
"md5-hex": "^4.0.0",
|
||||
"monaco-editor": "^0.39.0",
|
||||
"nanoid": "3.3.4",
|
||||
"next": "13.4.4",
|
||||
"next-i18next": "^13.3.0",
|
||||
"monaco-editor": "^0.40.0",
|
||||
"nanoid": "^3.3.6",
|
||||
"next": "13.4.9",
|
||||
"next-i18next": "^14.0.0",
|
||||
"react": "^18.2.0",
|
||||
"react-colorful": "^5.6.1",
|
||||
"react-dnd": "16.0.1",
|
||||
"react-dnd-html5-backend": "16.0.1",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-hook-form": "^7.44.3",
|
||||
"react-github-btn": "^1.4.0",
|
||||
"react-hook-form": "^7.45.1",
|
||||
"react-hot-toast": "2.4.1",
|
||||
"react-icons": "^4.9.0",
|
||||
"react-icons": "^4.10.1",
|
||||
"react-markdown": "^8.0.7",
|
||||
"react-parallax-tilt": "^1.7.152",
|
||||
"react-query": "^3.39.3",
|
||||
"react-redux": "^8.0.7",
|
||||
"react-zoom-pan-pinch": "^3.0.8",
|
||||
"react-redux": "^8.1.1",
|
||||
"react-zoom-pan-pinch": "^3.1.0",
|
||||
"redux": "^4.2.1",
|
||||
"redux-persist": "^6.0.0",
|
||||
"redux-saga": "^1.2.3",
|
||||
@ -52,31 +56,34 @@
|
||||
"rehype-katex": "^6.0.3",
|
||||
"remark-gfm": "^3.0.1",
|
||||
"remark-math": "^5.1.1",
|
||||
"sharp": "^0.32.1",
|
||||
"sharp": "^0.32.2",
|
||||
"tailwind-merge": "^1.13.2",
|
||||
"uuid": "^9.0.0",
|
||||
"webfontloader": "^1.6.28"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.22.1",
|
||||
"schema": "workspace:*",
|
||||
"@babel/core": "^7.22.8",
|
||||
"@fontsource/ibm-plex-sans": "^5.0.5",
|
||||
"@tailwindcss/forms": "^0.5.3",
|
||||
"@tailwindcss/typography": "^0.5.9",
|
||||
"@types/downloadjs": "^1.4.3",
|
||||
"@types/lodash": "^4.14.195",
|
||||
"@types/node": "^20.2.5",
|
||||
"@types/react": "^18.2.9",
|
||||
"@types/react-dom": "^18.2.4",
|
||||
"@types/node": "^20.4.1",
|
||||
"@types/react": "^18.2.14",
|
||||
"@types/react-dom": "^18.2.6",
|
||||
"@types/react-redux": "^7.1.25",
|
||||
"@types/uuid": "^9.0.1",
|
||||
"@types/uuid": "^9.0.2",
|
||||
"@types/webfontloader": "^1.6.35",
|
||||
"autoprefixer": "^10.4.14",
|
||||
"csstype": "^3.1.2",
|
||||
"eslint-config-next": "^13.4.4",
|
||||
"eslint-plugin-tailwindcss": "^3.12.1",
|
||||
"eslint-plugin-unused-imports": "^2.0.0",
|
||||
"next-sitemap": "^4.1.3",
|
||||
"postcss": "^8.4.24",
|
||||
"sass": "^1.63.2",
|
||||
"eslint-config-next": "^13.4.9",
|
||||
"eslint-plugin-tailwindcss": "^3.13.0",
|
||||
"eslint-plugin-unused-imports": "^3.0.0",
|
||||
"next-sitemap": "^4.1.8",
|
||||
"postcss": "^8.4.25",
|
||||
"sass": "^1.63.6",
|
||||
"schema": "workspace:*",
|
||||
"tailwindcss": "^3.3.2",
|
||||
"typescript": "^5.1.3"
|
||||
"typescript": "^5.1.6"
|
||||
}
|
||||
}
|
||||
|
||||
@ -42,14 +42,10 @@ const Build: NextPage<Props> = ({ username, slug }) => {
|
||||
`resume/${username}/${slug}`,
|
||||
() => fetchResumeByIdentifier({ username, slug }),
|
||||
{
|
||||
cacheTime: 0,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
onSuccess: (resume) => {
|
||||
dispatch(setResume(resume));
|
||||
},
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
@ -62,7 +58,7 @@ const Build: NextPage<Props> = ({ username, slug }) => {
|
||||
<div className={styles.container}>
|
||||
<Head>
|
||||
<title>
|
||||
{resume.name} | {t<string>('common.title')}
|
||||
{resume.name} | {t('common.title')}
|
||||
</title>
|
||||
</Head>
|
||||
|
||||
|
||||
@ -57,6 +57,16 @@ const Preview: NextPage<Props> = ({ username, slug, resume: initialData }) => {
|
||||
|
||||
useEffect(() => {
|
||||
if (initialData && !isEmpty(initialData)) {
|
||||
const errorObj = JSON.parse(JSON.stringify(initialData));
|
||||
const statusCode: number | null = get(errorObj, 'statusCode', null);
|
||||
|
||||
if (statusCode === 404) {
|
||||
toast.error('The resume you were looking for does not exist, or maybe it never did?');
|
||||
|
||||
router.push('/');
|
||||
return;
|
||||
}
|
||||
|
||||
dispatch(setResume(initialData));
|
||||
}
|
||||
}, [dispatch, initialData]);
|
||||
@ -73,10 +83,6 @@ const Preview: NextPage<Props> = ({ username, slug, resume: initialData }) => {
|
||||
|
||||
useQuery<Resume>(`resume/${username}/${slug}`, () => fetchResumeByIdentifier({ username, slug }), {
|
||||
initialData,
|
||||
retry: false,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
onSuccess: (data) => {
|
||||
dispatch(setResume(data));
|
||||
},
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
import '@/styles/globals.scss';
|
||||
import '@fontsource/material-icons';
|
||||
import '@fontsource/ibm-plex-sans/300.css';
|
||||
import '@fontsource/ibm-plex-sans/400.css';
|
||||
import '@fontsource/ibm-plex-sans/500.css';
|
||||
import '@fontsource/ibm-plex-sans/600.css';
|
||||
import '@fontsource/ibm-plex-sans/700.css';
|
||||
|
||||
import env from '@beam-australia/react-env';
|
||||
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
|
||||
|
||||
@ -23,7 +23,7 @@ const Document: NextPage = () => (
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Organization",
|
||||
"url": "https://rxresu.me",
|
||||
"logo": "https://rxresu.me/images/logos/logo.svg"
|
||||
"logo": "https://rxresu.me/logo/dark.svg"
|
||||
}`,
|
||||
}}
|
||||
/>
|
||||
|
||||
@ -40,7 +40,7 @@ const Dashboard: NextPage = () => {
|
||||
<div className={styles.container}>
|
||||
<Head>
|
||||
<title>
|
||||
{t<string>('dashboard.title')} | {t<string>('common.title')}
|
||||
{t('dashboard.title')} | {t('common.title')}
|
||||
</title>
|
||||
</Head>
|
||||
|
||||
@ -56,15 +56,15 @@ const Dashboard: NextPage = () => {
|
||||
<ResumeCard
|
||||
icon={Add}
|
||||
modal="dashboard.create-resume"
|
||||
title={t<string>('dashboard.create-resume.title')}
|
||||
subtitle={t<string>('dashboard.create-resume.subtitle')}
|
||||
title={t('dashboard.create-resume.title')}
|
||||
subtitle={t('dashboard.create-resume.subtitle')}
|
||||
/>
|
||||
|
||||
<ResumeCard
|
||||
icon={ImportExport}
|
||||
modal="dashboard.import-external"
|
||||
title={t<string>('dashboard.import-external.title')}
|
||||
subtitle={t<string>('dashboard.import-external.subtitle')}
|
||||
title={t('dashboard.import-external.title')}
|
||||
subtitle={t('dashboard.import-external.subtitle')}
|
||||
/>
|
||||
|
||||
{data.map((resume) => (
|
||||
|
||||
68
client/pages/home.tsx
Normal file
68
client/pages/home.tsx
Normal file
@ -0,0 +1,68 @@
|
||||
import type { GetStaticProps, NextPage } from 'next';
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
|
||||
import Tilt from 'react-parallax-tilt';
|
||||
|
||||
import HeroBackground from '@/components/home/Background';
|
||||
import Footer from '@/components/home/Footer';
|
||||
import Header from '@/components/home/Header';
|
||||
import HeroPattern from '@/components/home/Pattern';
|
||||
import LogoSection from '@/components/home/sections/Logo';
|
||||
import StatsSection from '@/components/home/sections/Stats';
|
||||
import { defaultTiltProps } from '@/constants/tilt';
|
||||
|
||||
export const getStaticProps: GetStaticProps = async ({ locale = 'en' }) => ({
|
||||
props: {
|
||||
...(await serverSideTranslations(locale, ['common', 'modals', 'landing'])),
|
||||
},
|
||||
});
|
||||
|
||||
const Home: NextPage = () => (
|
||||
<div>
|
||||
<Header />
|
||||
|
||||
<main className="relative isolate mb-[450px] overflow-hidden bg-zinc-50 dark:bg-zinc-950">
|
||||
<section className="relative">
|
||||
<HeroPattern />
|
||||
<HeroBackground />
|
||||
|
||||
<div className="mx-auto max-w-7xl px-6 pb-24 pt-10 sm:pb-32 lg:flex lg:px-8 lg:py-52">
|
||||
<div className="mx-auto max-w-2xl shrink-0 lg:mx-0 lg:max-w-xl lg:pt-12">
|
||||
<div className="mt-10 space-y-2">
|
||||
<h6 className="text-base font-bold tracking-wide">Finally,</h6>
|
||||
<h1 className="text-4xl font-bold !leading-[1.15] tracking-tight sm:text-6xl">
|
||||
A free and open-source resume builder
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<p className="prose prose-base prose-zinc mt-6 text-lg leading-8 dark:prose-invert">
|
||||
Reactive Resume is a free and open-source resume builder that simplifies the tasks of creating, updating,
|
||||
and sharing your resume.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mx-auto mt-16 flex max-w-2xl sm:mt-24 lg:ml-10 lg:mr-0 lg:mt-0 lg:max-w-none lg:flex-none xl:ml-32">
|
||||
<div className="max-w-3xl flex-none sm:max-w-5xl lg:max-w-none">
|
||||
<Tilt {...defaultTiltProps}>
|
||||
<img
|
||||
width={2432}
|
||||
height={1442}
|
||||
src="/images/screenshots/builder.png"
|
||||
alt="Reactive Resume Screenshot - Builder Screen"
|
||||
className="w-[76rem] rounded-lg bg-zinc-50/5 shadow-2xl ring-1 ring-zinc-950/10 dark:bg-zinc-950/5 dark:ring-zinc-50/10"
|
||||
/>
|
||||
</Tilt>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<LogoSection />
|
||||
|
||||
<StatsSection />
|
||||
</main>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
|
||||
export default Home;
|
||||
@ -7,7 +7,7 @@ import Link from 'next/link';
|
||||
import { Trans, useTranslation } from 'next-i18next';
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
|
||||
|
||||
import Testimony from '@/components/landing/Testimony';
|
||||
import Testimony from '@/components/home/Testimony';
|
||||
import Footer from '@/components/shared/Footer';
|
||||
import LanguageSwitcher from '@/components/shared/LanguageSwitcher';
|
||||
import Logo from '@/components/shared/Logo';
|
||||
@ -49,28 +49,28 @@ const Home: NextPage = () => {
|
||||
</div>
|
||||
|
||||
<div className={styles.main}>
|
||||
<h1>{t<string>('common.title')}</h1>
|
||||
<h1>{t('common.title')}</h1>
|
||||
|
||||
<h2>{t<string>('common.subtitle')}</h2>
|
||||
<h2>{t('common.subtitle')}</h2>
|
||||
|
||||
<NoSsr>
|
||||
<div className={styles.buttonWrapper}>
|
||||
{isLoggedIn ? (
|
||||
<>
|
||||
<Link href="/dashboard" passHref>
|
||||
<Button>{t<string>('landing.actions.app')}</Button>
|
||||
<Button>{t('landing.actions.app')}</Button>
|
||||
</Link>
|
||||
|
||||
<Button variant="outlined" onClick={handleLogout}>
|
||||
{t<string>('landing.actions.logout')}
|
||||
{t('landing.actions.logout')}
|
||||
</Button>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Button onClick={handleLogin}>{t<string>('landing.actions.login')}</Button>
|
||||
<Button onClick={handleLogin}>{t('landing.actions.login')}</Button>
|
||||
|
||||
<Button variant="outlined" onClick={handleRegister} disabled={FLAG_DISABLE_SIGNUPS}>
|
||||
{t<string>('landing.actions.register')}
|
||||
{t('landing.actions.register')}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
@ -80,21 +80,21 @@ const Home: NextPage = () => {
|
||||
</div>
|
||||
|
||||
<section className={styles.section}>
|
||||
<h6>{t<string>('landing.summary.heading')}</h6>
|
||||
<h6>{t('landing.summary.heading')}</h6>
|
||||
|
||||
<p>{t<string>('landing.summary.body')}</p>
|
||||
<p>{t('landing.summary.body')}</p>
|
||||
</section>
|
||||
|
||||
<section className={styles.section}>
|
||||
<h6>{t<string>('landing.features.heading')}</h6>
|
||||
<h6>{t('landing.features.heading')}</h6>
|
||||
|
||||
<ul className="list-inside list-disc leading-loose">
|
||||
<li>{t<string>('landing.features.list.free')}</li>
|
||||
<li>{t<string>('landing.features.list.ads')}</li>
|
||||
<li>{t<string>('landing.features.list.tracking')}</li>
|
||||
<li>{t<string>('landing.features.list.languages')}</li>
|
||||
<li>{t<string>('landing.features.list.import')}</li>
|
||||
<li>{t<string>('landing.features.list.export')}</li>
|
||||
<li>{t('landing.features.list.free')}</li>
|
||||
<li>{t('landing.features.list.ads')}</li>
|
||||
<li>{t('landing.features.list.tracking')}</li>
|
||||
<li>{t('landing.features.list.languages')}</li>
|
||||
<li>{t('landing.features.list.import')}</li>
|
||||
<li>{t('landing.features.list.export')}</li>
|
||||
<li>
|
||||
<Trans t={t} i18nKey="landing.features.list.more">
|
||||
And a lot of exciting features,
|
||||
@ -107,7 +107,7 @@ const Home: NextPage = () => {
|
||||
</section>
|
||||
|
||||
<section className={styles.section}>
|
||||
<h6>{t<string>('landing.screenshots.heading')}</h6>
|
||||
<h6>{t('landing.screenshots.heading')}</h6>
|
||||
|
||||
<div className={styles.screenshots}>
|
||||
{screenshots.map(({ src, alt }) => (
|
||||
@ -125,7 +125,7 @@ const Home: NextPage = () => {
|
||||
</section>
|
||||
|
||||
<section className={styles.section}>
|
||||
<h6>{t<string>('landing.testimonials.heading')}</h6>
|
||||
<h6>{t('landing.testimonials.heading')}</h6>
|
||||
|
||||
<p className="my-3">
|
||||
<Trans t={t} i18nKey="landing.testimonials.body">
|
||||
@ -150,42 +150,42 @@ const Home: NextPage = () => {
|
||||
</section>
|
||||
|
||||
<section className={styles.section}>
|
||||
<h6>{t<string>('landing.links.heading')}</h6>
|
||||
<h6>{t('landing.links.heading')}</h6>
|
||||
|
||||
<div>
|
||||
<Link href="/meta/privacy" passHref>
|
||||
<Button variant="text" startIcon={<LinkIcon />}>
|
||||
{t<string>('landing.links.links.privacy')}
|
||||
{t('landing.links.links.privacy')}
|
||||
</Button>
|
||||
</Link>
|
||||
|
||||
<Link href="/meta/service" passHref>
|
||||
<Button variant="text" startIcon={<LinkIcon />}>
|
||||
{t<string>('landing.links.links.service')}
|
||||
{t('landing.links.links.service')}
|
||||
</Button>
|
||||
</Link>
|
||||
|
||||
<a href={GITHUB_URL} target="_blank" rel="noreferrer">
|
||||
<Button variant="text" startIcon={<LinkIcon />}>
|
||||
{t<string>('landing.links.links.github')}
|
||||
{t('landing.links.links.github')}
|
||||
</Button>
|
||||
</a>
|
||||
|
||||
<a href={DOCS_URL} target="_blank" rel="noreferrer">
|
||||
<Button variant="text" startIcon={<LinkIcon />}>
|
||||
{t<string>('landing.links.links.docs')}
|
||||
{t('landing.links.links.docs')}
|
||||
</Button>
|
||||
</a>
|
||||
|
||||
<a href={REDDIT_URL} target="_blank" rel="noreferrer">
|
||||
<Button variant="text" startIcon={<LinkIcon />}>
|
||||
{t<string>('landing.links.links.reddit')}
|
||||
{t('landing.links.links.reddit')}
|
||||
</Button>
|
||||
</a>
|
||||
|
||||
<a href={DONATION_URL} target="_blank" rel="noreferrer">
|
||||
<Button variant="text" startIcon={<LinkIcon />}>
|
||||
{t<string>('landing.links.links.donate')}
|
||||
{t('landing.links.links.donate')}
|
||||
</Button>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -41,9 +41,6 @@ const Preview: NextPage<Props> = ({ shortId }) => {
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const { data: resume } = useQuery<Resume>(`resume/${shortId}`, () => fetchResumeByShortId({ shortId }), {
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
onSuccess: (data) => {
|
||||
dispatch(setResume(data));
|
||||
},
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 101 KiB After Width: | Height: | Size: 68 KiB |
8
client/public/icon/dark.svg
Normal file
8
client/public/icon/dark.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M173.611 166.311L132.877 219.804H173.524L193.973 191.813L213.183 219.804H256L215.673 165.707L215.15 165.046L207.461 155.332L195.329 140.004L195.258 139.915L193.813 138.089L193.923 138.001L176.286 112.861H134.061L173.611 166.311ZM199.89 133.554L214.959 112.861H254.619L219.874 158.8L199.89 133.554Z"
|
||||
fill="#09090B" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M0 36.1959V174.314H39.0678V137.614H60.3938L60.4323 137.671C60.8436 137.653 61.2518 137.634 61.6569 137.614C75.0665 136.968 85.1471 135.549 96.3849 131.385C96.7596 131.246 97.1355 131.104 97.5128 130.959L97.4591 130.881C105.816 126.86 112.331 121.344 117.006 114.331C122.005 106.702 124.504 97.6915 124.504 87.2997C124.504 76.7764 122.005 67.7 117.006 60.0706C112.007 52.3097 104.904 46.3903 95.6964 42.3125C86.62 38.2347 75.7678 36.1959 63.1399 36.1959H0ZM102.156 137.725L64.8705 144.175L85.4361 174.314H127.266L102.156 137.725ZM39.0678 107.426H60.7721C68.9277 107.426 74.9786 105.65 78.9248 102.098C83.0026 98.5465 85.0415 93.6137 85.0415 87.2997C85.0415 80.8542 83.0026 75.8556 78.9248 72.304C74.9786 68.7523 68.9277 66.9765 60.7721 66.9765H39.0678V107.426Z"
|
||||
fill="#09090B" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
8
client/public/icon/light.svg
Normal file
8
client/public/icon/light.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M173.611 166.311L132.877 219.804H173.524L193.973 191.813L213.183 219.804H256L215.673 165.707L215.15 165.046L207.461 155.332L195.329 140.004L195.258 139.915L193.813 138.089L193.923 138.001L176.286 112.861H134.061L173.611 166.311ZM199.89 133.554L214.959 112.861H254.619L219.874 158.8L199.89 133.554Z"
|
||||
fill="#FAFAFA" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M0 36.1959V174.314H39.0678V137.614H60.3938L60.4323 137.671C60.8436 137.653 61.2517 137.634 61.6567 137.614C75.0665 136.968 85.1471 135.549 96.385 131.385C96.7596 131.246 97.1355 131.104 97.5128 130.959L97.4591 130.881C105.816 126.86 112.331 121.344 117.006 114.331C122.005 106.702 124.504 97.6915 124.504 87.2997C124.504 76.7764 122.005 67.7 117.006 60.0706C112.007 52.3097 104.904 46.3903 95.6964 42.3125C86.62 38.2347 75.7679 36.1959 63.1399 36.1959H0ZM102.156 137.725L64.8705 144.175L85.4361 174.314H127.266L102.156 137.725ZM39.0678 107.426H60.7721C68.9277 107.426 74.9786 105.65 78.9248 102.098C83.0026 98.5465 85.0415 93.6137 85.0415 87.2997C85.0415 80.8542 83.0026 75.8556 78.9248 72.304C74.9786 68.7523 68.9277 66.9765 60.7721 66.9765H39.0678V107.426Z"
|
||||
fill="#FAFAFA" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
33
client/public/images/brand-logos/dark/amazon.svg
Normal file
33
client/public/images/brand-logos/dark/amazon.svg
Normal file
@ -0,0 +1,33 @@
|
||||
<svg width="498" height="151" viewBox="0 0 498 151" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_177_125)">
|
||||
<path
|
||||
d="M309.08 117.21C280.235 138.472 238.425 149.816 202.427 149.816C151.952 149.816 106.512 131.147 72.1348 100.098C69.4339 97.6559 71.8539 94.3284 75.095 96.2298C112.195 117.815 158.067 130.801 205.452 130.801C237.409 130.801 272.564 124.19 304.889 110.469C309.772 108.395 313.856 113.667 309.08 117.21Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M321.072 103.49C317.399 98.7795 296.699 101.264 287.408 102.366C284.578 102.712 284.146 100.249 286.695 98.477C303.182 86.8739 330.234 90.223 333.389 94.1123C336.543 98.0232 332.567 125.14 317.075 138.083C314.698 140.071 312.429 139.012 313.488 136.376C316.967 127.69 324.767 108.222 321.072 103.49Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M288.057 16.5637V5.28474C288.057 3.57776 289.353 2.43258 290.909 2.43258H341.405C343.025 2.43258 344.322 3.59937 344.322 5.28474V14.9432C344.3 16.5637 342.939 18.6813 340.519 22.0304L314.353 59.3894C324.076 59.1517 334.339 60.5994 343.155 65.5691C345.143 66.6926 345.683 68.3348 345.834 69.9554V81.9906C345.834 83.6328 344.019 85.5558 342.118 84.5619C326.582 76.4159 305.947 75.53 288.77 84.6483C287.019 85.599 285.183 83.6976 285.183 82.0554V70.6252C285.183 68.7886 285.204 65.6555 287.041 62.8682L317.356 19.3943H290.974C289.353 19.3943 288.057 18.2491 288.057 16.5637Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M103.854 86.9387H88.4916C87.0223 86.8307 85.8555 85.7287 85.7474 84.3242V5.47922C85.7474 3.90188 87.0655 2.64865 88.7076 2.64865H103.033C104.524 2.71343 105.713 3.85866 105.821 5.28474V15.5914H106.102C109.84 5.63045 116.862 0.984887 126.326 0.984887C135.941 0.984887 141.948 5.63045 146.269 15.5914C149.986 5.63045 158.434 0.984887 167.488 0.984887C173.927 0.984887 180.971 3.64258 185.271 9.60619C190.132 16.2396 189.138 25.8765 189.138 34.3249L189.117 84.0865C189.117 85.6639 187.799 86.9387 186.157 86.9387H170.815C169.281 86.8307 168.05 85.599 168.05 84.0865V42.298C168.05 38.9705 168.352 30.6733 167.617 27.5186C166.472 22.2249 163.037 20.7339 158.586 20.7339C154.869 20.7339 150.98 23.2188 149.403 27.1945C147.825 31.1703 147.976 37.8253 147.976 42.298V84.0865C147.976 85.6639 146.658 86.9387 145.016 86.9387H129.675C128.119 86.8307 126.909 85.599 126.909 84.0865L126.888 42.298C126.888 33.5039 128.335 20.5611 117.424 20.5611C106.382 20.5611 106.815 33.1797 106.815 42.298V84.0865C106.815 85.6639 105.496 86.9387 103.854 86.9387Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M387.796 0.984887C410.591 0.984887 422.929 20.5611 422.929 45.4527C422.929 69.5016 409.295 88.5808 387.796 88.5808C365.411 88.5808 353.224 69.0046 353.224 44.61C353.224 20.0641 365.562 0.984887 387.796 0.984887ZM387.925 17.0823C376.603 17.0823 375.89 32.5099 375.89 42.1252C375.89 51.762 375.739 72.3322 387.796 72.3322C399.701 72.3322 400.263 55.7378 400.263 45.6255C400.263 38.9705 399.982 31.019 397.973 24.7097C396.244 19.2215 392.809 17.0823 387.925 17.0823Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M452.488 86.9387H437.19C435.656 86.8307 434.424 85.599 434.424 84.0865L434.403 5.21991C434.532 3.77223 435.807 2.64865 437.363 2.64865H451.602C452.942 2.71343 454.044 3.62098 454.346 4.8526V16.9095H454.627C458.927 6.12742 464.955 0.984887 475.565 0.984887C482.457 0.984887 489.177 3.46973 493.499 10.276C497.518 16.5853 497.518 27.1945 497.518 34.8219V84.4539C497.345 85.8367 496.07 86.9387 494.557 86.9387H479.151C477.747 86.8307 476.58 85.7935 476.429 84.4539V41.6282C476.429 33.0069 477.423 20.3882 466.814 20.3882C463.076 20.3882 459.64 22.8947 457.933 26.6976C455.772 31.516 455.491 36.3128 455.491 41.6282V84.0865C455.47 85.6639 454.13 86.9387 452.488 86.9387Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M247.802 49.2772V45.9497C236.696 45.9497 224.963 48.3265 224.963 61.4205C224.963 68.0539 228.399 72.5482 234.297 72.5482C238.619 72.5482 242.487 69.8905 244.928 65.5691C247.953 60.2537 247.802 55.2624 247.802 49.2772ZM263.294 86.7226C262.279 87.6301 260.81 87.6949 259.664 87.0899C254.565 82.8549 253.658 80.8887 250.849 76.8481C242.422 85.4478 236.458 88.019 225.525 88.019C212.604 88.019 202.535 80.046 202.535 64.0782C202.535 51.6108 209.298 43.1191 218.913 38.9705C227.254 35.2973 238.9 34.649 247.802 33.6335V31.6456C247.802 27.994 248.083 23.6725 245.944 20.5179C244.064 17.6873 240.477 16.5205 237.323 16.5205C231.467 16.5205 226.238 19.5239 224.963 25.7468C224.704 27.1297 223.688 28.491 222.305 28.5558L207.396 26.9568C206.143 26.676 204.76 25.6604 205.106 23.7374C208.542 5.67368 224.855 0.228627 239.462 0.228627C246.938 0.228627 256.704 2.2165 262.603 7.87761C270.079 14.8568 269.366 24.1695 269.366 34.3033V58.2442C269.366 65.4394 272.348 68.5941 275.157 72.4834C276.151 73.8663 276.367 75.53 275.114 76.5672C271.981 79.1817 266.406 84.0433 263.338 86.7658L263.294 86.7226Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M46.4006 49.2772V45.9497C35.2944 45.9497 23.5617 48.3265 23.5617 61.4205C23.5617 68.0539 26.9972 72.5482 32.896 72.5482C37.2175 72.5482 41.0852 69.8905 43.5268 65.5691C46.5518 60.2537 46.4006 55.2624 46.4006 49.2772ZM61.893 86.7226C60.8775 87.6301 59.4081 87.6949 58.263 87.0899C53.1637 82.8549 52.2561 80.8887 49.4472 76.8481C41.0203 85.4478 35.0567 88.019 24.1234 88.019C11.2023 88.019 1.1333 80.046 1.1333 64.0782C1.1333 51.6108 7.89638 43.1191 17.5116 38.9705C25.852 35.2973 37.4984 34.649 46.4006 33.6335V31.6456C46.4006 27.994 46.6815 23.6725 44.5423 20.5179C42.6625 17.6873 39.0757 16.5205 35.921 16.5205C30.0655 16.5205 24.8365 19.5239 23.5617 25.7468C23.3024 27.1297 22.2868 28.491 20.904 28.5558L5.99494 26.9568C4.74172 26.676 3.35885 25.6604 3.70456 23.7374C7.14012 5.67368 23.4536 0.228627 38.0602 0.228627C45.5363 0.228627 55.3028 2.2165 61.2015 7.87761C68.6777 14.8568 67.9646 24.1695 67.9646 34.3033V58.2442C67.9646 65.4394 70.9464 68.5941 73.7554 72.4834C74.7493 73.8663 74.9654 75.53 73.7122 76.5672C70.5791 79.1817 65.0044 84.0433 61.9362 86.7658L61.893 86.7226Z"
|
||||
fill="#09090b" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_177_125">
|
||||
<rect width="496.978" height="150" fill="#09090b" transform="translate(0.833313 0.0258408)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.0 KiB |
25
client/public/images/brand-logos/dark/google.svg
Normal file
25
client/public/images/brand-logos/dark/google.svg
Normal file
@ -0,0 +1,25 @@
|
||||
<svg width="452" height="151" viewBox="0 0 452 151" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_177_106)">
|
||||
<path
|
||||
d="M193.468 78.927C193.468 100.308 176.742 116.063 156.215 116.063C135.689 116.063 118.962 100.308 118.962 78.927C118.962 57.3955 135.689 41.7911 156.215 41.7911C176.742 41.7911 193.468 57.3955 193.468 78.927ZM177.161 78.927C177.161 65.5661 167.467 56.4244 156.215 56.4244C144.964 56.4244 135.27 65.5661 135.27 78.927C135.27 92.1539 144.964 101.429 156.215 101.429C167.467 101.429 177.161 92.1371 177.161 78.927Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M273.835 78.927C273.835 100.308 257.108 116.063 236.582 116.063C216.055 116.063 199.328 100.308 199.328 78.927C199.328 57.4123 216.055 41.7911 236.582 41.7911C257.108 41.7911 273.835 57.3955 273.835 78.927ZM257.527 78.927C257.527 65.5661 247.833 56.4244 236.582 56.4244C225.33 56.4244 215.636 65.5661 215.636 78.927C215.636 92.1539 225.33 101.429 236.582 101.429C247.833 101.429 257.527 92.1371 257.527 78.927Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M350.852 44.0347V110.705C350.852 138.13 334.678 149.331 315.558 149.331C297.559 149.331 286.727 137.293 282.641 127.448L296.839 121.538C299.368 127.582 305.562 134.714 315.541 134.714C327.78 134.714 335.365 127.163 335.365 112.949V107.608H334.796C331.146 112.111 324.114 116.046 315.24 116.046C296.672 116.046 279.661 99.8723 279.661 79.0609C279.661 58.0987 296.672 41.7911 315.24 41.7911C324.097 41.7911 331.129 45.7257 334.796 50.0956H335.365V44.0514H350.852V44.0347ZM336.52 79.0609C336.52 65.9846 327.797 56.4244 316.696 56.4244C305.445 56.4244 296.019 65.9846 296.019 79.0609C296.019 92.0032 305.445 101.429 316.696 101.429C327.797 101.429 336.52 92.0032 336.52 79.0609Z"
|
||||
fill="#09090b" />
|
||||
<path d="M376.385 4.95665V113.786H360.479V4.95665H376.385Z" fill="#09090b" />
|
||||
<path
|
||||
d="M438.367 91.1493L451.025 99.5877C446.94 105.632 437.095 116.046 420.084 116.046C398.988 116.046 383.233 99.7384 383.233 78.9102C383.233 56.8263 399.122 41.7744 418.259 41.7744C437.53 41.7744 446.957 57.1109 450.037 65.3986L451.728 69.6179L402.085 90.1782C405.886 97.6288 411.796 101.429 420.084 101.429C428.389 101.429 434.148 97.3442 438.367 91.1493ZM399.407 77.7884L432.591 64.009C430.766 59.3712 425.274 56.1398 418.812 56.1398C410.524 56.1398 398.988 63.4565 399.407 77.7884Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M58.7548 69.2663V53.5112H111.847C112.366 56.257 112.634 59.5051 112.634 63.0211C112.634 74.8417 109.402 89.4583 98.9881 99.8724C88.8586 110.42 75.9163 116.046 58.7715 116.046C26.9935 116.046 0.271729 90.1615 0.271729 58.3834C0.271729 26.6053 26.9935 0.72068 58.7715 0.72068C76.3516 0.72068 88.8753 7.61877 98.2849 16.6097L87.1676 27.7271C80.4202 21.3982 71.2785 16.4758 58.7548 16.4758C35.5491 16.4758 17.3997 35.1776 17.3997 58.3834C17.3997 81.5891 35.5491 100.291 58.7548 100.291C73.8067 100.291 82.3791 94.2467 87.8708 88.755C92.3244 84.3014 95.2544 77.9391 96.4097 69.2495L58.7548 69.2663Z"
|
||||
fill="#09090b" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_177_106">
|
||||
<rect width="451.667" height="150" fill="#09090b" transform="translate(0.166702 0.0258408)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
15
client/public/images/brand-logos/dark/postman.svg
Normal file
15
client/public/images/brand-logos/dark/postman.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.6 KiB |
12
client/public/images/brand-logos/dark/twilio.svg
Normal file
12
client/public/images/brand-logos/dark/twilio.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<svg width="500" height="151" viewBox="0 0 500 151" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_177_123)">
|
||||
<path
|
||||
d="M72.4341 56.5258C72.4341 65.0258 65.4341 72.0258 56.9341 72.0258C48.4341 72.0258 41.4341 65.0258 41.4341 56.5258C41.4341 48.0258 48.4341 41.0258 56.9341 41.0258C65.4341 41.0258 72.4341 48.0258 72.4341 56.5258ZM56.9341 78.0258C48.4341 78.0258 41.4341 85.0258 41.4341 93.5258C41.4341 102.026 48.4341 109.026 56.9341 109.026C65.4341 109.026 72.4341 102.026 72.4341 93.5258C72.4341 85.0258 65.4341 78.0258 56.9341 78.0258ZM150.434 75.0258C150.434 116.526 116.934 150.026 75.4341 150.026C33.9341 150.026 0.434082 116.526 0.434082 75.0258C0.434082 33.5258 33.9341 0.0258408 75.4341 0.0258408C116.934 0.0258408 150.434 33.5258 150.434 75.0258ZM130.434 75.0258C130.434 44.5258 105.934 20.0258 75.4341 20.0258C44.9341 20.0258 20.4341 44.5258 20.4341 75.0258C20.4341 105.526 44.9341 130.026 75.4341 130.026C105.934 130.026 130.434 105.526 130.434 75.0258ZM93.9341 78.0258C85.4341 78.0258 78.4341 85.0258 78.4341 93.5258C78.4341 102.026 85.4341 109.026 93.9341 109.026C102.434 109.026 109.434 102.026 109.434 93.5258C109.434 85.0258 102.434 78.0258 93.9341 78.0258ZM93.9341 41.0258C85.4341 41.0258 78.4341 48.0258 78.4341 56.5258C78.4341 65.0258 85.4341 72.0258 93.9341 72.0258C102.434 72.0258 109.434 65.0258 109.434 56.5258C109.434 48.0258 102.434 41.0258 93.9341 41.0258ZM351.934 29.5258C352.434 29.5258 352.934 30.0258 353.434 30.5258V46.5258C353.434 47.5258 352.434 48.0258 351.934 48.0258H325.434C324.434 48.0258 323.934 47.0258 323.934 46.5258V31.0258C323.934 30.0258 324.934 29.5258 325.434 29.5258H351.934ZM351.434 52.0258H300.434C299.934 52.0258 298.934 52.5258 298.934 53.5258L292.434 78.5258L291.934 80.0258L283.934 53.5258C283.934 53.0258 282.934 52.0258 282.434 52.0258H262.434C261.934 52.0258 260.934 52.5258 260.934 53.5258L253.434 78.5258L252.934 80.0258L252.434 78.5258L249.434 66.0258L246.434 53.5258C246.434 53.0258 245.434 52.0258 244.934 52.0258H204.934V30.5258C204.934 30.0258 203.934 29.0258 202.934 29.5258L177.934 37.5258C176.934 37.5258 176.434 38.0258 176.434 39.0258V52.5258H169.934C169.434 52.5258 168.434 53.0258 168.434 54.0258V73.0258C168.434 73.5258 168.934 74.5258 169.934 74.5258H176.434V98.0258C176.434 114.526 185.434 122.026 201.934 122.026C208.934 122.026 215.434 120.526 219.934 118.026V98.0258C219.934 97.0258 218.934 96.5258 218.434 97.0258C215.934 98.0258 213.434 98.5258 211.434 98.5258C206.934 98.5258 204.434 96.5258 204.434 91.5258V74.5258H218.934C219.434 74.5258 220.434 74.0258 220.434 73.0258V57.0258L239.434 120.026C239.434 120.526 240.434 121.526 240.934 121.526H261.934C262.434 121.526 263.434 121.026 263.434 120.026L272.434 92.0258L276.934 106.526L280.934 120.026C280.934 120.526 281.934 121.526 282.434 121.526H303.434C303.934 121.526 304.934 121.026 304.934 120.026L323.934 57.0258V120.026C323.934 120.526 324.434 121.526 325.434 121.526H350.934C351.434 121.526 352.434 121.026 352.434 120.026V53.5258C352.434 53.0258 351.934 52.0258 351.434 52.0258ZM384.934 29.5258H359.434C358.934 29.5258 357.934 30.0258 357.934 31.0258V119.526C357.934 120.026 358.434 121.026 359.434 121.026H384.934C385.434 121.026 386.434 120.526 386.434 119.526V30.5258C386.434 30.0258 385.934 29.5258 384.934 29.5258ZM418.934 29.5258H392.434C391.934 29.5258 390.934 30.0258 390.934 31.0258V46.5258C390.934 47.0258 391.434 48.0258 392.434 48.0258H418.934C419.434 48.0258 420.434 47.5258 420.434 46.5258V30.5258C420.434 30.0258 419.934 29.5258 418.934 29.5258ZM418.434 52.0258H392.934C392.434 52.0258 391.434 52.5258 391.434 53.5258V119.026C391.434 119.526 391.934 120.526 392.934 120.526H418.434C418.934 120.526 419.934 120.026 419.934 119.026V53.5258C419.934 53.0258 419.434 52.0258 418.434 52.0258ZM498.934 86.0258C498.934 105.026 482.934 121.526 460.434 121.526C438.434 121.526 422.434 105.026 422.434 86.0258C422.434 67.0258 438.434 50.5258 460.934 50.5258C482.934 50.5258 498.934 67.0258 498.934 86.0258ZM471.934 86.5258C471.934 79.5258 466.934 74.0258 460.934 74.5258C454.434 74.5258 449.934 80.0258 449.934 86.5258C449.934 93.0258 454.934 98.5258 460.934 98.5258C467.434 98.5258 471.934 93.0258 471.934 86.5258Z"
|
||||
fill="#09090b" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_177_123">
|
||||
<rect width="499" height="150" fill="#09090b" transform="translate(0.434082 0.0258408)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.3 KiB |
14
client/public/images/brand-logos/dark/zalando.svg
Normal file
14
client/public/images/brand-logos/dark/zalando.svg
Normal file
@ -0,0 +1,14 @@
|
||||
<svg width="781" height="151" viewBox="0 0 781 151" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M324.116 41.9481C318.271 38.7333 309.581 37.1694 297.548 37.1651C281.083 37.1712 265.8 40.5866 260.015 42.7425C258.709 43.1615 257.312 44.289 257.289 46.2185L257.293 46.644L258.913 54.8322L258.953 54.9846C259.461 56.6518 260.849 57.3995 262.114 57.3995H262.12C262.527 57.3821 262.844 57.3037 263.138 57.2286L265.879 56.5887C273.051 54.793 283.891 52.0811 295.996 52.0811C303.339 52.0811 308.275 52.721 311.584 54.1183C316.953 56.1512 316.987 59.6218 317.041 65.3668V73.9599C316.426 73.949 315.388 73.9381 313.789 73.9381C307.86 73.9381 296.203 74.2134 284.738 76.0515C267.242 78.7385 252.766 82.9262 252.857 107.032C252.864 137.632 281.246 137.69 294.886 137.718H294.888C304.147 137.716 312.69 136.349 318.269 135.195C331.002 132.238 334.253 128.195 334.082 115.543V64.6594C334.101 56.8989 334.124 47.2404 324.116 41.9481ZM317.126 120.552C310.349 122.752 302.934 123.865 295.081 123.865V124.58L295.072 123.865C282.524 123.769 270.27 122.334 270.254 106.329C270.335 93.599 277.127 92.0841 285.724 90.1644L286.321 90.0316C293.969 88.397 313.167 88.0901 317.128 88.0444L317.126 120.552ZM475.964 64.6594V115.543C476.134 128.195 472.883 132.238 460.151 135.195C454.571 136.349 446.028 137.716 436.768 137.718C423.129 137.69 394.745 137.632 394.738 107.032C394.647 82.9262 409.124 78.7385 426.619 76.0515C438.084 74.2134 449.742 73.9381 455.669 73.9381C457.269 73.9381 458.306 73.949 458.922 73.9599V65.3668C458.868 59.6218 458.834 56.1512 453.466 54.1183C450.156 52.721 445.22 52.0811 437.877 52.0811C425.771 52.0811 414.932 54.793 407.76 56.5887L405.02 57.2286C404.725 57.3038 404.408 57.3821 404 57.3995H403.995C402.73 57.3995 401.342 56.6518 400.834 54.9846L400.794 54.8322L399.174 46.644L399.17 46.2185C399.193 44.289 400.59 43.1615 401.896 42.7425C407.679 40.5866 422.964 37.1716 439.429 37.1651C451.462 37.1694 460.152 38.7333 465.997 41.9481C476.004 47.2404 475.982 56.8989 475.964 64.6594ZM459.009 88.0444C455.048 88.0901 435.85 88.397 428.201 90.0316L427.606 90.1644C419.008 92.0841 412.216 93.599 412.136 106.329C412.151 122.334 424.405 123.769 436.953 123.865L436.963 124.58V123.865C444.816 123.865 452.23 122.752 459.007 120.552L459.009 88.0444ZM732.972 37.1651C693.446 37.2183 690.094 63.1891 690.057 87.5318C690.094 111.785 693.446 137.665 732.972 137.718H732.975C772.471 137.665 775.838 111.855 775.893 87.5286C775.852 62.0737 772.501 37.2184 732.972 37.1651ZM732.974 123.51C709 123.405 707.795 111.099 707.632 87.5362C707.795 63.8443 708.998 51.476 732.971 51.3715C756.951 51.476 758.152 63.8443 758.315 87.5253C758.152 111.099 756.947 123.405 732.974 123.51ZM662.037 134.136L661.004 134.398C655.477 135.799 647.904 137.718 634.631 137.718H634.602C598.02 137.665 590.841 119.212 590.801 87.3544C590.845 50.8154 602.428 37.214 633.536 37.1651C644.511 37.1651 652.072 38.5842 657.497 39.8945L657.464 10.4641C657.419 9.17337 658.003 7.48327 661.058 6.90104L670.774 4.42302H671.304C673.536 4.47857 674.326 6.4679 674.331 8.15365V118.735C674.481 125.717 673.659 131.708 662.037 134.136ZM657.473 54.0574C654.229 53.2325 645.173 51.1941 634.976 51.1941C616.247 51.366 608.392 56.4538 608.196 87.5351C608.416 121.664 618.578 123.508 635.144 123.688L635.154 124.403V123.688C645.464 123.688 654.31 121.538 657.465 120.669L657.473 54.0574ZM570.156 135.413H561.466C559.138 135.409 557.383 133.651 557.377 131.324V65.7216C557.22 54.6244 553.904 51.538 541.954 51.3715C528.435 51.3715 514.751 54.7637 510.237 55.9934V131.322C510.233 133.69 508.589 135.41 506.327 135.413H497.461C495.132 135.409 493.374 133.651 493.371 131.324V57.7434C493.242 50.9329 493.882 46.225 503.57 43.0897C512.844 39.8869 530.595 37.1716 542.319 37.1651C564.666 37.1934 574.211 45.2554 574.241 64.1251V131.322C574.238 133.651 572.481 135.41 570.156 135.413ZM373.331 137.186H373.338C378.332 137.088 382.026 136.101 383.472 134.477C383.986 133.901 384.223 133.236 384.159 132.58C384.125 132.04 384.125 132.04 382.755 125.623L382.723 125.469C382.426 123.791 381.228 123.028 380.241 123.028C380.149 123.028 380.059 123.034 380.107 123.04C380.107 123.04 378.853 122.979 377.614 122.979H377.602C374.043 122.866 371.092 122.348 371.031 117.139V8.15478C371.028 6.33731 369.932 4.47308 367.828 4.42302L367.208 4.42825L357.475 6.92259C355.817 7.09236 354.091 8.27097 354.165 10.4617V117.494C354.183 130.169 360.986 137.163 373.323 137.186L373.331 137.186ZM235.87 135.413H166.139C163.811 135.409 162.054 133.651 162.049 131.324V122.812C162.001 120.726 162.67 119.796 163.955 118.204L219.457 53.6776H165.076C162.747 53.6723 160.989 51.9145 160.986 49.5889V43.5598C160.99 41.2331 162.747 39.4755 165.075 39.4711H235.515C237.842 39.4755 239.599 41.2331 239.604 43.5587V52.2476C239.637 53.818 239.093 55.15 237.839 56.5474L182.197 121.204H235.869C238.196 121.211 239.954 122.967 239.958 125.294V131.322C239.954 133.651 238.196 135.41 235.87 135.413Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M22.3275 28.7189C10.2759 28.7189 4.07923 61.6253 4.72458 92.5194C4.7073 92.5151 4.68744 92.5238 4.67017 92.5194C5.31443 119.636 11.3109 145.628 23.1982 145.628C68.8157 145.628 120.79 102.608 120.79 87.1868C120.79 83.3289 116.86 75.9057 111.594 70.0464C111.587 70.0504 111.573 70.0424 111.567 70.0464C111.209 69.6307 110.829 69.216 110.451 68.7949C94.2009 50.6641 60.4881 28.7189 22.3275 28.7189Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M4.71592 92.5183C38.9903 100.567 75.5815 91.5062 111.031 70.3783C111.21 70.2717 111.388 70.165 111.567 70.0573C111.209 69.6416 110.842 69.2226 110.464 68.8014C94.214 50.6706 60.4806 28.7211 22.32 28.7211C10.2683 28.7211 4.07056 61.6242 4.71592 92.5183ZM111.567 70.0573C111.575 70.0538 111.581 70.0495 111.587 70.0454L111.567 70.0573Z"
|
||||
fill="#09090b" />
|
||||
<path
|
||||
d="M4.68018 92.5107C5.32444 119.627 11.323 145.629 23.2103 145.629C68.8279 145.629 120.798 102.621 120.798 87.1999C120.798 83.3419 116.854 75.9046 111.588 70.0453C75.9539 91.4181 39.1461 100.616 4.68018 92.5107Z"
|
||||
fill="#09090b" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.9 KiB |
33
client/public/images/brand-logos/light/amazon.svg
Normal file
33
client/public/images/brand-logos/light/amazon.svg
Normal file
@ -0,0 +1,33 @@
|
||||
<svg width="498" height="151" viewBox="0 0 498 151" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_177_125)">
|
||||
<path
|
||||
d="M309.08 117.21C280.235 138.472 238.425 149.816 202.427 149.816C151.952 149.816 106.512 131.147 72.1348 100.098C69.4339 97.6559 71.8539 94.3284 75.095 96.2298C112.195 117.815 158.067 130.801 205.452 130.801C237.409 130.801 272.564 124.19 304.889 110.469C309.772 108.395 313.856 113.667 309.08 117.21Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M321.072 103.49C317.399 98.7795 296.699 101.264 287.408 102.366C284.578 102.712 284.146 100.249 286.695 98.477C303.182 86.8739 330.234 90.223 333.389 94.1123C336.543 98.0232 332.567 125.14 317.075 138.083C314.698 140.071 312.429 139.012 313.488 136.376C316.967 127.69 324.767 108.222 321.072 103.49Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M288.057 16.5637V5.28474C288.057 3.57776 289.353 2.43258 290.909 2.43258H341.405C343.025 2.43258 344.322 3.59937 344.322 5.28474V14.9432C344.3 16.5637 342.939 18.6813 340.519 22.0304L314.353 59.3894C324.076 59.1517 334.339 60.5994 343.155 65.5691C345.143 66.6926 345.683 68.3348 345.834 69.9554V81.9906C345.834 83.6328 344.019 85.5558 342.118 84.5619C326.582 76.4159 305.947 75.53 288.77 84.6483C287.019 85.599 285.183 83.6976 285.183 82.0554V70.6252C285.183 68.7886 285.204 65.6555 287.041 62.8682L317.356 19.3943H290.974C289.353 19.3943 288.057 18.2491 288.057 16.5637Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M103.854 86.9387H88.4916C87.0223 86.8307 85.8555 85.7287 85.7474 84.3242V5.47922C85.7474 3.90188 87.0655 2.64865 88.7076 2.64865H103.033C104.524 2.71343 105.713 3.85866 105.821 5.28474V15.5914H106.102C109.84 5.63045 116.862 0.984887 126.326 0.984887C135.941 0.984887 141.948 5.63045 146.269 15.5914C149.986 5.63045 158.434 0.984887 167.488 0.984887C173.927 0.984887 180.971 3.64258 185.271 9.60619C190.132 16.2396 189.138 25.8765 189.138 34.3249L189.117 84.0865C189.117 85.6639 187.799 86.9387 186.157 86.9387H170.815C169.281 86.8307 168.05 85.599 168.05 84.0865V42.298C168.05 38.9705 168.352 30.6733 167.617 27.5186C166.472 22.2249 163.037 20.7339 158.586 20.7339C154.869 20.7339 150.98 23.2188 149.403 27.1945C147.825 31.1703 147.976 37.8253 147.976 42.298V84.0865C147.976 85.6639 146.658 86.9387 145.016 86.9387H129.675C128.119 86.8307 126.909 85.599 126.909 84.0865L126.888 42.298C126.888 33.5039 128.335 20.5611 117.424 20.5611C106.382 20.5611 106.815 33.1797 106.815 42.298V84.0865C106.815 85.6639 105.496 86.9387 103.854 86.9387Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M387.796 0.984887C410.591 0.984887 422.929 20.5611 422.929 45.4527C422.929 69.5016 409.295 88.5808 387.796 88.5808C365.411 88.5808 353.224 69.0046 353.224 44.61C353.224 20.0641 365.562 0.984887 387.796 0.984887ZM387.925 17.0823C376.603 17.0823 375.89 32.5099 375.89 42.1252C375.89 51.762 375.739 72.3322 387.796 72.3322C399.701 72.3322 400.263 55.7378 400.263 45.6255C400.263 38.9705 399.982 31.019 397.973 24.7097C396.244 19.2215 392.809 17.0823 387.925 17.0823Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M452.488 86.9387H437.19C435.656 86.8307 434.424 85.599 434.424 84.0865L434.403 5.21991C434.532 3.77223 435.807 2.64865 437.363 2.64865H451.602C452.942 2.71343 454.044 3.62098 454.346 4.8526V16.9095H454.627C458.927 6.12742 464.955 0.984887 475.565 0.984887C482.457 0.984887 489.177 3.46973 493.499 10.276C497.518 16.5853 497.518 27.1945 497.518 34.8219V84.4539C497.345 85.8367 496.07 86.9387 494.557 86.9387H479.151C477.747 86.8307 476.58 85.7935 476.429 84.4539V41.6282C476.429 33.0069 477.423 20.3882 466.814 20.3882C463.076 20.3882 459.64 22.8947 457.933 26.6976C455.772 31.516 455.491 36.3128 455.491 41.6282V84.0865C455.47 85.6639 454.13 86.9387 452.488 86.9387Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M247.802 49.2772V45.9497C236.696 45.9497 224.963 48.3265 224.963 61.4205C224.963 68.0539 228.399 72.5482 234.297 72.5482C238.619 72.5482 242.487 69.8905 244.928 65.5691C247.953 60.2537 247.802 55.2624 247.802 49.2772ZM263.294 86.7226C262.279 87.6301 260.81 87.6949 259.664 87.0899C254.565 82.8549 253.658 80.8887 250.849 76.8481C242.422 85.4478 236.458 88.019 225.525 88.019C212.604 88.019 202.535 80.046 202.535 64.0782C202.535 51.6108 209.298 43.1191 218.913 38.9705C227.254 35.2973 238.9 34.649 247.802 33.6335V31.6456C247.802 27.994 248.083 23.6725 245.944 20.5179C244.064 17.6873 240.477 16.5205 237.323 16.5205C231.467 16.5205 226.238 19.5239 224.963 25.7468C224.704 27.1297 223.688 28.491 222.305 28.5558L207.396 26.9568C206.143 26.676 204.76 25.6604 205.106 23.7374C208.542 5.67368 224.855 0.228627 239.462 0.228627C246.938 0.228627 256.704 2.2165 262.603 7.87761C270.079 14.8568 269.366 24.1695 269.366 34.3033V58.2442C269.366 65.4394 272.348 68.5941 275.157 72.4834C276.151 73.8663 276.367 75.53 275.114 76.5672C271.981 79.1817 266.406 84.0433 263.338 86.7658L263.294 86.7226Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M46.4006 49.2772V45.9497C35.2944 45.9497 23.5617 48.3265 23.5617 61.4205C23.5617 68.0539 26.9972 72.5482 32.896 72.5482C37.2175 72.5482 41.0852 69.8905 43.5268 65.5691C46.5518 60.2537 46.4006 55.2624 46.4006 49.2772ZM61.893 86.7226C60.8775 87.6301 59.4081 87.6949 58.263 87.0899C53.1637 82.8549 52.2561 80.8887 49.4472 76.8481C41.0203 85.4478 35.0567 88.019 24.1234 88.019C11.2023 88.019 1.1333 80.046 1.1333 64.0782C1.1333 51.6108 7.89638 43.1191 17.5116 38.9705C25.852 35.2973 37.4984 34.649 46.4006 33.6335V31.6456C46.4006 27.994 46.6815 23.6725 44.5423 20.5179C42.6625 17.6873 39.0757 16.5205 35.921 16.5205C30.0655 16.5205 24.8365 19.5239 23.5617 25.7468C23.3024 27.1297 22.2868 28.491 20.904 28.5558L5.99494 26.9568C4.74172 26.676 3.35885 25.6604 3.70456 23.7374C7.14012 5.67368 23.4536 0.228627 38.0602 0.228627C45.5363 0.228627 55.3028 2.2165 61.2015 7.87761C68.6777 14.8568 67.9646 24.1695 67.9646 34.3033V58.2442C67.9646 65.4394 70.9464 68.5941 73.7554 72.4834C74.7493 73.8663 74.9654 75.53 73.7122 76.5672C70.5791 79.1817 65.0044 84.0433 61.9362 86.7658L61.893 86.7226Z"
|
||||
fill="#fafafa" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_177_125">
|
||||
<rect width="496.978" height="150" fill="#fafafa" transform="translate(0.833313 0.0258408)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.0 KiB |
25
client/public/images/brand-logos/light/google.svg
Normal file
25
client/public/images/brand-logos/light/google.svg
Normal file
@ -0,0 +1,25 @@
|
||||
<svg width="452" height="151" viewBox="0 0 452 151" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_177_106)">
|
||||
<path
|
||||
d="M193.468 78.927C193.468 100.308 176.742 116.063 156.215 116.063C135.689 116.063 118.962 100.308 118.962 78.927C118.962 57.3955 135.689 41.7911 156.215 41.7911C176.742 41.7911 193.468 57.3955 193.468 78.927ZM177.161 78.927C177.161 65.5661 167.467 56.4244 156.215 56.4244C144.964 56.4244 135.27 65.5661 135.27 78.927C135.27 92.1539 144.964 101.429 156.215 101.429C167.467 101.429 177.161 92.1371 177.161 78.927Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M273.835 78.927C273.835 100.308 257.108 116.063 236.582 116.063C216.055 116.063 199.328 100.308 199.328 78.927C199.328 57.4123 216.055 41.7911 236.582 41.7911C257.108 41.7911 273.835 57.3955 273.835 78.927ZM257.527 78.927C257.527 65.5661 247.833 56.4244 236.582 56.4244C225.33 56.4244 215.636 65.5661 215.636 78.927C215.636 92.1539 225.33 101.429 236.582 101.429C247.833 101.429 257.527 92.1371 257.527 78.927Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M350.852 44.0347V110.705C350.852 138.13 334.678 149.331 315.558 149.331C297.559 149.331 286.727 137.293 282.641 127.448L296.839 121.538C299.368 127.582 305.562 134.714 315.541 134.714C327.78 134.714 335.365 127.163 335.365 112.949V107.608H334.796C331.146 112.111 324.114 116.046 315.24 116.046C296.672 116.046 279.661 99.8723 279.661 79.0609C279.661 58.0987 296.672 41.7911 315.24 41.7911C324.097 41.7911 331.129 45.7257 334.796 50.0956H335.365V44.0514H350.852V44.0347ZM336.52 79.0609C336.52 65.9846 327.797 56.4244 316.696 56.4244C305.445 56.4244 296.019 65.9846 296.019 79.0609C296.019 92.0032 305.445 101.429 316.696 101.429C327.797 101.429 336.52 92.0032 336.52 79.0609Z"
|
||||
fill="#fafafa" />
|
||||
<path d="M376.385 4.95665V113.786H360.479V4.95665H376.385Z" fill="#fafafa" />
|
||||
<path
|
||||
d="M438.367 91.1493L451.025 99.5877C446.94 105.632 437.095 116.046 420.084 116.046C398.988 116.046 383.233 99.7384 383.233 78.9102C383.233 56.8263 399.122 41.7744 418.259 41.7744C437.53 41.7744 446.957 57.1109 450.037 65.3986L451.728 69.6179L402.085 90.1782C405.886 97.6288 411.796 101.429 420.084 101.429C428.389 101.429 434.148 97.3442 438.367 91.1493ZM399.407 77.7884L432.591 64.009C430.766 59.3712 425.274 56.1398 418.812 56.1398C410.524 56.1398 398.988 63.4565 399.407 77.7884Z"
|
||||
fill="#fafafa" />
|
||||
<path
|
||||
d="M58.7548 69.2663V53.5112H111.847C112.366 56.257 112.634 59.5051 112.634 63.0211C112.634 74.8417 109.402 89.4583 98.9881 99.8724C88.8586 110.42 75.9163 116.046 58.7715 116.046C26.9935 116.046 0.271729 90.1615 0.271729 58.3834C0.271729 26.6053 26.9935 0.72068 58.7715 0.72068C76.3516 0.72068 88.8753 7.61877 98.2849 16.6097L87.1676 27.7271C80.4202 21.3982 71.2785 16.4758 58.7548 16.4758C35.5491 16.4758 17.3997 35.1776 17.3997 58.3834C17.3997 81.5891 35.5491 100.291 58.7548 100.291C73.8067 100.291 82.3791 94.2467 87.8708 88.755C92.3244 84.3014 95.2544 77.9391 96.4097 69.2495L58.7548 69.2663Z"
|
||||
fill="#fafafa" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_177_106">
|
||||
<rect width="451.667" height="150" fill="#fafafa" transform="translate(0.166702 0.0258408)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
15
client/public/images/brand-logos/light/postman.svg
Normal file
15
client/public/images/brand-logos/light/postman.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.6 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user