diff --git a/src/partials/_a_chunk_list.scss b/src/partials/_a_chunk_list.scss new file mode 100644 index 0000000..2ad6327 --- /dev/null +++ b/src/partials/_a_chunk_list.scss @@ -0,0 +1,65 @@ +.chunk_list { + display: flex; + flex-direction: column; + padding: 0; + text-align: left; + + .chunk, + hr { + margin: var(--spacing-horizontal); + } + + .chunk { + .header { + display: grid; + grid-auto-flow: row; + grid-template-columns: 1fr min-content; + + background-color: var(--background-3); + border-radius: var(--border-radius-leaf); + + padding: var(--spacing-horizontal); + + .name, + .subtitle, + .status { + margin: 0; + } + + .name { + white-space: nowrap; + } + + .subtitle { + display: inline-block; + + font-size: 0.85rem; + font-weight: normal; + font-style: italic; + font-family: var(--font-family-generic); + } + + .status { + align-self: center; + white-space: nowrap; + margin-left: var(--spacing-horizontal); + + text-decoration: none; + font-size: 1.17rem; + font-weight: bold; + } + } + + .body { + padding: 0 calc(var(--spacing-horizontal) * 2); + + ul { + font-family: var(--font-family-generic); + + li + li { + margin-top: 0.5em; + } + } + } + } +} diff --git a/src/partials/_a_layouts.scss b/src/partials/_a_layouts.scss new file mode 100644 index 0000000..1d5e1fe --- /dev/null +++ b/src/partials/_a_layouts.scss @@ -0,0 +1,13 @@ +.layout_row { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + + .item { + margin: var(--spacing-horizontal); + padding: var(--spacing-horizontal); + + background-color: var(--background-1); + border-radius: var(--border-radius-leaf); + } +} diff --git a/src/partials/_a_pages.scss b/src/partials/_a_pages.scss new file mode 100644 index 0000000..c6862af --- /dev/null +++ b/src/partials/_a_pages.scss @@ -0,0 +1 @@ +@use "page_resume"; diff --git a/src/partials/_page_resume.scss b/src/partials/_page_resume.scss new file mode 100644 index 0000000..6374e34 --- /dev/null +++ b/src/partials/_page_resume.scss @@ -0,0 +1,173 @@ +.work_history { + max-width: 45%; + + .chunk_list { + flex-direction: column-reverse; + } +} + +.early_history { + align-self: center; +} + +.education { + max-width: 45%; + + .chunk_list { + flex-direction: column-reverse; + } +} + +.awards { + max-width: 45%; +} + +.certifications { + max-width: 45%; +} + +.software { + max-width: 60%; + + .premiere_pro { + color: var(--accent-purple); + } + + .photoshop { + color: var(--accent-blue); + } + + .anubis { + color: var(--accent-green); + } + + .blender { + color: var(--accent-orange); + } + + .davinci_resolve { + color: var(--accent-blue); + } + + .gimp { + color: var(--accent-magenta); + } + + .git { + color: var(--accent-orange); + } + + .libreoffice { + color: var(--white-0); + } + + .linux { + color: var(--white-0); + } + + .ms_office { + color: var(--accent-orange); + } + + .ms_windows { + color: var(--accent-blue); + } + + .musescore { + color: var(--accent-cyan); + } + + .nextcloud { + color: var(--accent-cyan); + } + + .nginx { + color: var(--accent-green); + } + + .obs { + color: var(--white-0); + } + + .prusaslicer { + color: var(--accent-orange); + } + + .shopbot_control_software { + color: var(--accent-blue); + } + + .vectric_aspire { + color: var(--accent-red); + rotate: 90deg; + } + + .zotero { + color: var(--accent-orange); + } +} + +.prog_languages { + max-width: 30%; + + .asciidoc { + color: var(--accent-cyan); + } + + .css { + color: var(--accent-purple); + } + + .html { + color: var(--accent-orange); + } + + .json { + color: var(--accent-cyan); + } + + .markdown { + color: var(--accent-indigo); + } + + .nginx { + color: var(--accent-green); + } + + .python { + color: var(--accent-blue); + } + + .ron { + color: var(--accent-orange); + } + + .rust { + color: var(--accent-orange); + } + + .scss { + color: var(--accent-magenta); + } + + .toml { + color: var(--accent-orange); + } + + .shell { + color: var(--accent-green); + } + + .yaml { + color: var(--accent-yellow); + } +} + +.docker { + /* + Docker is protective of their colours. + https://www.docker.com/company/newsroom/media-resources/ + */ + + color: #1d63edff; +}