From 269e4d647e6007a576ee69bff9c0baaf46872f88 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Maciej=20P=C4=99dzich?= Date: Sun, 17 Jan 2021 19:45:35 +0100 Subject: [PATCH] Version 2.3.0 release --- CHANGELOG.md | 5 +++ assets/css/style.css | 76 ++++++++++++++++++++--------------- assets/js/script.js | 95 +++++++++++++++++++++++--------------------- index.html | 46 ++++++++++----------- 4 files changed, 120 insertions(+), 102 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 8e811cd..5db61be 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ # Changelog +## 2.3.0 + +- Add special _'help'_ command for dummies +- Add `::selection` styling rules + ## 2.2.0 - Change copyright header diff --git a/assets/css/style.css b/assets/css/style.css index e14dd27..25deb02 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -1,74 +1,84 @@ @font-face { - font-family: 'VGA 437'; - src: url('../fonts/vga437.ttf'); + font-family: 'VGA 437'; + src: url('../fonts/vga437.ttf'); } @media (prefers-color-scheme: dark) { - body, - #cmd { - color: whitesmoke; - } + body, + #cmd { + color: whitesmoke; + } - body { - background-color: black; - } + body { + background-color: black; + } + + ::selection { + background-color: whitesmoke; + color: black; + } } @media (prefers-color-scheme: light) { - body, - #cmd { - color: black; - } + body, + #cmd { + color: black; + } - body { - background-color: whitesmoke; - } + body { + background-color: whitesmoke; + } + + ::selection { + background-color: black; + color: whitesmoke; + } } @media (min-width: 1200px) { - body { - overflow: hidden; - } + body { + overflow: hidden; + } } body, #cmd { - font-family: 'VGA 437'; - font-size: 1.5rem; + font-family: 'VGA 437'; + font-size: 1.5rem; } #cmd-history > p { - line-height: 2rem; + line-height: 2rem; } #header > p { - margin: 0.5rem auto; + margin: 0.5rem auto; } #header > #hint, #input-container, #cmd-history { - margin-top: 1.8rem; + margin-top: 1.8rem; } #input-container { - display: flex; + display: flex; } #bracket { - padding-right: 0.75rem; - text-align: center; - vertical-align: middle; - line-height: 1.7rem; + padding-right: 0.75rem; + text-align: center; + vertical-align: middle; + line-height: 1.7rem; } #cmd { - border: none; - background: none; - flex: 1; + border: none; + background: none; + flex: 1; } #cmd:active, #cmd:focus { - outline: none; + outline: none; } diff --git a/assets/js/script.js b/assets/js/script.js index f1af6f6..512aa74 100644 --- a/assets/js/script.js +++ b/assets/js/script.js @@ -11,71 +11,74 @@ input.focus(); input.addEventListener('blur', (evt) => input.focus()); window.addEventListener('keypress', (evt) => { - const command = input.value.trim(); + const command = input.value.trim(); - if (evt.key === 'Enter' && command.length > 0) { - const cmdToSave = document.createElement('p'); - const output = document.createElement('p'); - cmdToSave.textContent = `> ${command}`; - cmdHistoryElement.append(cmdToSave); + if (evt.key === 'Enter' && command.length > 0) { + const cmdToSave = document.createElement('p'); + const output = document.createElement('p'); + cmdToSave.textContent = `> ${command}`; + cmdHistoryElement.append(cmdToSave); - switch (command.toLowerCase()) { - default: - output.style.color = 'red'; - output.textContent = `ERROR: Unknown command '${command}'`; - break; - case 'about': - const timeDiff = today.getTime() - new Date('2005-05-08').getTime(); - const age = Math.floor(timeDiff / (3600 * 24 * 365 * 1000)); + switch (command.toLowerCase()) { + default: + output.style.color = 'red'; + output.textContent = `ERROR: Unknown command '${command}'`; + break; + case 'about': + const timeDiff = today.getTime() - new Date('2005-05-08').getTime(); + const age = Math.floor(timeDiff / (3600 * 24 * 365 * 1000)); - output.textContent = `Maciej Pedzich is a ${age}-year-old high school student from Kielce, Poland. + output.textContent = `Maciej Pedzich is a ${age}-year-old high school student from Kielce, Poland. He makes web applications using Vue.js, Node.js, Express and MongoDB/PostgreSQL, but he likes experimenting with other solutions too. He believes that by being creative and cooperating with others, you can achieve success. When not coding, he is probably watching an F1 race, or playing retro video games.`; - break; - case 'cls': - cmdHistoryElement.textContent = ''; - break; - case 'contact': - output.innerHTML = `Email address: + break; + case 'cls': + cmdHistoryElement.textContent = ''; + break; + case 'contact': + output.innerHTML = `Email address: contact@maciejpedzi.ch`; - break; - case 'github': - window.open('https://github.com/maciejpedzich'); - break; - case 'help': - output.innerHTML = `

about - shows everything you need to know about Maciej

+ break; + case 'github': + window.open('https://github.com/maciejpedzich'); + break; + case "'help'": + output.textContent = 'Without the quotes, dummy.'; + break; + case 'help': + output.innerHTML = `

about - shows everything you need to know about Maciej

cls - clears screen

contact - displays contact information

github - opens Maciej's Github profile

help - displays a list of available commands

skills - presents a set of current skills

If on desktop/laptop, use up and down arrows to retype commands

`; - break; - case 'skills': - output.innerHTML = `

Frontend: HTML, CSS, JavaScript, TypeScript, Vue.js

+ break; + case 'skills': + output.innerHTML = `

Frontend: HTML, CSS, JavaScript, TypeScript, Vue.js

Backend: JavaScript, TypeScript, Node.js, Express

Database: MongoDB, PostgreSQL

Tooling: Git, Visual Studio Code, Bash, Windows PowerShell, Postman

Hosting/Deployment: Netlify, Heroku, Amazon Web Services, MongoDB Atlas

`; - break; - } + break; + } - cmdHistory.push(command); - cmdHistoryElement.append(output); - input.value = ''; - input.scrollIntoView(); - } + cmdHistory.push(command); + cmdHistoryElement.append(output); + input.value = ''; + input.scrollIntoView(); + } }); window.addEventListener('keydown', (evt) => { - if (cmdHistory.length > 0) { - if (evt.key === 'ArrowUp') { - cmdIndex - 1 >= 0 ? cmdIndex-- : (cmdIndex = cmdHistory.length - 1); - input.value = cmdHistory[cmdIndex]; - } else if (evt.key === 'ArrowDown') { - cmdIndex + 1 < cmdHistory.length ? cmdIndex++ : (cmdIndex = 0); - input.value = cmdHistory[cmdIndex]; - } - } + if (cmdHistory.length > 0) { + if (evt.key === 'ArrowUp') { + cmdIndex - 1 >= 0 ? cmdIndex-- : (cmdIndex = cmdHistory.length - 1); + input.value = cmdHistory[cmdIndex]; + } else if (evt.key === 'ArrowDown') { + cmdIndex + 1 < cmdHistory.length ? cmdIndex++ : (cmdIndex = 0); + input.value = cmdHistory[cmdIndex]; + } + } }); diff --git a/index.html b/index.html index 62a44d8..a0ffdb2 100644 --- a/index.html +++ b/index.html @@ -1,26 +1,26 @@ - - - - - Maciej Pędzich - - - - -
-
-
>
- -
- - + + + + + Maciej Pędzich + + + + +
+
+
>
+ +
+ +