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

Feature: Toggle Page Size between ISO A4 and US Letter

Browse Source
This commit is contained in:
Amruth Pillai
2022-10-15 00:54:59 +02:00
parent 136e143e12
commit f0f552a635
38 changed files with 903 additions and 783 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
client/templates/Castform/Castform.tsx
View File

@ -1,5 +1,5 @@
import { css } from '@emotion/css';
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import clsx from 'clsx';
import get from 'lodash/get';
import { useMemo } from 'react';
@ -17,7 +17,7 @@ const Castform: React.FC<PageProps> = ({ page }) => {
const isFirstPage = useMemo(() => page === 0, [page]);
const layout: string[][] = useAppSelector((state) => state.resume.present.metadata.layout[page]);
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const contrast = useMemo(() => getContrastColor(theme.primary), [theme.primary]);
const color = useMemo(() => (contrast === 'dark' ? theme.text : theme.background), [theme, contrast]);

4
client/templates/Castform/widgets/Heading.tsx
View File

@ -1,12 +1,12 @@
import { darken } from '@mui/material';
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import { useMemo } from 'react';
import { useAppSelector } from '@/store/hooks';
const Heading: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const darkerPrimary = useMemo(() => darken(theme.primary, 0.2), [theme.primary]);
return (

4
client/templates/Castform/widgets/Masthead.tsx
View File

@ -1,6 +1,6 @@
import { css } from '@emotion/css';
import { Cake, Email, Phone, Public, Room } from '@mui/icons-material';
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import clsx from 'clsx';
import get from 'lodash/get';
import isEmpty from 'lodash/isEmpty';
@ -19,7 +19,7 @@ export const MastheadSidebar: React.FC = () => {
const { name, headline, photo, email, phone, birthdate, website, location, profiles } = useAppSelector(
(state) => state.resume.present.basics
);
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const contrast = useMemo(() => getContrastColor(theme.primary), [theme.primary]);
const color = useMemo(() => (contrast === 'dark' ? theme.text : theme.background), [theme, contrast]);

4
client/templates/Gengar/Gengar.tsx
View File

@ -1,6 +1,6 @@
import { css } from '@emotion/css';
import { alpha } from '@mui/material';
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import clsx from 'clsx';
import get from 'lodash/get';
import { useMemo } from 'react';
@ -18,7 +18,7 @@ const Gengar: React.FC<PageProps> = ({ page }) => {
const isFirstPage = useMemo(() => page === 0, [page]);
const layout: string[][] = useAppSelector((state) => state.resume.present.metadata.layout[page]);
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const contrast = useMemo(() => getContrastColor(theme.primary), [theme.primary]);
const backgroundColor: string = useMemo(() => alpha(theme.primary, 0.15), [theme.primary]);
const color = useMemo(() => (contrast === 'dark' ? theme.text : theme.background), [theme, contrast]);

4
client/templates/Gengar/widgets/Heading.tsx
View File

@ -1,10 +1,10 @@
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import { useAppSelector } from '@/store/hooks';
const Heading: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
return (
<h3

4
client/templates/Gengar/widgets/Masthead.tsx
View File

@ -1,7 +1,7 @@
import { css } from '@emotion/css';
import { Cake, Email, Phone, Public, Room } from '@mui/icons-material';
import { alpha } from '@mui/material';
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import clsx from 'clsx';
import get from 'lodash/get';
import isEmpty from 'lodash/isEmpty';
@ -20,7 +20,7 @@ export const MastheadSidebar: React.FC = () => {
const { name, headline, photo, email, phone, birthdate, website, location, profiles } = useAppSelector(
(state) => state.resume.present.basics
);
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const contrast = useMemo(() => getContrastColor(theme.primary), [theme.primary]);
const iconColor = useMemo(() => (contrast === 'dark' ? theme.text : theme.background), [theme, contrast]);

4
client/templates/Glalie/widgets/BadgeDisplay.tsx
View File

@ -1,5 +1,5 @@
import { alpha } from '@mui/material';
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import isArray from 'lodash/isArray';
import isEmpty from 'lodash/isEmpty';
@ -13,7 +13,7 @@ type Props = {
};
const BadgeDisplay: React.FC<Props> = ({ items }) => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const contrast = useMemo(() => getContrastColor(theme.primary), [theme.primary]);
if (!isArray(items) || isEmpty(items)) return null;

4
client/templates/Glalie/widgets/Heading.tsx
View File

@ -1,10 +1,10 @@
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import { useAppSelector } from '@/store/hooks';
const Heading: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
return (
<h3

4
client/templates/Kakuna/widgets/BadgeDisplay.tsx
View File

@ -1,4 +1,4 @@
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import isArray from 'lodash/isArray';
import isEmpty from 'lodash/isEmpty';
@ -12,7 +12,7 @@ type Props = {
};
const BadgeDisplay: React.FC<Props> = ({ items }) => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const contrast = useMemo(() => getContrastColor(theme.primary), [theme.primary]);
if (!isArray(items) || isEmpty(items)) return null;

4
client/templates/Leafish/widgets/Heading.tsx
View File

@ -1,10 +1,10 @@
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import { useAppSelector } from '@/store/hooks';
const Heading: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
return (
<h2

4
client/templates/Leafish/widgets/Masthead.tsx
View File

@ -1,6 +1,6 @@
import { Cake, Email, Phone, Public, Room } from '@mui/icons-material';
import { alpha } from '@mui/material';
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import isEmpty from 'lodash/isEmpty';
@ -16,7 +16,7 @@ const Masthead: React.FC = () => {
const { name, photo, headline, summary, email, phone, birthdate, website, location, profiles } = useAppSelector(
(state) => state.resume.present.basics
);
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
return (
<div>

4
client/templates/Onyx/widgets/Heading.tsx
View File

@ -1,10 +1,10 @@
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import { useAppSelector } from '@/store/hooks';
const Heading: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
return (
<h4 className="mb-2 font-bold uppercase" style={{ color: theme.primary }}>

4
client/templates/Pikachu/widgets/Heading.tsx
View File

@ -1,10 +1,10 @@
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import { useAppSelector } from '@/store/hooks';
const Heading: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
return (
<h3

4
client/templates/Pikachu/widgets/Masthead.tsx
View File

@ -1,5 +1,5 @@
import { Cake, Email, Phone, Public, Room } from '@mui/icons-material';
import { Theme } from '@reactive-resume/schema';
import { ThemeConfig } from '@reactive-resume/schema';
import get from 'lodash/get';
import isEmpty from 'lodash/isEmpty';
import { useMemo } from 'react';
@ -62,7 +62,7 @@ export const MastheadSidebar: React.FC = () => {
};
export const MastheadMain: React.FC = () => {
const theme: Theme = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const theme: ThemeConfig = useAppSelector((state) => get(state.resume.present, 'metadata.theme', {}));
const contrast = useMemo(() => getContrastColor(theme.primary), [theme.primary]);
const { name, summary, headline } = useAppSelector((state) => state.resume.present.basics);