Laurent/personal-website-old
Archived
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

feat: resume 2 columns format

Browse source
This commit is contained in:
Laureηt 2020-11-20 19:25:59 +01:00
parent e2ee20e253
commit f37f80a082
4 changed files with 75 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.eleventy.js
View file

@ -1,11 +1,10 @@
module.exports = function(eleventyConfig) { module.exports = function(eleventyConfig) {
eleventyConfig.addPassthroughCopy('pages/css') eleventyConfig.addPassthroughCopy('pages/css');
eleventyConfig.addPassthroughCopy('pages/content') eleventyConfig.addPassthroughCopy('pages/content');
eleventyConfig.addPassthroughCopy({ eleventyConfig.addPassthroughCopy({
"node_modules/chaffle/docs/chaffle.min.js": "javascript/chaffle.min.js", "node_modules/chaffle/docs/chaffle.min.js": "javascript/chaffle.min.js",
"pages/cv.pdf": "cv.pdf",
"pages/favicon.ico": "favicon.ico" "pages/favicon.ico": "favicon.ico"
}); });

13
pages/css/resume.css
View file

@ -0,0 +1,13 @@
.row {
display: flex;
}
.col-1 {
flex: 60%;
padding-right: .5em;
}
.col-2 {
flex: 40%;
padding-left: .5em;
}

55
pages/resume.njk
View file

@ -1,55 +0,0 @@
---
username: Laureηt
---
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ username }}</title>
<link rel="stylesheet" href="{{ '/css/main.css' | url }}">
<link rel="stylesheet" href="{{ '/css/blink.css' | url }}">
<link rel="shortcut icon" type="image/x-icon" href="{{ '/favicon.ico' | url }}">
<script src="{{ '/javascript/chaffle.min.js' | url }}"></script>
</head>
<body>
<header>
<span data-chaffle-onload="" data-chaffle="en">{{ username }}</span>
<span class="blink" style="display:inline;">_</span>
</header>
{{ resume.name }}
<div class="btn-back">
<span>&laquo;</span>
<a href="{{ '/' | url }}">Go back</a>
</div>
<footer>
&copy; {% year %} {{ username }}
</footer>
<script>
var elm_mouseover = document.querySelectorAll('[data-chaffle]');
var elm_onload = document.querySelectorAll('[data-chaffle-onLoad]');
Array.prototype.forEach.call(elm_mouseover, function (el) {
var chaffle = new Chaffle(el)
el.addEventListener('mouseover', function () {
chaffle.init();
});
});
Array.prototype.forEach.call(elm_onload, function (el) {
var chaffle = new Chaffle(el)
chaffle.init();
setInterval(function(){
chaffle.init();
}, 10000)
});
</script>
</body>
</html>

60
pages/resume/index.njk Normal file
View file

@ -0,0 +1,60 @@
---
username: Laureηt
---
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ username }}</title>
<link rel="stylesheet" href="{{ '/css/main.css' | url }}">
<link rel="stylesheet" href="{{ '/css/resume.css' | url }}">
<link rel="stylesheet" href="{{ '/css/blink.css' | url }}">
<link rel="shortcut icon" type="image/x-icon" href="{{ '/favicon.ico' | url }}">
<script src="{{ '/javascript/chaffle.min.js' | url }}"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css" rel="stylesheet">
</head>
<body>
<header>
<span data-chaffle-onload="" data-chaffle="en">{{ username }}</span>
<span class="blink" style="display:inline;">_</span>
</header>
<div class="row">
<div class="col-1">Lorem ipsum dolor sit amet consectetur adipisicing elit. Illum, atque esse quo ad cum voluptates exercitationem ipsum sunt. Dolore natus eius corrupti animi eaque autem libero laudantium sapiente placeat quasi, cupiditate repellendus cumque vitae deleniti id aliquid porro nemo facilis soluta rem esse necessitatibus repudiandae. Corrupti omnis, recusandae laboriosam architecto voluptatibus vel voluptatum expedita dolor libero aspernatur beatae! Sapiente, voluptates totam. Accusamus neque eius sapiente, fugiat maxime accusantium iure voluptatum qui doloremque sequi nobis hic, sit impedit! Iure ad, suscipit eum quis explicabo nesciunt ducimus veritatis, repellat beatae quia, expedita recusandae magni molestiae in cumque quae labore nam similique. Aut!</div>
<div class="col-2">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sit, totam expedita hic recusandae doloremque quisquam exercitationem magni suscipit laboriosam enim, officia est sint dolores odio. Id non quam veritatis labore libero cumque ipsam ex consequatur, sit voluptas eius perferendis molestiae velit minus dolorem officiis. Fugiat dicta temporibus eaque sequi impedit labore. Reiciendis odio delectus quisquam facere vel debitis culpa, officiis fugit autem dignissimos iusto velit ullam aut? Adipisci sit optio natus expedita ipsum possimus saepe minus rerum, cumque quaerat deserunt, itaque amet dolorum fuga consectetur enim similique magni eveniet nemo sint. Voluptates odit incidunt vel sunt doloremque eum officiis possimus.</div>
</div>
<div class="btn-back">
<span>&laquo;</span>
<a href="{{ '/' | url }}">Go back</a>
</div>
<footer>
&copy; {% year %} {{ username }}
</footer>
<script>
var elm_mouseover = document.querySelectorAll('[data-chaffle]');
var elm_onload = document.querySelectorAll('[data-chaffle-onLoad]');
Array.prototype.forEach.call(elm_mouseover, function (el) {
var chaffle = new Chaffle(el)
el.addEventListener('mouseover', function () {
chaffle.init();
});
});
Array.prototype.forEach.call(elm_onload, function (el) {
var chaffle = new Chaffle(el)
chaffle.init();
setInterval(function(){
chaffle.init();
}, 10000)
});
</script>
</body>
</html>