From 45ab6e8a44c70afd71586d81b4cbea3d43947934 Mon Sep 17 00:00:00 2001 From: Benjamin Date: Sun, 12 Feb 2023 17:56:09 +0100 Subject: [PATCH] fixup! Refactor CV styling to files --- cv.html | 155 +++--------------------------------------------------- style.css | 145 ++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 151 insertions(+), 149 deletions(-) create mode 100644 style.css diff --git a/cv.html b/cv.html index 573f354..a109c09 100644 --- a/cv.html +++ b/cv.html @@ -5,6 +5,8 @@ + + @@ -22,153 +24,6 @@ CV Benjamin Stadlbauer - @@ -270,14 +125,16 @@

Skills

- German is my native language and I am fluent and experienced in English (I have an Academic-IELTS-score of 8.0 + German is my native language and I am fluent and experienced in English (I have an Academic-IELTS-score of + 8.0 from 2018 which is equivalent to an CEFR-score of C1–C2).

diff --git a/style.css b/style.css new file mode 100644 index 0000000..cab71f5 --- /dev/null +++ b/style.css @@ -0,0 +1,145 @@ +:root { + --white-neutral: #f4f4f9; + --white-hover: #ececff; + --black-neutral: #1a1a1c; + --black-hover: #282833; + --accent: #7a7a99; + + --primary: var(--black-neural); + --background: var(--white-neutral); + --hover-background: var(--white-hover); +} + +body { + color: var(--primary); + background-color: var(--background); + padding: 3ch; + max-width: 80ch; + margin: 0 auto; + font-family: system-ui; + line-height: 1.6; +} + +ul { + list-style-type: "-"; + padding-left: 1.5em; +} + +li { + padding-left: 0.25em; +} + +h3 { + display: flex; + justify-content: space-between; + flex-wrap: wrap; + line-height: 1.4; + font-weight: normal; + font-size: 1.2rem; + margin: 1.2rem 0; +} + +a { + color: inherit; + text-decoration: none; +} + +a::after { + /* copied from https://practicaltypography.com/how-to-use.html */ + position: relative; + content: "\FEFF°"; + margin-left: 0.1em; + font-size: 90%; + top: -0.1em; + color: var(--accent); + font-feature-settings: "caps"; + font-variant-numeric: normal; +} + +a:hover { + background: var(--hover-background); + transition-property: background; + transition-duration: 0.2s; +} + +h2 { + border-bottom-width: 1px; + border-bottom-color: var(--accent); + border-bottom-style: solid; + line-height: 1.2; + font-size: 1.44rem; + font-weight: normal; + margin: 1.44rem 0; +} + +h1 { + line-height: 1.0; + font-weight: normal; + font-size: 1.73rem; + margin: 1.73rem 0; +} + +aside { + margin-top: -0.6rem; + text-transform: uppercase; + opacity: 0.7; + letter-spacing: 0.05em; + line-height: 1; +} + +section#publications span.journal, +section#conferences span.conference { + font-style: italic; +} + +@media (prefers-color-scheme: light) { + :root { + --primary: var(--black-neural); + --background: var(--white-neutral); + --hover-background: var(--white-hover); + } +} + +@media (prefers-color-scheme: dark) { + :root { + --primary: var(--white-neutral); + --background: var(--black-neutral); + --hover-background: var(--black-hover); + } +} + +@media print { + :root { + --primary: #000000; + --background: #ffffff; + --accent: #000000; + } + + h2 { + border-bottom-width: 0.5pt; + } + + html, + body { + max-width: initial; + font-size: 10pt; + padding: 0; + } + + aside { + opacity: 1.0; + } + + a::after { + display: none; + } + + a:hover { + background: inherit; + } + + @page { + margin: 25mm; + size: A4; + } +}