diff options
author | Ines Almeida <ines.almeida@perspectum.com> | 2020-08-16 15:21:35 +0300 |
---|---|---|
committer | Ines Almeida <ines.almeida@perspectum.com> | 2020-08-16 15:21:35 +0300 |
commit | b908fbf4215da397927e62116925abab36d38ea3 (patch) | |
tree | a98cbe387bb39bf13989953926bd0ceb592591b8 | |
parent | 7391f4377fc0129b90d2d799e148caaf7cc567f0 (diff) |
Add theme content
38 files changed, 1232 insertions, 0 deletions
@@ -0,0 +1,20 @@ +The MIT License (MIT) + +Copyright (c) 2020 Inês Almeida + +Permission is hereby granted, free of charge, to any person obtaining a copy of +this software and associated documentation files (the "Software"), to deal in +the Software without restriction, including without limitation the rights to +use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of +the Software, and to permit persons to whom the Software is furnished to do so, +subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS +FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR +COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER +IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN +CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/assets/css/style.comp.css b/assets/css/style.comp.css new file mode 100644 index 0000000..07e1c34 --- /dev/null +++ b/assets/css/style.comp.css @@ -0,0 +1,268 @@ +.content { + position: absolute; + overflow: hidden; } + .content__left { + float: left; + width: 70%; + height: 100%; + padding: 3rem 4rem; } + .content__right { + position: absolute; + float: right; + width: 29%; + background-color: #f5f5f5; + height: 100%; + padding: 2rem 3rem; + right: 1rem; + -webkit-box-shadow: 0.5rem 1rem 1.5rem rgba(102, 102, 102, 0.15); + -moz-box-shadow: 0.5rem 1rem 1.5rem rgba(102, 102, 102, 0.15); + box-shadow: 0.5rem 1rem 1.5rem rgba(102, 102, 102, 0.15); } + +*, +*::after, +*::before { + margin: 0; + padding: 0; + box-sizing: inherit; } + +html { + font-size: 62.5%; + background-color: #ddd; } + @media print { + html { + background-color: #fff; } } + +.content { + width: 80rem; + min-height: 113.16129rem; + background-color: #fff; } + @media screen and (min-width: 60rem) { + .content { + margin: 6rem 0; + -webkit-box-shadow: 1rem 2rem 3rem rgba(102, 102, 102, 0.3); + -moz-box-shadow: 1rem 2rem 3rem rgba(102, 102, 102, 0.3); + box-shadow: 1rem 2rem 3rem rgba(102, 102, 102, 0.3); + position: absolute; + left: 50%; + transform: translateX(-50%); } } + @media print { + .content { + margin: 0; } } + +body { + box-sizing: border-box; } + +@media print { + @page { + margin: 0; + size: A4; } } + +::selection { + color: #fff; + background-color: rgba(213, 158, 147, 0.6); } + +body { + font-family: "Roboto", sans-serif; + font-weight: 300; + line-height: 1.7; + font-size: 1.12rem; + color: #666; } + +.mainHeading { + text-transform: uppercase; + font-size: 5rem; + color: #aaa; } + .mainHeading span { + color: #e3bfb8; } + +.section__title { + font-size: 2.1rem; + color: #aaa; } + +h1, h2 { + text-transform: uppercase; + font-family: "Oswald", sans-serif; } + +.section { + display: block; + margin-bottom: 2rem; } + .section__heading { + width: 100%; + overflow: hidden; } + .section__title { + position: relative; } + .section__title::after { + content: ""; + position: absolute; + border-top: 1px solid; + border-bottom: 1px solid; + border-color: #aaa; + width: 50rem; + height: 4px; + margin-left: 1.5rem; + margin-top: 1.5rem; + transition: all 0.5s ease-in-out; } + .section__title:hover::after { + border-color: #e3bfb8; } + +.sideSection { + display: block; + margin-bottom: 3rem; } + .sideSection__heading { + width: 100%; + overflow: hidden; + text-align: center; + margin-bottom: 1rem; } + .sideSection__title { + position: relative; } + .sideSection__title::after, .sideSection__title::before { + content: ""; + position: absolute; + border-top: 1px solid #aaa; + border-bottom: 1px solid #aaa; + width: 10rem; + height: 4px; + margin-top: 1.1rem; } + .sideSection__title::after { + margin-left: 1rem; } + .sideSection__title::before { + margin-left: -11rem; } + .sideSection li { + list-style: none; } + +.experience__item { + display: block; + margin-bottom: 1.5rem; } + +.experience__header, .experience__subheader { + display: block; + width: 100%; + height: 2.4rem; } + +.experience__job { + position: relative; + transition: transform 0.2s ease-in-out; } + .experience__job:hover { + transform: translateX(0.5rem); } + +.experience__company, .experience__position { + text-align: left; + width: 70%; + float: left; } + +.experience__company { + color: #999; } + +.experience__position { + text-transform: uppercase; + font-size: 1.3rem; + color: #666; } + +.experience__date, .experience__place { + float: right; + text-align: right; + width: 30%; + color: #aaa; } + +.experience__date { + font-weight: 400; } + +.experience__place::before { + font-family: 'Material Icons'; + color: #e3bfb8; + font-size: 1.4rem; + content: "place"; + display: inline-block; + padding-right: 3px; + vertical-align: middle; + font-weight: 900; } + +.experience__bullet { + list-style-position: inside; } + +.experience__badges { + display: block; + text-align: right; + margin-top: 0.5rem; + margin-bottom: 0.5rem; } + +.experience__badge { + font-size: 0.9rem; + font-weight: 400; + display: inline-block; + background-color: #e3bfb8; + color: white; + border-radius: 1rem; + padding: 0.1rem 0.6rem; } + +.contact { + line-height: 2rem; } + .contact__item { + position: relative; + font-size: 1rem; } + .contact__item > i { + background-color: #e3bfb8; + font-size: 1rem; + color: white; + text-align: center; + border-radius: 50%; + padding-top: 0.5rem; + width: 2rem; + height: 2rem; + margin-right: 0.5rem; + margin-bottom: 0.5rem; } + .contact__item > span { + position: absolute; + top: 50%; + transform: translateY(-50%); } + +.avatar { + display: block; } + .avatar__img { + object-fit: cover; + width: 100%; + overflow: hidden; + border-radius: 50%; } + .avatar__img:hover { + size: 110%; } + +.skills__group span { + font-weight: 700; + display: inline-block; } + .skills__group span::after { + content: ":"; } + .skills__group span:hover ~ li { + background-color: #e3bfb8; + color: #fff; } + +.skills__group li { + display: inline-block; + font-weight: 400; + transition: all 0.2s ease-in-out; + padding: 0 1px; + border-radius: 2px; } + .skills__group li:not(:last-child)::after { + content: ", "; } + .skills__group li:hover { + background-color: #e3bfb8; + color: #fff; } + +.language__item { + display: table; + width: 100%; } + +.language__name, .language__level { + display: table-cell; + width: 50%; } + +.language__level { + text-align: right; } + +.interests { + display: block; + -moz-column-count: 2; + column-count: 2; + width: 100%; + text-align: right; } + .interests__item:nth-child(n+4) { + text-align: left; } diff --git a/assets/css/style.css b/assets/css/style.css new file mode 100644 index 0000000..537bf93 --- /dev/null +++ b/assets/css/style.css @@ -0,0 +1 @@ +.content{position:absolute;overflow:hidden}.content__left{float:left;width:70%;height:100%;padding:3rem 4rem}.content__right{position:absolute;float:right;width:29%;background-color:#f5f5f5;height:100%;padding:2rem 3rem;right:1rem;-webkit-box-shadow:0.5rem 1rem 1.5rem rgba(102,102,102,0.15);box-shadow:0.5rem 1rem 1.5rem rgba(102,102,102,0.15)}*,*::after,*::before{margin:0;padding:0;-webkit-box-sizing:inherit;box-sizing:inherit}html{font-size:62.5%;background-color:#ddd}@media print{html{background-color:#fff}}.content{width:80rem;min-height:113.16129rem;background-color:#fff}@media screen and (min-width: 60rem){.content{margin:6rem 0;-webkit-box-shadow:1rem 2rem 3rem rgba(102,102,102,0.3);box-shadow:1rem 2rem 3rem rgba(102,102,102,0.3);position:absolute;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}}@media print{.content{margin:0}}body{-webkit-box-sizing:border-box;box-sizing:border-box}@media print{@page{margin:0;size:A4}}::-moz-selection{color:#fff;background-color:rgba(213,158,147,0.6)}::selection{color:#fff;background-color:rgba(213,158,147,0.6)}body{font-family:"Roboto", sans-serif;font-weight:300;line-height:1.7;font-size:1.12rem;color:#666}.mainHeading{text-transform:uppercase;font-size:5rem;color:#aaa}.mainHeading span{color:#e3bfb8}.section__title{font-size:2.1rem;color:#aaa}h1,h2{text-transform:uppercase;font-family:"Oswald", sans-serif}.section{display:block;margin-bottom:2rem}.section__heading{width:100%;overflow:hidden}.section__title{position:relative}.section__title::after{content:"";position:absolute;border-top:1px solid;border-bottom:1px solid;border-color:#aaa;width:50rem;height:4px;margin-left:1.5rem;margin-top:1.5rem;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out}.section__title:hover::after{border-color:#e3bfb8}.sideSection{display:block;margin-bottom:3rem}.sideSection__heading{width:100%;overflow:hidden;text-align:center;margin-bottom:1rem}.sideSection__title{position:relative}.sideSection__title::after,.sideSection__title::before{content:"";position:absolute;border-top:1px solid #aaa;border-bottom:1px solid #aaa;width:10rem;height:4px;margin-top:1.1rem}.sideSection__title::after{margin-left:1rem}.sideSection__title::before{margin-left:-11rem}.sideSection li{list-style:none}.experience__item{display:block;margin-bottom:1.5rem}.experience__header,.experience__subheader{display:block;width:100%;height:2.4rem}.experience__job{position:relative;-webkit-transition:-webkit-transform 0.2s ease-in-out;transition:-webkit-transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out}.experience__job:hover{-webkit-transform:translateX(0.5rem);transform:translateX(0.5rem)}.experience__company,.experience__position{text-align:left;width:70%;float:left}.experience__company{color:#999}.experience__position{text-transform:uppercase;font-size:1.3rem;color:#666}.experience__date,.experience__place{float:right;text-align:right;width:30%;color:#aaa}.experience__date{font-weight:400}.experience__place::before{font-family:'Material Icons';color:#e3bfb8;font-size:1.4rem;content:"place";display:inline-block;padding-right:3px;vertical-align:middle;font-weight:900}.experience__bullet{list-style-position:inside}.experience__badges{display:block;text-align:right;margin-top:0.5rem;margin-bottom:0.5rem}.experience__badge{font-size:0.9rem;font-weight:400;display:inline-block;background-color:#e3bfb8;color:white;border-radius:1rem;padding:0.1rem 0.6rem}.contact{line-height:2rem}.contact__item{position:relative;font-size:1rem}.contact__item>i{background-color:#e3bfb8;font-size:1rem;color:white;text-align:center;border-radius:50%;padding-top:0.5rem;width:2rem;height:2rem;margin-right:0.5rem;margin-bottom:0.5rem}.contact__item>span{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.avatar{display:block}.avatar__img{-o-object-fit:cover;object-fit:cover;width:100%;overflow:hidden;border-radius:50%}.avatar__img:hover{size:110%}.skills__group span{font-weight:700;display:inline-block}.skills__group span::after{content:":"}.skills__group span:hover ~ li{background-color:#e3bfb8;color:#fff}.skills__group li{display:inline-block;font-weight:400;-webkit-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;padding:0 1px;border-radius:2px}.skills__group li:not(:last-child)::after{content:", "}.skills__group li:hover{background-color:#e3bfb8;color:#fff}.language__item{display:table;width:100%}.language__name,.language__level{display:table-cell;width:50%}.language__level{text-align:right}.interests{display:block;-moz-column-count:2;-webkit-column-count:2;column-count:2;width:100%;text-align:right}.interests__item:nth-child(n+4){text-align:left} diff --git a/assets/css/style.prefix.css b/assets/css/style.prefix.css new file mode 100644 index 0000000..6b3688a --- /dev/null +++ b/assets/css/style.prefix.css @@ -0,0 +1,284 @@ +.content { + position: absolute; + overflow: hidden; } + .content__left { + float: left; + width: 70%; + height: 100%; + padding: 3rem 4rem; } + .content__right { + position: absolute; + float: right; + width: 29%; + background-color: #f5f5f5; + height: 100%; + padding: 2rem 3rem; + right: 1rem; + -webkit-box-shadow: 0.5rem 1rem 1.5rem rgba(102, 102, 102, 0.15); + box-shadow: 0.5rem 1rem 1.5rem rgba(102, 102, 102, 0.15); } + +*, +*::after, +*::before { + margin: 0; + padding: 0; + -webkit-box-sizing: inherit; + box-sizing: inherit; } + +html { + font-size: 62.5%; + background-color: #ddd; } + @media print { + html { + background-color: #fff; } } + +.content { + width: 80rem; + min-height: 113.16129rem; + background-color: #fff; } + @media screen and (min-width: 60rem) { + .content { + margin: 6rem 0; + -webkit-box-shadow: 1rem 2rem 3rem rgba(102, 102, 102, 0.3); + box-shadow: 1rem 2rem 3rem rgba(102, 102, 102, 0.3); + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); } } + @media print { + .content { + margin: 0; } } + +body { + -webkit-box-sizing: border-box; + box-sizing: border-box; } + +@media print { + @page { + margin: 0; + size: A4; } } + +::-moz-selection { + color: #fff; + background-color: rgba(213, 158, 147, 0.6); } + +::selection { + color: #fff; + background-color: rgba(213, 158, 147, 0.6); } + +body { + font-family: "Roboto", sans-serif; + font-weight: 300; + line-height: 1.7; + font-size: 1.12rem; + color: #666; } + +.mainHeading { + text-transform: uppercase; + font-size: 5rem; + color: #aaa; } + .mainHeading span { + color: #e3bfb8; } + +.section__title { + font-size: 2.1rem; + color: #aaa; } + +h1, h2 { + text-transform: uppercase; + font-family: "Oswald", sans-serif; } + +.section { + display: block; + margin-bottom: 2rem; } + .section__heading { + width: 100%; + overflow: hidden; } + .section__title { + position: relative; } + .section__title::after { + content: ""; + position: absolute; + border-top: 1px solid; + border-bottom: 1px solid; + border-color: #aaa; + width: 50rem; + height: 4px; + margin-left: 1.5rem; + margin-top: 1.5rem; + -webkit-transition: all 0.5s ease-in-out; + transition: all 0.5s ease-in-out; } + .section__title:hover::after { + border-color: #e3bfb8; } + +.sideSection { + display: block; + margin-bottom: 3rem; } + .sideSection__heading { + width: 100%; + overflow: hidden; + text-align: center; + margin-bottom: 1rem; } + .sideSection__title { + position: relative; } + .sideSection__title::after, .sideSection__title::before { + content: ""; + position: absolute; + border-top: 1px solid #aaa; + border-bottom: 1px solid #aaa; + width: 10rem; + height: 4px; + margin-top: 1.1rem; } + .sideSection__title::after { + margin-left: 1rem; } + .sideSection__title::before { + margin-left: -11rem; } + .sideSection li { + list-style: none; } + +.experience__item { + display: block; + margin-bottom: 1.5rem; } + +.experience__header, .experience__subheader { + display: block; + width: 100%; + height: 2.4rem; } + +.experience__job { + position: relative; + -webkit-transition: -webkit-transform 0.2s ease-in-out; + transition: -webkit-transform 0.2s ease-in-out; + transition: transform 0.2s ease-in-out; + transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; } + .experience__job:hover { + -webkit-transform: translateX(0.5rem); + transform: translateX(0.5rem); } + +.experience__company, .experience__position { + text-align: left; + width: 70%; + float: left; } + +.experience__company { + color: #999; } + +.experience__position { + text-transform: uppercase; + font-size: 1.3rem; + color: #666; } + +.experience__date, .experience__place { + float: right; + text-align: right; + width: 30%; + color: #aaa; } + +.experience__date { + font-weight: 400; } + +.experience__place::before { + font-family: 'Material Icons'; + color: #e3bfb8; + font-size: 1.4rem; + content: "place"; + display: inline-block; + padding-right: 3px; + vertical-align: middle; + font-weight: 900; } + +.experience__bullet { + list-style-position: inside; } + +.experience__badges { + display: block; + text-align: right; + margin-top: 0.5rem; + margin-bottom: 0.5rem; } + +.experience__badge { + font-size: 0.9rem; + font-weight: 400; + display: inline-block; + background-color: #e3bfb8; + color: white; + border-radius: 1rem; + padding: 0.1rem 0.6rem; } + +.contact { + line-height: 2rem; } + .contact__item { + position: relative; + font-size: 1rem; } + .contact__item > i { + background-color: #e3bfb8; + font-size: 1rem; + color: white; + text-align: center; + border-radius: 50%; + padding-top: 0.5rem; + width: 2rem; + height: 2rem; + margin-right: 0.5rem; + margin-bottom: 0.5rem; } + .contact__item > span { + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); } + +.avatar { + display: block; } + .avatar__img { + -o-object-fit: cover; + object-fit: cover; + width: 100%; + overflow: hidden; + border-radius: 50%; } + .avatar__img:hover { + size: 110%; } + +.skills__group span { + font-weight: 700; + display: inline-block; } + .skills__group span::after { + content: ":"; } + .skills__group span:hover ~ li { + background-color: #e3bfb8; + color: #fff; } + +.skills__group li { + display: inline-block; + font-weight: 400; + -webkit-transition: all 0.2s ease-in-out; + transition: all 0.2s ease-in-out; + padding: 0 1px; + border-radius: 2px; } + .skills__group li:not(:last-child)::after { + content: ", "; } + .skills__group li:hover { + background-color: #e3bfb8; + color: #fff; } + +.language__item { + display: table; + width: 100%; } + +.language__name, .language__level { + display: table-cell; + width: 50%; } + +.language__level { + text-align: right; } + +.interests { + display: block; + -moz-column-count: 2; + -webkit-column-count: 2; + column-count: 2; + width: 100%; + text-align: right; } + .interests__item:nth-child(n+4) { + text-align: left; } + +/*# sourceMappingURL=data:application/json;base64,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O0lBQ0UsY0FBYyxFQUFFO0VBQ2xCO0lBQ0UsMEJBQTBCO0lBQzFCLFlBQVksRUFBRTs7QUFFbEI7RUFDRSxlQUFlO0VBQ2YsWUFBWSxFQUFFOztBQUVoQjtFQUNFLG9CQUFvQjtFQUNwQixXQUFXLEVBQUU7O0FBRWY7RUFDRSxrQkFBa0IsRUFBRTs7QUFFdEI7RUFDRSxlQUFlO0VBQ2YscUJBQXFCO0VBQ3JCLHdCQUFnQjtVQUFoQixnQkFBZ0I7RUFDaEIsWUFBWTtFQUNaLGtCQUFrQixFQUFFO0VBQ3BCO0lBQ0UsaUJBQWlCLEVBQUUiLCJmaWxlIjoic3R5bGUucHJlZml4LmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi5jb250ZW50IHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICBvdmVyZmxvdzogaGlkZGVuOyB9XG4gIC5jb250ZW50X19sZWZ0IHtcbiAgICBmbG9hdDogbGVmdDtcbiAgICB3aWR0aDogNzAlO1xuICAgIGhlaWdodDogMTAwJTtcbiAgICBwYWRkaW5nOiAzcmVtIDRyZW07IH1cbiAgLmNvbnRlbnRfX3JpZ2h0IHtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgZmxvYXQ6IHJpZ2h0O1xuICAgIHdpZHRoOiAyOSU7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2Y1ZjVmNTtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgcGFkZGluZzogMnJlbSAzcmVtO1xuICAgIHJpZ2h0OiAxcmVtO1xuICAgIC13ZWJraXQtYm94LXNoYWRvdzogMC41cmVtIDFyZW0gMS41cmVtIHJnYmEoMTAyLCAxMDIsIDEwMiwgMC4xNSk7XG4gICAgLW1vei1ib3gtc2hhZG93OiAwLjVyZW0gMXJlbSAxLjVyZW0gcmdiYSgxMDIsIDEwMiwgMTAyLCAwLjE1KTtcbiAgICBib3gtc2hhZG93OiAwLjVyZW0gMXJlbSAxLjVyZW0gcmdiYSgxMDIsIDEwMiwgMTAyLCAwLjE1KTsgfVxuXG4qLFxuKjo6YWZ0ZXIsXG4qOjpiZWZvcmUge1xuICBtYXJnaW46IDA7XG4gIHBhZGRpbmc6IDA7XG4gIGJveC1zaXppbmc6IGluaGVyaXQ7IH1cblxuaHRtbCB7XG4gIGZvbnQtc2l6ZTogNjIuNSU7XG4gIGJhY2tncm91bmQtY29sb3I6ICNkZGQ7IH1cbiAgQG1lZGlhIHByaW50IHtcbiAgICBodG1sIHtcbiAgICAgIGJhY2tncm91bmQtY29sb3I6ICNmZmY7IH0gfVxuXG4uY29udGVudCB7XG4gIHdpZHRoOiA4MHJlbTtcbiAgbWluLWhlaWdodDogMTEzLjE2MTI5cmVtO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmOyB9XG4gIEBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDYwcmVtKSB7XG4gICAgLmNvbnRlbnQge1xuICAgICAgbWFyZ2luOiA2cmVtIDA7XG4gICAgICAtd2Via2l0LWJveC1zaGFkb3c6IDFyZW0gMnJlbSAzcmVtIHJnYmEoMTAyLCAxMDIsIDEwMiwgMC4zKTtcbiAgICAgIC1tb3otYm94LXNoYWRvdzogMXJlbSAycmVtIDNyZW0gcmdiYSgxMDIsIDEwMiwgMTAyLCAwLjMpO1xuICAgICAgYm94LXNoYWRvdzogMXJlbSAycmVtIDNyZW0gcmdiYSgxMDIsIDEwMiwgMTAyLCAwLjMpO1xuICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgbGVmdDogNTAlO1xuICAgICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC01MCUpOyB9IH1cbiAgQG1lZGlhIHByaW50IHtcbiAgICAuY29udGVudCB7XG4gICAgICBtYXJnaW46IDA7IH0gfVxuXG5ib2R5IHtcbiAgYm94LXNpemluZzogYm9yZGVyLWJveDsgfVxuXG5AbWVkaWEgcHJpbnQge1xuICBAcGFnZSB7XG4gICAgbWFyZ2luOiAwO1xuICAgIHNpemU6IEE0OyB9IH1cblxuOjpzZWxlY3Rpb24ge1xuICBjb2xvcjogI2ZmZjtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgyMTMsIDE1OCwgMTQ3LCAwLjYpOyB9XG5cbmJvZHkge1xuICBmb250LWZhbWlseTogXCJSb2JvdG9cIiwgc2Fucy1zZXJpZjtcbiAgZm9udC13ZWlnaHQ6IDMwMDtcbiAgbGluZS1oZWlnaHQ6IDEuNztcbiAgZm9udC1zaXplOiAxLjEycmVtO1xuICBjb2xvcjogIzY2NjsgfVxuXG4ubWFpbkhlYWRpbmcge1xuICB0ZXh0LXRyYW5zZm9ybTogdXBwZXJjYXNlO1xuICBmb250LXNpemU6IDVyZW07XG4gIGNvbG9yOiAjYWFhOyB9XG4gIC5tYWluSGVhZGluZyBzcGFuIHtcbiAgICBjb2xvcjogI2UzYmZiODsgfVxuXG4uc2VjdGlvbl9fdGl0bGUge1xuICBmb250LXNpemU6IDIuMXJlbTtcbiAgY29sb3I6ICNhYWE7IH1cblxuaDEsIGgyIHtcbiAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbiAgZm9udC1mYW1pbHk6IFwiT3N3YWxkXCIsIHNhbnMtc2VyaWY7IH1cblxuLnNlY3Rpb24ge1xuICBkaXNwbGF5OiBibG9jaztcbiAgbWFyZ2luLWJvdHRvbTogMnJlbTsgfVxuICAuc2VjdGlvbl9faGVhZGluZyB7XG4gICAgd2lkdGg6IDEwMCU7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjsgfVxuICAuc2VjdGlvbl9fdGl0bGUge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTsgfVxuICAgIC5zZWN0aW9uX190aXRsZTo6YWZ0ZXIge1xuICAgICAgY29udGVudDogXCJcIjtcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIGJvcmRlci10b3A6IDFweCBzb2xpZDtcbiAgICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZDtcbiAgICAgIGJvcmRlci1jb2xvcjogI2FhYTtcbiAgICAgIHdpZHRoOiA1MHJlbTtcbiAgICAgIGhlaWdodDogNHB4O1xuICAgICAgbWFyZ2luLWxlZnQ6IDEuNXJlbTtcbiAgICAgIG1hcmdpbi10b3A6IDEuNXJlbTtcbiAgICAgIHRyYW5zaXRpb246IGFsbCAwLjVzIGVhc2UtaW4tb3V0OyB9XG4gICAgLnNlY3Rpb25fX3RpdGxlOmhvdmVyOjphZnRlciB7XG4gICAgICBib3JkZXItY29sb3I6ICNlM2JmYjg7IH1cblxuLnNpZGVTZWN0aW9uIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIG1hcmdpbi1ib3R0b206IDNyZW07IH1cbiAgLnNpZGVTZWN0aW9uX19oZWFkaW5nIHtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgICBtYXJnaW4tYm90dG9tOiAxcmVtOyB9XG4gIC5zaWRlU2VjdGlvbl9fdGl0bGUge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTsgfVxuICAgIC5zaWRlU2VjdGlvbl9fdGl0bGU6OmFmdGVyLCAuc2lkZVNlY3Rpb25fX3RpdGxlOjpiZWZvcmUge1xuICAgICAgY29udGVudDogXCJcIjtcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIGJvcmRlci10b3A6IDFweCBzb2xpZCAjYWFhO1xuICAgICAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICNhYWE7XG4gICAgICB3aWR0aDogMTByZW07XG4gICAgICBoZWlnaHQ6IDRweDtcbiAgICAgIG1hcmdpbi10b3A6IDEuMXJlbTsgfVxuICAgIC5zaWRlU2VjdGlvbl9fdGl0bGU6OmFmdGVyIHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAxcmVtOyB9XG4gICAgLnNpZGVTZWN0aW9uX190aXRsZTo6YmVmb3JlIHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAtMTFyZW07IH1cbiAgLnNpZGVTZWN0aW9uIGxpIHtcbiAgICBsaXN0LXN0eWxlOiBub25lOyB9XG5cbi5leHBlcmllbmNlX19pdGVtIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbTsgfVxuXG4uZXhwZXJpZW5jZV9faGVhZGVyLCAuZXhwZXJpZW5jZV9fc3ViaGVhZGVyIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIHdpZHRoOiAxMDAlO1xuICBoZWlnaHQ6IDIuNHJlbTsgfVxuXG4uZXhwZXJpZW5jZV9fam9iIHtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4ycyBlYXNlLWluLW91dDsgfVxuICAuZXhwZXJpZW5jZV9fam9iOmhvdmVyIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMC41cmVtKTsgfVxuXG4uZXhwZXJpZW5jZV9fY29tcGFueSwgLmV4cGVyaWVuY2VfX3Bvc2l0aW9uIHtcbiAgdGV4dC1hbGlnbjogbGVmdDtcbiAgd2lkdGg6IDcwJTtcbiAgZmxvYXQ6IGxlZnQ7IH1cblxuLmV4cGVyaWVuY2VfX2NvbXBhbnkge1xuICBjb2xvcjogIzk5OTsgfVxuXG4uZXhwZXJpZW5jZV9fcG9zaXRpb24ge1xuICB0ZXh0LXRyYW5zZm9ybTogdXBwZXJjYXNlO1xuICBmb250LXNpemU6IDEuM3JlbTtcbiAgY29sb3I6ICM2NjY7IH1cblxuLmV4cGVyaWVuY2VfX2RhdGUsIC5leHBlcmllbmNlX19wbGFjZSB7XG4gIGZsb2F0OiByaWdodDtcbiAgdGV4dC1hbGlnbjogcmlnaHQ7XG4gIHdpZHRoOiAzMCU7XG4gIGNvbG9yOiAjYWFhOyB9XG5cbi5leHBlcmllbmNlX19kYXRlIHtcbiAgZm9udC13ZWlnaHQ6IDQwMDsgfVxuXG4uZXhwZXJpZW5jZV9fcGxhY2U6OmJlZm9yZSB7XG4gIGZvbnQtZmFtaWx5OiAnTWF0ZXJpYWwgSWNvbnMnO1xuICBjb2xvcjogI2UzYmZiODtcbiAgZm9udC1zaXplOiAxLjRyZW07XG4gIGNvbnRlbnQ6IFwicGxhY2VcIjtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICBwYWRkaW5nLXJpZ2h0OiAzcHg7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG4gIGZvbnQtd2VpZ2h0OiA5MDA7IH1cblxuLmV4cGVyaWVuY2VfX2J1bGxldCB7XG4gIGxpc3Qtc3R5bGUtcG9zaXRpb246IGluc2lkZTsgfVxuXG4uZXhwZXJpZW5jZV9fYmFkZ2VzIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIHRleHQtYWxpZ246IHJpZ2h0O1xuICBtYXJnaW4tdG9wOiAwLjVyZW07XG4gIG1hcmdpbi1ib3R0b206IDAuNXJlbTsgfVxuXG4uZXhwZXJpZW5jZV9fYmFkZ2Uge1xuICBmb250LXNpemU6IDAuOXJlbTtcbiAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZTNiZmI4O1xuICBjb2xvcjogd2hpdGU7XG4gIGJvcmRlci1yYWRpdXM6IDFyZW07XG4gIHBhZGRpbmc6IDAuMXJlbSAwLjZyZW07IH1cblxuLmNvbnRhY3Qge1xuICBsaW5lLWhlaWdodDogMnJlbTsgfVxuICAuY29udGFjdF9faXRlbSB7XG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIGZvbnQtc2l6ZTogMXJlbTsgfVxuICAgIC5jb250YWN0X19pdGVtID4gaSB7XG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZTNiZmI4O1xuICAgICAgZm9udC1zaXplOiAxcmVtO1xuICAgICAgY29sb3I6IHdoaXRlO1xuICAgICAgdGV4dC1hbGlnbjogY2VudGVyO1xuICAgICAgYm9yZGVyLXJhZGl1czogNTAlO1xuICAgICAgcGFkZGluZy10b3A6IDAuNXJlbTtcbiAgICAgIHdpZHRoOiAycmVtO1xuICAgICAgaGVpZ2h0OiAycmVtO1xuICAgICAgbWFyZ2luLXJpZ2h0OiAwLjVyZW07XG4gICAgICBtYXJnaW4tYm90dG9tOiAwLjVyZW07IH1cbiAgICAuY29udGFjdF9faXRlbSA+IHNwYW4ge1xuICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgdG9wOiA1MCU7XG4gICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoLTUwJSk7IH1cblxuLmF2YXRhciB7XG4gIGRpc3BsYXk6IGJsb2NrOyB9XG4gIC5hdmF0YXJfX2ltZyB7XG4gICAgb2JqZWN0LWZpdDogY292ZXI7XG4gICAgd2lkdGg6IDEwMCU7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICBib3JkZXItcmFkaXVzOiA1MCU7IH1cbiAgICAuYXZhdGFyX19pbWc6aG92ZXIge1xuICAgICAgc2l6ZTogMTEwJTsgfVxuXG4uc2tpbGxzX19ncm91cCBzcGFuIHtcbiAgZm9udC13ZWlnaHQ6IDcwMDtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrOyB9XG4gIC5za2lsbHNfX2dyb3VwIHNwYW46OmFmdGVyIHtcbiAgICBjb250ZW50OiBcIjpcIjsgfVxuICAuc2tpbGxzX19ncm91cCBzcGFuOmhvdmVyIH4gbGkge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICNlM2JmYjg7XG4gICAgY29sb3I6ICNmZmY7IH1cblxuLnNraWxsc19fZ3JvdXAgbGkge1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGZvbnQtd2VpZ2h0OiA0MDA7XG4gIHRyYW5zaXRpb246IGFsbCAwLjJzIGVhc2UtaW4tb3V0O1xuICBwYWRkaW5nOiAwIDFweDtcbiAgYm9yZGVyLXJhZGl1czogMnB4OyB9XG4gIC5za2lsbHNfX2dyb3VwIGxpOm5vdCg6bGFzdC1jaGlsZCk6OmFmdGVyIHtcbiAgICBjb250ZW50OiBcIiwgXCI7IH1cbiAgLnNraWxsc19fZ3JvdXAgbGk6aG92ZXIge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICNlM2JmYjg7XG4gICAgY29sb3I6ICNmZmY7IH1cblxuLmxhbmd1YWdlX19pdGVtIHtcbiAgZGlzcGxheTogdGFibGU7XG4gIHdpZHRoOiAxMDAlOyB9XG5cbi5sYW5ndWFnZV9fbmFtZSwgLmxhbmd1YWdlX19sZXZlbCB7XG4gIGRpc3BsYXk6IHRhYmxlLWNlbGw7XG4gIHdpZHRoOiA1MCU7IH1cblxuLmxhbmd1YWdlX19sZXZlbCB7XG4gIHRleHQtYWxpZ246IHJpZ2h0OyB9XG5cbi5pbnRlcmVzdHMge1xuICBkaXNwbGF5OiBibG9jaztcbiAgLW1vei1jb2x1bW4tY291bnQ6IDI7XG4gIGNvbHVtbi1jb3VudDogMjtcbiAgd2lkdGg6IDEwMCU7XG4gIHRleHQtYWxpZ246IHJpZ2h0OyB9XG4gIC5pbnRlcmVzdHNfX2l0ZW06bnRoLWNoaWxkKG4rNCkge1xuICAgIHRleHQtYWxpZ246IGxlZnQ7IH1cbiJdfQ== */
\ No newline at end of file diff --git a/assets/sass/_abstract.scss b/assets/sass/_abstract.scss new file mode 100644 index 0000000..c56ab51 --- /dev/null +++ b/assets/sass/_abstract.scss @@ -0,0 +1,13 @@ +// COLORS +$color-white: #fff; +$color-grey: #aaa; +$color-grey-2: #999; +$color-grey-dark: #666; + +// WIDTHS +$width-left-col: 56rem; // 70% +$page-width: 80rem; +$width-right-col: $page-width - $width-left-col; + +// ANIMATIONS +$cubic: .63, .21, .76, 1.58
\ No newline at end of file diff --git a/assets/sass/_base.scss b/assets/sass/_base.scss new file mode 100644 index 0000000..4e48662 --- /dev/null +++ b/assets/sass/_base.scss @@ -0,0 +1,44 @@ +*, +*::after, +*::before { + margin: 0; + padding: 0; + box-sizing: inherit; +} + +html { + font-size: 62.5%; + background-color: $color-background; + + @media print {background-color: $color-white;} +} + +.content { + // A4 paper + width: $page-width; + min-height: paper_height($page-width); + background-color: $color-white; + + @media screen and (min-width: 60rem) { + margin: 6rem 0; + @include shadow(1); + @include hz-center; + } + @media print {margin: 0;} +} + +body { + box-sizing: border-box; +} + +@media print { + @page { + margin: 0; + size: A4; + } +} + +::selection { + color: $color-white; + background-color: darken(rgba($color-primary, 0.6), 10%); +}
\ No newline at end of file diff --git a/assets/sass/_functions.scss b/assets/sass/_functions.scss new file mode 100644 index 0000000..94fe1cb --- /dev/null +++ b/assets/sass/_functions.scss @@ -0,0 +1,3 @@ +@function paper_height($width) { + @return $width / 0.70695553; +}
\ No newline at end of file diff --git a/assets/sass/_layout.scss b/assets/sass/_layout.scss new file mode 100644 index 0000000..cc7a712 --- /dev/null +++ b/assets/sass/_layout.scss @@ -0,0 +1,23 @@ +.content { + position: absolute; + overflow: hidden; + + &__left { + float: left; + width: $width-left-col; + height: 100%; + padding: 3rem 4rem; + } + + &__right { + position: absolute; + float: right; + width: $width-right-col; + background-color: $color-right-col; + height: 100%; + padding: 2rem 3rem; + right: 1rem; + + @include shadow(0.5); + } +}
\ No newline at end of file diff --git a/assets/sass/_mixins.scss b/assets/sass/_mixins.scss new file mode 100644 index 0000000..52a07ef --- /dev/null +++ b/assets/sass/_mixins.scss @@ -0,0 +1,24 @@ +@mixin shadow($distance) { + -webkit-box-shadow: $distance * 1rem $distance * 2rem $distance * 3rem rgba($color-grey-dark, $distance * 0.3); + -moz-box-shadow: $distance * 1rem $distance * 2rem $distance * 3rem rgba($color-grey-dark, $distance * 0.3); + box-shadow: $distance * 1rem $distance * 2rem $distance * 3rem rgba($color-grey-dark, $distance * 0.3); +} + +@mixin hz-center { + position: absolute; + left: 50%; + transform: translateX(-50%); +} + +@mixin vt-center { + position: absolute; + top: 50%; + transform: translateY(-50%); +} + +@mixin all-center { + position: absolute; + top: 50%; + left: 50%; + transform: translateX(-50%) translateY(-50%); +}
\ No newline at end of file diff --git a/assets/sass/_typography.scss b/assets/sass/_typography.scss new file mode 100644 index 0000000..8a7c40c --- /dev/null +++ b/assets/sass/_typography.scss @@ -0,0 +1,27 @@ +body { + font-family: "Roboto", sans-serif; + font-weight: 300; + line-height: 1.7; + font-size: 1.12rem; + color: $color-grey-dark; +} + +.mainHeading { + text-transform: uppercase; + font-size: 5rem; + color: $color-grey; + + & span { + color: $color-primary; + } +} + +.section__title { + font-size: 2.1rem; + color: $color-grey; +} + +h1, h2 { + text-transform: uppercase; + font-family: "Oswald", sans-serif; +}
\ No newline at end of file diff --git a/assets/sass/components/_404.scss b/assets/sass/components/_404.scss new file mode 100644 index 0000000..d8174e8 --- /dev/null +++ b/assets/sass/components/_404.scss @@ -0,0 +1,8 @@ +.pageNotFound { + padding-top: 8rem; + @include hz-center; + + &__text { + padding-top: 3rem; + } +}
\ No newline at end of file diff --git a/assets/sass/components/_avatar.scss b/assets/sass/components/_avatar.scss new file mode 100644 index 0000000..3ec7f29 --- /dev/null +++ b/assets/sass/components/_avatar.scss @@ -0,0 +1,30 @@ +.avatar { + width: 100%; + height: $width-right-col - 6rem; + position: relative; + overflow: hidden; + + &__container { + @include hz-center; + width: 100%; + clip-path: circle(50% at 50% 56%); + height: $width-right-col - 8rem; + text-align: center; + transition: all 0.3s cubic-bezier($cubic); + + &:hover { + width: 110%; + } + } + + &__img { + object-fit: cover; + width: 110%; + transition: all 0.3s cubic-bezier($cubic); + @include all-center; + + &:hover { + width: 105%; + } + } +}
\ No newline at end of file diff --git a/assets/sass/components/_contact.scss b/assets/sass/components/_contact.scss new file mode 100644 index 0000000..18d1111 --- /dev/null +++ b/assets/sass/components/_contact.scss @@ -0,0 +1,24 @@ +.contact { + line-height: 2rem; + + &__item { + position: relative; + font-size: 1rem; + + & > i { + background-color: $color-primary; + color: $color-primary-text; + font-size: 1rem; + text-align: center; + border-radius: 50%; + padding-top: 0.5rem; + width: 2rem; + height: 2rem; + margin-right: 0.5rem; + margin-bottom: 0.5rem; + } + & > span { + @include vt-center; + } + } +}
\ No newline at end of file diff --git a/assets/sass/components/_experience.scss b/assets/sass/components/_experience.scss new file mode 100644 index 0000000..c8c8831 --- /dev/null +++ b/assets/sass/components/_experience.scss @@ -0,0 +1,85 @@ +.experience { + &__item { + display: block; + margin-bottom: 1.5rem; + } + + &__header, + &__subheader { + display: block; + width: 100%; + height: 2.4rem; + } + + &__job { + position: relative; + transition: transform 0.2s cubic-bezier($cubic); + + &:hover { + transform: translateX(0.5rem); + } + } + + &__company, + &__position { + text-align: left; + width: 70%; + float: left; + } + + &__company { + color: $color-grey-2; + } + + &__position { + text-transform: uppercase; + font-size: 1.3rem; + color: $color-grey-dark; + } + + &__date, + &__place { + float: right; + text-align: right; + width: 30%; + color: $color-grey; + } + + &__date { + font-weight: 400; + } + + &__place { + &::before { + font-family: 'Material Icons'; + color: $color-primary; + font-size: 1.4rem; + content: "place"; + display: inline-block; + padding-right: 3px; + vertical-align: middle; + font-weight: 900; + } + } + + &__bullet { + list-style-position: inside; + } + + &__badges { + display: block; + text-align: right; + margin-top: 0.5rem; + margin-bottom: 0.5rem; + } + + &__badge { + font-size: 0.9rem; + font-weight: 400; + display: inline-block; + background-color: $color-primary; + color: $color-primary-text; + border-radius: 1rem; + padding: 0.1rem 0.6rem; + } +}
\ No newline at end of file diff --git a/assets/sass/components/_interests.scss b/assets/sass/components/_interests.scss new file mode 100644 index 0000000..9bc5f8a --- /dev/null +++ b/assets/sass/components/_interests.scss @@ -0,0 +1,11 @@ +.interests { + display: block; + -moz-column-count: 2; + column-count: 2; + width: 100%; + text-align: right; + + &__item:nth-child(n+4) { + text-align: left; + } +}
\ No newline at end of file diff --git a/assets/sass/components/_languages.scss b/assets/sass/components/_languages.scss new file mode 100644 index 0000000..fa5c94a --- /dev/null +++ b/assets/sass/components/_languages.scss @@ -0,0 +1,15 @@ +.language { + &__item { + display: table; + width: 100%; + } + + &__name, + &__level { + display: table-cell; + width: 50%; + } + &__level { + text-align: right; + } +}
\ No newline at end of file diff --git a/assets/sass/components/_section.scss b/assets/sass/components/_section.scss new file mode 100644 index 0000000..28529bf --- /dev/null +++ b/assets/sass/components/_section.scss @@ -0,0 +1,30 @@ +.section { + display: block; + margin-bottom: 2rem; + + &__heading { + width:100%; + overflow: hidden; + } + + &__title { + position: relative; + + &::after { + content: ""; + position: absolute; + border-top: 1px solid; + border-bottom: 1px solid; + border-color: $color-grey; + width: 50rem; + height: 4px; + margin-left: 1.5rem; + margin-top: 1.5rem; + transition: all 0.5s ease-in-out; + } + + &:hover::after { + border-color: $color-primary; + } + } +} diff --git a/assets/sass/components/_side_section.scss b/assets/sass/components/_side_section.scss new file mode 100644 index 0000000..fdf31b1 --- /dev/null +++ b/assets/sass/components/_side_section.scss @@ -0,0 +1,38 @@ +.sideSection { + display: block; + margin-bottom: 3rem; + + &__heading { + width:100%; + overflow: hidden; + text-align: center; + margin-bottom: 1rem; + } + + &__title { + position: relative; + + &::after, + &::before { + content: ""; + position: absolute; + border-top: 1px solid $color-grey; + border-bottom: 1px solid $color-grey; + width: 10rem; + height: 4px; + margin-top: 1.1rem; + } + + &::after{ + margin-left: 1rem; + } + + &::before{ + margin-left: -11rem; + } + } + + & li { + list-style: none; + } +} diff --git a/assets/sass/components/_skills.scss b/assets/sass/components/_skills.scss new file mode 100644 index 0000000..54b2162 --- /dev/null +++ b/assets/sass/components/_skills.scss @@ -0,0 +1,35 @@ +.skills { + &__group { + & span { + font-weight: 700; + display: inline-block; + + &::after{ + content: ":" + } + + &:hover ~ li { + background-color: $color-primary; + color: $color-white; + } + + } + + & li{ + display: inline-block; + font-weight: 400; + transition: all 0.2s ease-in-out; + padding: 0 1px; + border-radius: 2px; + + &:not(:last-child)::after{ + content: ", " + } + + &:hover { + background-color: $color-primary; + color: $color-white; + } + } + } +}
\ No newline at end of file diff --git a/assets/sass/main.scss b/assets/sass/main.scss new file mode 100644 index 0000000..fa87da4 --- /dev/null +++ b/assets/sass/main.scss @@ -0,0 +1,24 @@ + +// HUGO variables +$color-primary: {{ .Site.Params.colorPrimary | default "#e3bfb8"}} !default; +$color-primary-text: {{ .Site.Params.colorPrimaryText | default "#fff"}} !default; +$color-background: {{ .Site.Params.colorPageBackground | default "#ddd" }} !default; +$color-right-col: {{ .Site.Params.colorRightColumnBackground | default "#f5f5f5" }} !default; + +@import "abstract"; +@import "functions"; +@import "mixins"; +@import "layout"; +@import "base"; +@import "typography"; + +@import "components/section"; +@import "components/side_section"; +@import "components/experience"; +@import "components/contact"; +@import "components/avatar"; +@import "components/skills"; +@import "components/languages"; +@import "components/interests"; + +@import "components/404";
\ No newline at end of file diff --git a/layouts/404.html b/layouts/404.html new file mode 100644 index 0000000..b3daf48 --- /dev/null +++ b/layouts/404.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html lang="en"> + {{ partial "head.html" . }} +<body> + <div class="content"> + <div class="pageNotFound"> + <h1>Page not found :(</h1> + <p class="pageNotFound__text"> + You're an explorer, aren't ya?<br> + But the page you are attempting to access cannot be found.<br> + Go back to the <a href="{{ "/" | relURL }}">main page</a> + </p> + </div> + </div> +</body> +</html> diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html new file mode 100644 index 0000000..5f8e2ec --- /dev/null +++ b/layouts/_default/baseof.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<html> + {{- partial "head.html" . -}} + <body> + {{- partial "header.html" . -}} + <div id="content"> + {{- block "main" . }}{{- end }} + </div> + {{- partial "footer.html" . -}} + </body> +</html> diff --git a/layouts/_default/list.html b/layouts/_default/list.html new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/layouts/_default/list.html diff --git a/layouts/_default/single.html b/layouts/_default/single.html new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/layouts/_default/single.html diff --git a/layouts/content/_redirects b/layouts/content/_redirects new file mode 100644 index 0000000..eb70c84 --- /dev/null +++ b/layouts/content/_redirects @@ -0,0 +1 @@ +/* /404.html 404
\ No newline at end of file diff --git a/layouts/index.html b/layouts/index.html new file mode 100644 index 0000000..5081ad6 --- /dev/null +++ b/layouts/index.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html lang="en"> + {{ partial "head.html" . }} +<body> + <div class="content"> + <div class="content__left"> + <h1 class="mainHeading">{{.Site.Data.content.BasicInfo.FirstName}} <span>{{.Site.Data.content.BasicInfo.LastName}}</span></h1> + + {{ partial "_profile.html" . }} + {{ partial "_experience.html" . }} + {{ partial "_education.html" . }} + + </div> + <div class="content__right"> + + {{ partial "_avatar.html" . }} + {{ partial "_contacts.html" . }} + {{ partial "_skills.html" . }} + {{ partial "_languages.html" . }} + {{ partial "_diplomas.html" . }} + {{ partial "_interests.html" . }} + </div> + </div> +</body> +</html>
\ No newline at end of file diff --git a/layouts/partials/_avatar.html b/layouts/partials/_avatar.html new file mode 100644 index 0000000..3d07527 --- /dev/null +++ b/layouts/partials/_avatar.html @@ -0,0 +1,5 @@ +<div class="sideSection avatar"> + <div class="avatar__container"> + <img class="avatar__img" src="{{ .Site.Data.content.BasicInfo.Photo }}" alt="photo of me"> + </div> +</div>
\ No newline at end of file diff --git a/layouts/partials/_contacts.html b/layouts/partials/_contacts.html new file mode 100644 index 0000000..ff3af9f --- /dev/null +++ b/layouts/partials/_contacts.html @@ -0,0 +1,8 @@ + +<div class="sideSection contact"> + <ul> + {{ range .Site.Data.content.BasicInfo.Contacts }} + <li class="contact__item"><i class="{{ .Icon }}"></i><span>{{ .Info }}</span></li> + {{ end }} + </ul> +</div>
\ No newline at end of file diff --git a/layouts/partials/_diplomas.html b/layouts/partials/_diplomas.html new file mode 100644 index 0000000..996aa10 --- /dev/null +++ b/layouts/partials/_diplomas.html @@ -0,0 +1,14 @@ +<div class="sideSection"> + <div class="sideSection__heading"> + <h2 class="sideSection__title"> + Diplomas + </h2> + </div> + <div class="sideSection__content"> + <ul> + {{ range .Site.Data.content.Diplomas }} + <li>{{ . }}</li> + {{ end }} + </ul> + </div> +</div>
\ No newline at end of file diff --git a/layouts/partials/_education.html b/layouts/partials/_education.html new file mode 100644 index 0000000..253ca1c --- /dev/null +++ b/layouts/partials/_education.html @@ -0,0 +1,17 @@ +<div id="education" class="section"> + <div class="section__heading"> + <h2 class="section__title"> + Education + </h2> + </div> + <div class="section__content"> + {{ range .Site.Data.content.Education }} + <div class="education__item"> + <h3 class="education__title">{{ .Course | safeHTML }}</h3> + <h4 class="education__place">{{ .Place | safeHTML }}</h4> + <h4 class="education__date">{{ .Date | safeHTML }}</h4> + <div class="education__description">{{ .Details | safeHTML }}</div> + </div> + {{ end }} + </div> +</div> diff --git a/layouts/partials/_experience.html b/layouts/partials/_experience.html new file mode 100644 index 0000000..caa7ecf --- /dev/null +++ b/layouts/partials/_experience.html @@ -0,0 +1,39 @@ +<div id="experience" class="section"> + <div class="section__heading"> + <h2 class="section__title"> + Experience + </h2> + </div> + <div class="section__content"> + <div class="experience"> + {{ range .Site.Data.content.Experience }} + <div class="experience__item"> + <div class="experience__header"> + <h3 class="experience__company">{{ .Employer }}</h3> + <h3 class="experience__place">{{ .Place }}</h3> + </div> + {{ range .Positions }} + <div class="experience__job"> + <div class="experience__subheader"> + <h3 class="experience__position">{{ .Title }}</h3> + <h3 class="experience__date">{{ .Date }}</h3> + </div> + <ul> + {{ range .Details }} + <li class="experience__bullet">{{ . }}</li> + {{ end }} + </ul> + <div class="experience__badges"> + <ul> + {{ range .Badges }} + <li class="experience__badge">{{ . }}</li> + {{ end }} + </ul> + </div> + </div> + {{ end }} + </div> + {{ end }} + </div> + </div> +</div>
\ No newline at end of file diff --git a/layouts/partials/_interests.html b/layouts/partials/_interests.html new file mode 100644 index 0000000..aca46cc --- /dev/null +++ b/layouts/partials/_interests.html @@ -0,0 +1,14 @@ +<div class="sideSection"> + <div class="sideSection__heading"> + <h2 class="sideSection__title"> + Interests + </h2> + </div> + <div class="sideSection__content"> + <ul class="interests"> + {{ range .Site.Data.content.Interests }} + <li class="interests__item">{{ . }}</li> + {{ end }} + </ul> + </div> +</div>
\ No newline at end of file diff --git a/layouts/partials/_languages.html b/layouts/partials/_languages.html new file mode 100644 index 0000000..039c9bf --- /dev/null +++ b/layouts/partials/_languages.html @@ -0,0 +1,14 @@ +<div class="sideSection"> + <div class="sideSection__heading"> + <h2 class="sideSection__title"> + Languages + </h2> + </div> + <div class="sideSection__content"> + <ul class="language"> + {{ range .Site.Data.content.Languages }} + <li class="language__item"><div class="language__name">{{ .Name }}</div><div class="language__level">{{ .Level }}</div></li> + {{ end }} + </ul> + </div> +</div>
\ No newline at end of file diff --git a/layouts/partials/_profile.html b/layouts/partials/_profile.html new file mode 100644 index 0000000..4ed5a15 --- /dev/null +++ b/layouts/partials/_profile.html @@ -0,0 +1,12 @@ +<div id="profile" class="section"> + <div class="section__heading"> + <h2 class="section__title"> + Profile + </h2> + </div> + <div class="section__content"> + <p> + {{.Site.Data.content.Profile}} + </p> + </div> +</div>
\ No newline at end of file diff --git a/layouts/partials/_skills.html b/layouts/partials/_skills.html new file mode 100644 index 0000000..8d3b5ed --- /dev/null +++ b/layouts/partials/_skills.html @@ -0,0 +1,21 @@ +<div class="sideSection"> + <div class="sideSection__heading"> + <h2 class="sideSection__title"> + Skills + </h2> + </div> + <div class="sideSection__content"> + <ul class="skills"> + <li> + {{ range .Site.Data.content.Skills }} + <ul class="skills__group"> + <span>{{ .Family }}</span> + {{ range .Items }} + <li>{{ . }}</li> + {{ end }} + </ul> + {{ end }} + </li> + </ul> + </div> +</div>
\ No newline at end of file diff --git a/layouts/partials/head.html b/layouts/partials/head.html new file mode 100644 index 0000000..07f35a6 --- /dev/null +++ b/layouts/partials/head.html @@ -0,0 +1,13 @@ +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>{{ .Site.Title }}</title> + + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Oswald"> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto"> + <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/> + <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> + + {{ $style := resources.Get "sass/main.scss" | resources.ExecuteAsTemplate "style.main.scss" . | toCSS | minify | fingerprint }} + <link rel="stylesheet" href="{{ $style.Permalink }}" integrity="{{ $style.Data.Integrity }}" > +</head>
\ No newline at end of file diff --git a/static/img/avatar.jpg b/static/img/avatar.jpg Binary files differnew file mode 100644 index 0000000..f39901f --- /dev/null +++ b/static/img/avatar.jpg diff --git a/theme.toml b/theme.toml new file mode 100644 index 0000000..946d563 --- /dev/null +++ b/theme.toml @@ -0,0 +1,15 @@ +# theme.toml template for a Hugo theme +# See https://github.com/gohugoio/hugoThemes#themetoml for an example + +name = "CV Almeida" +license = "MIT" +licenselink = "https://github.com/ineesalmeida/cv-almeida/master/LICENSE" +description = "Theme to build a customizeable printable CV with minor web responsiveness." +homepage = "https://github.com/ineesalmeida/cv-almeida/master" +tags = ["cv", "resume", "minimal", "simple"] +features = ["simple", "cv", "printable"] +min_version = "0.41.0" + +[author] + name = "Inês Almeida" + homepage = "ines-almeida.com" |