From 7dccf6e8684f767b6e377d627b36ccf493947f1e Mon Sep 17 00:00:00 2001 From: "Alex Xu (Hello71)" Date: Sun, 3 Oct 2021 15:03:42 -0400 Subject: Initial commit --- resume/resume.css | 241 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 241 insertions(+) create mode 100644 resume/resume.css (limited to 'resume/resume.css') diff --git a/resume/resume.css b/resume/resume.css new file mode 100644 index 0000000..04c8431 --- /dev/null +++ b/resume/resume.css @@ -0,0 +1,241 @@ +@font-face { + font-family: "EB Garamond"; + src: url(EBGaramond-Regular.subset.woff2); +} + +@font-face { + font-family: "EB Garamond"; + font-weight: 500; + src: url(EBGaramond-Medium.subset.woff2); +} + +@font-face { + font-family: "EB Garamond"; + font-style: italic; + src: url(EBGaramond-Italic.subset.woff2); +} + +* { + box-sizing: border-box; +} +body { + margin: .8em auto; + max-width: 90%; + width: 50em; + position: relative; + left: clamp(-2em,calc(25em - 45%),0em); + display: grid; + grid-template-columns: auto auto; + + font-family: "EB Garamond", serif; + font-size: 16px; + line-height: 1.38; + overflow-wrap: break-word; + text-rendering: optimizeLegibility; + background: #fff; + color: #333; +} + +address, .right { + align-self: center; +} +.left { + padding-right: .9rem; + text-align: right; + color: #246d84; +} +.right { + border-left: solid 3px #246d84; + padding: .2rem 0 0 1rem; +} +/* firefox prints grid margin wrong */ +.gap { + margin-top: .8rem; + grid-column: 1/-1; +} +.entry-header > :nth-child(1) { + flex: 60%; + max-width: max-content; + margin-right: auto; +} +.taddr { + grid-row: 1; + align-self: center; +} +b { + font-weight: 500; + font-size: 1.1em; +} +.date { + text-align: right; + margin-left: 1.2em; + max-width: max-content; + flex: 10 0 auto; + width: min-content; +} +.title { + line-height: 1.22; +} +.entry-header { + display: flex; +} +section + section { + margin-top: .7em; +} +address, .h1s { + color: #666; +} +address { + font-size: .9em; +} +.icon { + vertical-align: middle; + margin-bottom: .5ex; +} +h1, h2, h3, h4, p, ul { + margin: 0; +} +h1, h2, h3, h4 { + font-weight: normal; +} +h1 { + font-size: 3em; + margin-top: -.5ex; +} +h4 { + display: inline; +} +ul { + padding: 0; + list-style: none; +} +ul:not(.fakelist) > li { + margin-left: .1em; + /* separate list-style-type for safari <14.1 support */ + list-style-type: '◦ '; + list-style-image: url("data:image/svg+xml,"); + list-style-position: inside; +} +a { + color: #06c; + text-decoration: none; +} +a:visited { + color: #0f00b0; +} +.date-punct, .hide, .printcol { + display: none; +} +.nb { + display: inline-block; +} +abbr { + text-decoration: none; +} +.h1s { + font-size: 1.4em; + font-style: italic; +} +@media (min-width: 25em) { + .left-heavy-columns { + columns: 2 14em; + margin-right: -1.4em; + } +} +@media (max-width: 30em) { + body { + display: block; + } + h1 { + margin-bottom: -.2ex; + } + .h1s { + margin-bottom: .6ex; + } + .title, .left address { + text-align: center; + } + .left address { + columns: 2; + } + .left { + text-align: center; + padding: 0; + min-width: 0; + } + .left:not(.taddr) { + border-bottom: solid; + margin-bottom: .2rem; + } + .gap { + margin-bottom: 1rem; + } + .right { + border-left: none; + padding: 0; + } + .title { + padding: 0; + } + .nb { + display: initial; + } +} +@media (max-width: 21em) { + header, .entry-header { + display: block; + } + .date { + text-align: left; + margin: 0; + width: auto; + } + .date-punct { + display: inline; + } +} +@media print { + .noprint { + display: none; + } + body { + position: static; + margin: 0; + padding: 0; + width: 100%; + max-width: 100%; + font-size: 13px; + line-height: 1.28; + color: #000; + -webkit-print-color-adjust: exact; + } + /* workaround: safari doesn't support css columns in print */ + .left-heavy-columns { + display: none; + } + .printcol { + display: inline-block; + } + section + section { + margin-top: .6em; + } + /* override print color for firefox */ + address, .h1s { + color: transparent; + text-shadow: 0 0 #555; + } + address svg { + color: #555; + } +} +@media (prefers-contrast: high) { + .h1s, address { + color: #555; + } +} +@media (prefers-contrast: low) { + body { + background: #ccc; + } +} +@page { margin: 7mm 26mm 7mm 18mm; } -- cgit v1.2.3-54-g00ecf