jsonresume-theme-government-standard 0.2.2 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -0
- package/dist/index.css +1 -0
- package/dist/index.js +112 -55
- package/package.json +3 -3
- package/src/index.jsx +9 -28
- package/dist/style.css +0 -139
- package/src/styles.js +0 -212
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# jsonresume-theme-government-standard
|
|
2
2
|
|
|
3
|
+
## 0.2.4
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- @jsonresume/core@0.3.2
|
|
8
|
+
|
|
9
|
+
## 0.2.3
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- c621133: use @jsonresume/core/ssr renderResumeDocument
|
|
14
|
+
- Updated dependencies [ff09f75]
|
|
15
|
+
- @jsonresume/core@0.3.1
|
|
16
|
+
|
|
3
17
|
## 0.2.2
|
|
4
18
|
|
|
5
19
|
### Patch Changes
|
package/dist/index.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{--resume-font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;--resume-font-serif: Cambria, Georgia, "Times New Roman", serif;--resume-font-mono: "Courier New", Courier, monospace;--resume-size-name: 36px;--resume-size-heading: 16px;--resume-size-subheading: 14px;--resume-size-body: 11px;--resume-size-small: 10px;--resume-weight-normal: 400;--resume-weight-medium: 500;--resume-weight-semibold: 600;--resume-weight-bold: 700;--resume-line-height-tight: 1.2;--resume-line-height-normal: 1.5;--resume-line-height-relaxed: 1.75;--resume-color-primary: #1a1a1a;--resume-color-secondary: #4a4a4a;--resume-color-accent: #2563eb;--resume-color-background: #ffffff;--resume-color-border: #e5e7eb;--resume-space-section: 24px;--resume-space-item: 16px;--resume-space-tight: 8px;--resume-space-margin: 48px;--resume-max-width: 660px;--resume-column-gap: 24px;--resume-radius-sm: 4px;--resume-radius-md: 8px;--resume-radius-lg: 12px;--resume-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--resume-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1)}[data-theme=modern]{--resume-color-primary: #0f172a;--resume-color-secondary: #475569;--resume-color-accent: #8b5cf6;--resume-font-sans: "Inter", -apple-system, BlinkMacSystemFont, sans-serif}[data-theme=classic]{--resume-color-primary: #000000;--resume-color-secondary: #333333;--resume-color-accent: #0066cc;--resume-font-sans: Georgia, "Times New Roman", serif}[data-theme=minimal]{--resume-color-primary: #18181b;--resume-color-secondary: #71717a;--resume-color-accent: #000000;--resume-space-section: 32px;--resume-space-item: 20px}[data-theme=high-contrast]{--resume-color-primary: #000000;--resume-color-secondary: #000000;--resume-color-accent: #0000ff;--resume-color-background: #ffffff;--resume-color-border: #000000}@media print{:root{--resume-space-section: 18px;--resume-space-item: 12px}@page{size:A4;margin:.5in}.resume-section{page-break-inside:avoid}.resume-item{break-inside:avoid}p,li{widows:3;orphans:3}.resume-description{hyphens:auto}.no-print{display:none!important}}[dir=rtl]{text-align:right}[dir=rtl] .resume-item{padding-left:0;padding-right:var(--resume-space-tight)}
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { renderToStaticMarkup } from "react-dom/server";
|
|
2
3
|
import o, { useRef, useContext, useState, useMemo, useEffect, useDebugValue, createElement, createContext } from "react";
|
|
3
|
-
import { renderToString } from "react-dom/server";
|
|
4
4
|
var __assign = function() {
|
|
5
5
|
__assign = Object.assign || function __assign2(t) {
|
|
6
6
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
@@ -41,38 +41,46 @@ var isPropValid = /* @__PURE__ */ memoize(
|
|
|
41
41
|
function getDefaultExportFromCjs(x2) {
|
|
42
42
|
return x2 && x2.__esModule && Object.prototype.hasOwnProperty.call(x2, "default") ? x2["default"] : x2;
|
|
43
43
|
}
|
|
44
|
-
var shallowequal
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
return false;
|
|
59
|
-
}
|
|
60
|
-
var bHasOwnProperty = Object.prototype.hasOwnProperty.bind(objB);
|
|
61
|
-
for (var idx = 0; idx < keysA.length; idx++) {
|
|
62
|
-
var key = keysA[idx];
|
|
63
|
-
if (!bHasOwnProperty(key)) {
|
|
44
|
+
var shallowequal;
|
|
45
|
+
var hasRequiredShallowequal;
|
|
46
|
+
function requireShallowequal() {
|
|
47
|
+
if (hasRequiredShallowequal) return shallowequal;
|
|
48
|
+
hasRequiredShallowequal = 1;
|
|
49
|
+
shallowequal = function shallowEqual(objA, objB, compare, compareContext) {
|
|
50
|
+
var ret = compare ? compare.call(compareContext, objA, objB) : void 0;
|
|
51
|
+
if (ret !== void 0) {
|
|
52
|
+
return !!ret;
|
|
53
|
+
}
|
|
54
|
+
if (objA === objB) {
|
|
55
|
+
return true;
|
|
56
|
+
}
|
|
57
|
+
if (typeof objA !== "object" || !objA || typeof objB !== "object" || !objB) {
|
|
64
58
|
return false;
|
|
65
59
|
}
|
|
66
|
-
var
|
|
67
|
-
var
|
|
68
|
-
|
|
69
|
-
if (ret === false || ret === void 0 && valueA !== valueB) {
|
|
60
|
+
var keysA = Object.keys(objA);
|
|
61
|
+
var keysB = Object.keys(objB);
|
|
62
|
+
if (keysA.length !== keysB.length) {
|
|
70
63
|
return false;
|
|
71
64
|
}
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
65
|
+
var bHasOwnProperty = Object.prototype.hasOwnProperty.bind(objB);
|
|
66
|
+
for (var idx = 0; idx < keysA.length; idx++) {
|
|
67
|
+
var key = keysA[idx];
|
|
68
|
+
if (!bHasOwnProperty(key)) {
|
|
69
|
+
return false;
|
|
70
|
+
}
|
|
71
|
+
var valueA = objA[key];
|
|
72
|
+
var valueB = objB[key];
|
|
73
|
+
ret = compare ? compare.call(compareContext, valueA, valueB, key) : void 0;
|
|
74
|
+
if (ret === false || ret === void 0 && valueA !== valueB) {
|
|
75
|
+
return false;
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
return true;
|
|
79
|
+
};
|
|
80
|
+
return shallowequal;
|
|
81
|
+
}
|
|
82
|
+
var shallowequalExports = requireShallowequal();
|
|
83
|
+
const p = /* @__PURE__ */ getDefaultExportFromCjs(shallowequalExports);
|
|
76
84
|
var MS = "-ms-";
|
|
77
85
|
var MOZ = "-moz-";
|
|
78
86
|
var WEBKIT = "-webkit-";
|
|
@@ -1300,6 +1308,66 @@ var vt = /^\s*<\/[a-z]/i, gt = (function() {
|
|
|
1300
1308
|
"production" !== process.env.NODE_ENV && "undefined" != typeof navigator && "ReactNative" === navigator.product && console.warn("It looks like you've imported 'styled-components' on React Native.\nPerhaps you're looking to import 'styled-components/native'?\nRead more about this at https://www.styled-components.com/docs/basics#react-native");
|
|
1301
1309
|
var wt = "__sc-".concat(f, "__");
|
|
1302
1310
|
"production" !== process.env.NODE_ENV && "test" !== process.env.NODE_ENV && "undefined" != typeof window && (window[wt] || (window[wt] = 0), 1 === window[wt] && console.warn("It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.\n\nSee https://s-c.sh/2BAXzed for more info."), window[wt] += 1);
|
|
1311
|
+
const CSS_RESET = "<style>*,*::before,*::after{box-sizing:border-box}html,body{margin:0;padding:0}body{-webkit-font-smoothing:antialiased}</style>";
|
|
1312
|
+
const TOKENS_CSS_HREF = "https://unpkg.com/@jsonresume/core/dist/tokens.css";
|
|
1313
|
+
const FONTS_PRECONNECT = '<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>';
|
|
1314
|
+
function isHref(value) {
|
|
1315
|
+
return /^(https?:)?\/\//.test(value) || value.trim().startsWith("<link");
|
|
1316
|
+
}
|
|
1317
|
+
function familyParam(family) {
|
|
1318
|
+
const [name, ...rest] = String(family).split(":");
|
|
1319
|
+
const encodedName = name.trim().replace(/\s+/g, "+");
|
|
1320
|
+
return rest.length ? `${encodedName}:${rest.join(":")}` : encodedName;
|
|
1321
|
+
}
|
|
1322
|
+
function googleFontsLinks(families) {
|
|
1323
|
+
if (!Array.isArray(families) || families.length === 0) return "";
|
|
1324
|
+
const passthrough = [];
|
|
1325
|
+
const names = [];
|
|
1326
|
+
for (const entry of families) {
|
|
1327
|
+
if (entry == null || entry === "") continue;
|
|
1328
|
+
if (isHref(entry)) passthrough.push(entry);
|
|
1329
|
+
else names.push(entry);
|
|
1330
|
+
}
|
|
1331
|
+
const links = passthrough.map(
|
|
1332
|
+
(href) => href.trim().startsWith("<link") ? href : `<link href="${href}" rel="stylesheet">`
|
|
1333
|
+
);
|
|
1334
|
+
if (names.length > 0) {
|
|
1335
|
+
const query = names.map(familyParam).join("&family=");
|
|
1336
|
+
links.unshift(
|
|
1337
|
+
`<link href="https://fonts.googleapis.com/css2?family=${query}&display=swap" rel="stylesheet">`
|
|
1338
|
+
);
|
|
1339
|
+
}
|
|
1340
|
+
if (links.length === 0) return "";
|
|
1341
|
+
return FONTS_PRECONNECT + links.join("");
|
|
1342
|
+
}
|
|
1343
|
+
function renderResumeDocument(element, options = {}) {
|
|
1344
|
+
const {
|
|
1345
|
+
fonts,
|
|
1346
|
+
title,
|
|
1347
|
+
lang = "en",
|
|
1348
|
+
dir = "ltr",
|
|
1349
|
+
reset = false,
|
|
1350
|
+
head = "",
|
|
1351
|
+
headAfterStyles = "",
|
|
1352
|
+
includeTokensCss = true,
|
|
1353
|
+
bodyClass
|
|
1354
|
+
} = options;
|
|
1355
|
+
const sheet = new gt();
|
|
1356
|
+
let html;
|
|
1357
|
+
let styleTags;
|
|
1358
|
+
try {
|
|
1359
|
+
html = renderToStaticMarkup(sheet.collectStyles(element));
|
|
1360
|
+
styleTags = sheet.getStyleTags();
|
|
1361
|
+
} finally {
|
|
1362
|
+
sheet.seal();
|
|
1363
|
+
}
|
|
1364
|
+
const fontLinks = googleFontsLinks(fonts);
|
|
1365
|
+
const tokensLink = includeTokensCss ? `<link rel="stylesheet" href="${TOKENS_CSS_HREF}">` : "";
|
|
1366
|
+
const resetTag = reset ? CSS_RESET : "";
|
|
1367
|
+
const titleTag = title ? `<title>${title}</title>` : "";
|
|
1368
|
+
const bodyAttr = bodyClass ? ` class="${bodyClass}"` : "";
|
|
1369
|
+
return `<!DOCTYPE html><html lang="${lang}" dir="${dir}"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">` + fontLinks + tokensLink + resetTag + head + styleTags + headAfterStyles + titleTag + `</head><body${bodyAttr}>${html}</body></html>`;
|
|
1370
|
+
}
|
|
1303
1371
|
createContext({
|
|
1304
1372
|
theme: "professional",
|
|
1305
1373
|
setTheme: () => {
|
|
@@ -1459,6 +1527,7 @@ function formatDateRange({
|
|
|
1459
1527
|
};
|
|
1460
1528
|
const formatDate = (dateStr) => {
|
|
1461
1529
|
if (!dateStr) return getPresentLabel();
|
|
1530
|
+
const isDateOnlyIso = typeof dateStr === "string" && /^\d{4}(-\d{2}){0,2}$/.test(dateStr);
|
|
1462
1531
|
const date = typeof dateStr === "string" ? new Date(dateStr) : dateStr;
|
|
1463
1532
|
if (isNaN(date.getTime())) return dateStr;
|
|
1464
1533
|
const monthFormats = {
|
|
@@ -1470,6 +1539,9 @@ function formatDateRange({
|
|
|
1470
1539
|
...monthFormats[format],
|
|
1471
1540
|
year: "numeric"
|
|
1472
1541
|
};
|
|
1542
|
+
if (isDateOnlyIso) {
|
|
1543
|
+
options.timeZone = "UTC";
|
|
1544
|
+
}
|
|
1473
1545
|
if (numberingSystem) {
|
|
1474
1546
|
options.numberingSystem = numberingSystem;
|
|
1475
1547
|
}
|
|
@@ -1477,7 +1549,9 @@ function formatDateRange({
|
|
|
1477
1549
|
return formatter.format(date);
|
|
1478
1550
|
};
|
|
1479
1551
|
const start = formatDate(startDate);
|
|
1480
|
-
if (endDate === void 0)
|
|
1552
|
+
if (endDate === void 0) {
|
|
1553
|
+
return start;
|
|
1554
|
+
}
|
|
1481
1555
|
const end = formatDate(endDate);
|
|
1482
1556
|
return `${start} - ${end}`;
|
|
1483
1557
|
}
|
|
@@ -1562,7 +1636,6 @@ function safeUrl(url) {
|
|
|
1562
1636
|
const trimmed = url.trim();
|
|
1563
1637
|
const dangerousProtocols = /^(javascript|data|vbscript|file|about):/i;
|
|
1564
1638
|
if (dangerousProtocols.test(trimmed)) {
|
|
1565
|
-
console.warn(`[Security] Blocked dangerous URL: ${trimmed.slice(0, 50)}`);
|
|
1566
1639
|
return null;
|
|
1567
1640
|
}
|
|
1568
1641
|
const safeProtocols = /^(https?|mailto|tel|sms|ftp):/i;
|
|
@@ -1578,7 +1651,6 @@ function safeUrl(url) {
|
|
|
1578
1651
|
if (/^[a-z0-9][a-z0-9.-]+\.[a-z]{2,}$/i.test(trimmed)) {
|
|
1579
1652
|
return `https://${trimmed}`;
|
|
1580
1653
|
}
|
|
1581
|
-
console.warn(`[Security] Uncertain URL safety: ${trimmed.slice(0, 50)}`);
|
|
1582
1654
|
return trimmed;
|
|
1583
1655
|
}
|
|
1584
1656
|
const ContactContainer = dt.div`
|
|
@@ -6398,20 +6470,8 @@ function Resume({ resume }) {
|
|
|
6398
6470
|
] });
|
|
6399
6471
|
}
|
|
6400
6472
|
function render(resume) {
|
|
6401
|
-
|
|
6402
|
-
|
|
6403
|
-
const html = renderToString(
|
|
6404
|
-
sheet.collectStyles(/* @__PURE__ */ jsx(Resume, { resume }))
|
|
6405
|
-
);
|
|
6406
|
-
const styles = sheet.getStyleTags();
|
|
6407
|
-
return `<!DOCTYPE html>
|
|
6408
|
-
<html lang="en">
|
|
6409
|
-
<head>
|
|
6410
|
-
<meta charset="UTF-8">
|
|
6411
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6412
|
-
<title>${resume.basics?.name || "Resume"} - Resume</title>
|
|
6413
|
-
${styles}
|
|
6414
|
-
<style>
|
|
6473
|
+
return renderResumeDocument(/* @__PURE__ */ jsx(Resume, { resume }), {
|
|
6474
|
+
headAfterStyles: `<style>
|
|
6415
6475
|
* {
|
|
6416
6476
|
box-sizing: border-box;
|
|
6417
6477
|
margin: 0;
|
|
@@ -6431,15 +6491,12 @@ function render(resume) {
|
|
|
6431
6491
|
margin: 1in;
|
|
6432
6492
|
}
|
|
6433
6493
|
}
|
|
6434
|
-
</style
|
|
6435
|
-
|
|
6436
|
-
|
|
6437
|
-
|
|
6438
|
-
|
|
6439
|
-
|
|
6440
|
-
} finally {
|
|
6441
|
-
sheet.seal();
|
|
6442
|
-
}
|
|
6494
|
+
</style>`,
|
|
6495
|
+
lang: "en",
|
|
6496
|
+
dir: "ltr",
|
|
6497
|
+
title: `${resume.basics?.name || "Resume"} - Resume`,
|
|
6498
|
+
includeTokensCss: false
|
|
6499
|
+
});
|
|
6443
6500
|
}
|
|
6444
6501
|
export {
|
|
6445
6502
|
render
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "jsonresume-theme-government-standard",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.4",
|
|
4
4
|
"description": "Government/compliance roles - conservative, by-the-book formatting",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"type": "module",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
21
|
"styled-components": "^6.1.19",
|
|
22
|
-
"@jsonresume/core": "0.3.
|
|
22
|
+
"@jsonresume/core": "0.3.2"
|
|
23
23
|
},
|
|
24
24
|
"exports": {
|
|
25
25
|
".": {
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
35
|
"@vitejs/plugin-react": "^4.3.4",
|
|
36
|
-
"vite": "^
|
|
36
|
+
"vite": "^6.4.3"
|
|
37
37
|
},
|
|
38
38
|
"scripts": {
|
|
39
39
|
"build": "vite build"
|
package/src/index.jsx
CHANGED
|
@@ -1,25 +1,9 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { renderToString } from 'react-dom/server';
|
|
3
|
-
import { ServerStyleSheet } from 'styled-components';
|
|
1
|
+
import { renderResumeDocument } from '@jsonresume/core/ssr';
|
|
4
2
|
import Resume from './Resume.jsx';
|
|
5
3
|
|
|
6
4
|
export function render(resume) {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
try {
|
|
10
|
-
const html = renderToString(
|
|
11
|
-
sheet.collectStyles(<Resume resume={resume} />)
|
|
12
|
-
);
|
|
13
|
-
const styles = sheet.getStyleTags();
|
|
14
|
-
|
|
15
|
-
return `<!DOCTYPE html>
|
|
16
|
-
<html lang="en">
|
|
17
|
-
<head>
|
|
18
|
-
<meta charset="UTF-8">
|
|
19
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
20
|
-
<title>${resume.basics?.name || 'Resume'} - Resume</title>
|
|
21
|
-
${styles}
|
|
22
|
-
<style>
|
|
5
|
+
return renderResumeDocument(<Resume resume={resume} />, {
|
|
6
|
+
headAfterStyles: `<style>
|
|
23
7
|
* {
|
|
24
8
|
box-sizing: border-box;
|
|
25
9
|
margin: 0;
|
|
@@ -39,13 +23,10 @@ export function render(resume) {
|
|
|
39
23
|
margin: 1in;
|
|
40
24
|
}
|
|
41
25
|
}
|
|
42
|
-
</style
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
} finally {
|
|
49
|
-
sheet.seal();
|
|
50
|
-
}
|
|
26
|
+
</style>`,
|
|
27
|
+
lang: 'en',
|
|
28
|
+
dir: 'ltr',
|
|
29
|
+
title: `${resume.basics?.name || 'Resume'} - Resume`,
|
|
30
|
+
includeTokensCss: false,
|
|
31
|
+
});
|
|
51
32
|
}
|
package/dist/style.css
DELETED
|
@@ -1,139 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Resume Core Design Tokens
|
|
3
|
-
* Framework-agnostic CSS variables for theming
|
|
4
|
-
* Based on 2025 resume best practices and ATS compatibility research
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
:root {
|
|
8
|
-
/* Typography - ATS-friendly fonts */
|
|
9
|
-
--resume-font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
10
|
-
--resume-font-serif: Cambria, Georgia, "Times New Roman", serif;
|
|
11
|
-
--resume-font-mono: "Courier New", Courier, monospace;
|
|
12
|
-
|
|
13
|
-
/* Font Sizes - Optimal readability */
|
|
14
|
-
--resume-size-name: 36px; /* Large, prominent name */
|
|
15
|
-
--resume-size-heading: 16px; /* Section titles */
|
|
16
|
-
--resume-size-subheading: 14px; /* Job titles, degrees */
|
|
17
|
-
--resume-size-body: 11px; /* Body text, descriptions */
|
|
18
|
-
--resume-size-small: 10px; /* Dates, locations, metadata */
|
|
19
|
-
|
|
20
|
-
/* Font Weights */
|
|
21
|
-
--resume-weight-normal: 400;
|
|
22
|
-
--resume-weight-medium: 500;
|
|
23
|
-
--resume-weight-semibold: 600;
|
|
24
|
-
--resume-weight-bold: 700;
|
|
25
|
-
|
|
26
|
-
/* Line Heights */
|
|
27
|
-
--resume-line-height-tight: 1.2;
|
|
28
|
-
--resume-line-height-normal: 1.5;
|
|
29
|
-
--resume-line-height-relaxed: 1.75;
|
|
30
|
-
|
|
31
|
-
/* Colors - Professional Theme (default) */
|
|
32
|
-
--resume-color-primary: #1a1a1a;
|
|
33
|
-
--resume-color-secondary: #4a4a4a;
|
|
34
|
-
--resume-color-accent: #2563eb;
|
|
35
|
-
--resume-color-background: #ffffff;
|
|
36
|
-
--resume-color-border: #e5e7eb;
|
|
37
|
-
|
|
38
|
-
/* Spacing - Consistent rhythm */
|
|
39
|
-
--resume-space-section: 24px; /* Between major sections */
|
|
40
|
-
--resume-space-item: 16px; /* Between list items */
|
|
41
|
-
--resume-space-tight: 8px; /* Within items */
|
|
42
|
-
--resume-space-margin: 48px; /* Page margins */
|
|
43
|
-
|
|
44
|
-
/* Layout - Optimal line length */
|
|
45
|
-
--resume-max-width: 660px; /* ~80 chars at body size */
|
|
46
|
-
--resume-column-gap: 24px;
|
|
47
|
-
|
|
48
|
-
/* Border Radius */
|
|
49
|
-
--resume-radius-sm: 4px;
|
|
50
|
-
--resume-radius-md: 8px;
|
|
51
|
-
--resume-radius-lg: 12px;
|
|
52
|
-
|
|
53
|
-
/* Shadows - Subtle depth */
|
|
54
|
-
--resume-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
|
|
55
|
-
--resume-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
/* Modern Theme Variant */
|
|
59
|
-
[data-theme="modern"] {
|
|
60
|
-
--resume-color-primary: #0f172a;
|
|
61
|
-
--resume-color-secondary: #475569;
|
|
62
|
-
--resume-color-accent: #8b5cf6;
|
|
63
|
-
--resume-font-sans: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
/* Classic Theme Variant */
|
|
67
|
-
[data-theme="classic"] {
|
|
68
|
-
--resume-color-primary: #000000;
|
|
69
|
-
--resume-color-secondary: #333333;
|
|
70
|
-
--resume-color-accent: #0066cc;
|
|
71
|
-
--resume-font-sans: Georgia, "Times New Roman", serif;
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
/* Minimal Theme Variant */
|
|
75
|
-
[data-theme="minimal"] {
|
|
76
|
-
--resume-color-primary: #18181b;
|
|
77
|
-
--resume-color-secondary: #71717a;
|
|
78
|
-
--resume-color-accent: #000000;
|
|
79
|
-
--resume-space-section: 32px;
|
|
80
|
-
--resume-space-item: 20px;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
/* High Contrast Variant (Accessibility) */
|
|
84
|
-
[data-theme="high-contrast"] {
|
|
85
|
-
--resume-color-primary: #000000;
|
|
86
|
-
--resume-color-secondary: #000000;
|
|
87
|
-
--resume-color-accent: #0000ff;
|
|
88
|
-
--resume-color-background: #ffffff;
|
|
89
|
-
--resume-color-border: #000000;
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
/* Print Styles - ATS-Friendly PDF Export */
|
|
93
|
-
@media print {
|
|
94
|
-
:root {
|
|
95
|
-
/* Optimize for print */
|
|
96
|
-
--resume-space-section: 18px;
|
|
97
|
-
--resume-space-item: 12px;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
@page {
|
|
101
|
-
size: A4;
|
|
102
|
-
margin: 0.5in;
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
/* Prevent awkward breaks */
|
|
106
|
-
.resume-section {
|
|
107
|
-
page-break-inside: avoid;
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
.resume-item {
|
|
111
|
-
break-inside: avoid;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
/* Widows and orphans control */
|
|
115
|
-
p, li {
|
|
116
|
-
widows: 3;
|
|
117
|
-
orphans: 3;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
/* Hyphenation for long words */
|
|
121
|
-
.resume-description {
|
|
122
|
-
hyphens: auto;
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
/* Hide interactive elements */
|
|
126
|
-
.no-print {
|
|
127
|
-
display: none !important;
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
/* RTL Support */
|
|
132
|
-
[dir="rtl"] {
|
|
133
|
-
text-align: right;
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
[dir="rtl"] .resume-item {
|
|
137
|
-
padding-left: 0;
|
|
138
|
-
padding-right: var(--resume-space-tight);
|
|
139
|
-
}
|
package/src/styles.js
DELETED
|
@@ -1,212 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
2
|
-
import { SectionTitle, ContactInfo } from '@jsonresume/core';
|
|
3
|
-
|
|
4
|
-
export const Layout = styled.div`
|
|
5
|
-
max-width: 8.5in;
|
|
6
|
-
margin: 0 auto;
|
|
7
|
-
padding: 1in;
|
|
8
|
-
background: #ffffff;
|
|
9
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
10
|
-
font-size: 12pt;
|
|
11
|
-
color: #000000;
|
|
12
|
-
line-height: 1.4;
|
|
13
|
-
|
|
14
|
-
@media print {
|
|
15
|
-
padding: 0;
|
|
16
|
-
margin: 0;
|
|
17
|
-
}
|
|
18
|
-
`;
|
|
19
|
-
|
|
20
|
-
export const Header = styled.header`
|
|
21
|
-
text-align: center;
|
|
22
|
-
margin-bottom: 24pt;
|
|
23
|
-
padding-bottom: 12pt;
|
|
24
|
-
border-bottom: 2pt solid #000000;
|
|
25
|
-
`;
|
|
26
|
-
|
|
27
|
-
export const Name = styled.h1`
|
|
28
|
-
font-size: 18pt;
|
|
29
|
-
font-weight: bold;
|
|
30
|
-
color: #000000;
|
|
31
|
-
margin: 0 0 6pt 0;
|
|
32
|
-
letter-spacing: 0;
|
|
33
|
-
text-transform: uppercase;
|
|
34
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
35
|
-
`;
|
|
36
|
-
|
|
37
|
-
export const Label = styled.div`
|
|
38
|
-
font-size: 12pt;
|
|
39
|
-
color: #000000;
|
|
40
|
-
margin-bottom: 8pt;
|
|
41
|
-
font-weight: normal;
|
|
42
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
43
|
-
`;
|
|
44
|
-
|
|
45
|
-
export const StyledContactInfo = styled(ContactInfo)`
|
|
46
|
-
font-size: 11pt;
|
|
47
|
-
text-align: center;
|
|
48
|
-
|
|
49
|
-
a {
|
|
50
|
-
font-size: 11pt;
|
|
51
|
-
color: #000000;
|
|
52
|
-
text-decoration: underline;
|
|
53
|
-
}
|
|
54
|
-
`;
|
|
55
|
-
|
|
56
|
-
export const Summary = styled.p`
|
|
57
|
-
font-size: 12pt;
|
|
58
|
-
line-height: 1.4;
|
|
59
|
-
color: #000000;
|
|
60
|
-
margin: 12pt 0 0 0;
|
|
61
|
-
text-align: left;
|
|
62
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
63
|
-
`;
|
|
64
|
-
|
|
65
|
-
export const StyledSectionTitle = styled(SectionTitle)`
|
|
66
|
-
font-size: 14pt;
|
|
67
|
-
font-weight: bold;
|
|
68
|
-
color: #000000;
|
|
69
|
-
margin: 18pt 0 12pt 0;
|
|
70
|
-
padding-bottom: 4pt;
|
|
71
|
-
border-bottom: 1pt solid #000000;
|
|
72
|
-
text-transform: uppercase;
|
|
73
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
74
|
-
`;
|
|
75
|
-
|
|
76
|
-
export const WorkItem = styled.div`
|
|
77
|
-
margin-bottom: 18pt;
|
|
78
|
-
page-break-inside: avoid;
|
|
79
|
-
|
|
80
|
-
&:last-child {
|
|
81
|
-
margin-bottom: 0;
|
|
82
|
-
}
|
|
83
|
-
`;
|
|
84
|
-
|
|
85
|
-
export const WorkHeader = styled.div`
|
|
86
|
-
margin-bottom: 6pt;
|
|
87
|
-
`;
|
|
88
|
-
|
|
89
|
-
export const Position = styled.h3`
|
|
90
|
-
font-size: 13pt;
|
|
91
|
-
font-weight: bold;
|
|
92
|
-
color: #000000;
|
|
93
|
-
margin: 0 0 3pt 0;
|
|
94
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
95
|
-
`;
|
|
96
|
-
|
|
97
|
-
export const Company = styled.div`
|
|
98
|
-
font-size: 12pt;
|
|
99
|
-
color: #000000;
|
|
100
|
-
font-weight: normal;
|
|
101
|
-
margin-bottom: 3pt;
|
|
102
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
103
|
-
`;
|
|
104
|
-
|
|
105
|
-
export const DateText = styled.div`
|
|
106
|
-
font-size: 11pt;
|
|
107
|
-
color: #111827;
|
|
108
|
-
font-weight: normal;
|
|
109
|
-
font-style: italic;
|
|
110
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
111
|
-
`;
|
|
112
|
-
|
|
113
|
-
export const WorkSummary = styled.p`
|
|
114
|
-
margin: 6pt 0;
|
|
115
|
-
color: #000000;
|
|
116
|
-
line-height: 1.4;
|
|
117
|
-
font-size: 12pt;
|
|
118
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
119
|
-
`;
|
|
120
|
-
|
|
121
|
-
export const Highlights = styled.ul`
|
|
122
|
-
margin: 6pt 0 0 18pt;
|
|
123
|
-
padding: 0;
|
|
124
|
-
list-style-type: disc;
|
|
125
|
-
|
|
126
|
-
li {
|
|
127
|
-
margin: 3pt 0;
|
|
128
|
-
color: #000000;
|
|
129
|
-
line-height: 1.4;
|
|
130
|
-
font-size: 12pt;
|
|
131
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
132
|
-
}
|
|
133
|
-
`;
|
|
134
|
-
|
|
135
|
-
export const EducationItem = styled.div`
|
|
136
|
-
margin-bottom: 12pt;
|
|
137
|
-
page-break-inside: avoid;
|
|
138
|
-
|
|
139
|
-
&:last-child {
|
|
140
|
-
margin-bottom: 0;
|
|
141
|
-
}
|
|
142
|
-
`;
|
|
143
|
-
|
|
144
|
-
export const Institution = styled.h3`
|
|
145
|
-
font-size: 13pt;
|
|
146
|
-
font-weight: bold;
|
|
147
|
-
color: #000000;
|
|
148
|
-
margin: 0 0 3pt 0;
|
|
149
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
150
|
-
`;
|
|
151
|
-
|
|
152
|
-
export const Degree = styled.div`
|
|
153
|
-
font-size: 12pt;
|
|
154
|
-
color: #000000;
|
|
155
|
-
margin-bottom: 3pt;
|
|
156
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
157
|
-
`;
|
|
158
|
-
|
|
159
|
-
export const EducationDate = styled.div`
|
|
160
|
-
font-size: 11pt;
|
|
161
|
-
color: #111827;
|
|
162
|
-
font-style: italic;
|
|
163
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
164
|
-
`;
|
|
165
|
-
|
|
166
|
-
export const SkillsList = styled.div`
|
|
167
|
-
margin-bottom: 12pt;
|
|
168
|
-
|
|
169
|
-
&:last-child {
|
|
170
|
-
margin-bottom: 0;
|
|
171
|
-
}
|
|
172
|
-
`;
|
|
173
|
-
|
|
174
|
-
export const SkillName = styled.h4`
|
|
175
|
-
font-size: 12pt;
|
|
176
|
-
font-weight: bold;
|
|
177
|
-
color: #000000;
|
|
178
|
-
margin: 0 0 3pt 0;
|
|
179
|
-
display: inline;
|
|
180
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
181
|
-
`;
|
|
182
|
-
|
|
183
|
-
export const SkillTags = styled.span`
|
|
184
|
-
font-size: 12pt;
|
|
185
|
-
color: #000000;
|
|
186
|
-
font-weight: normal;
|
|
187
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
188
|
-
`;
|
|
189
|
-
|
|
190
|
-
export const SimpleList = styled.div`
|
|
191
|
-
margin-bottom: 12pt;
|
|
192
|
-
|
|
193
|
-
&:last-child {
|
|
194
|
-
margin-bottom: 0;
|
|
195
|
-
}
|
|
196
|
-
`;
|
|
197
|
-
|
|
198
|
-
export const ListItemTitle = styled.h4`
|
|
199
|
-
font-size: 12pt;
|
|
200
|
-
font-weight: bold;
|
|
201
|
-
color: #000000;
|
|
202
|
-
margin: 0 0 3pt 0;
|
|
203
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
204
|
-
`;
|
|
205
|
-
|
|
206
|
-
export const ListItemText = styled.p`
|
|
207
|
-
font-size: 12pt;
|
|
208
|
-
color: #000000;
|
|
209
|
-
margin: 3pt 0;
|
|
210
|
-
line-height: 1.4;
|
|
211
|
-
font-family: 'Times New Roman', Georgia, serif;
|
|
212
|
-
`;
|