Skip to content

Commit

Permalink
make logo in readme center
Browse files Browse the repository at this point in the history 
update default values
add warning for print dialog
  • Loading branch information
@i5heu
i5heu committed Jan 2, 2024
1 parent ef2280b commit f2dd849
Show file tree
Hide file tree
Showing 6 changed files with 321 additions and 249 deletions.
9 changes: 7 additions & 2 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
# Faultier-CV

![](media/logo.png)
<p align="center">
<img src="media/logo.png" width="300">
</p>


This is a CV generator that allows you to generate and modify your CV in seconds without any overhead.

Expand All @@ -11,4 +14,6 @@ The name Faultier-CV is a combination of the german word "Faultier" (which means
## Features
- Generate and Edit your CV in seconds
- Save your CV as a JSON file and load it again later
- export your CV as a HTML file
- export your CV as a HTML file

Note: if you want a PDF version of your CV, you can simply print the HTML file as a PDF.
4 changes: 2 additions & 2 deletions dist/bundle.js
View file

Large diffs are not rendered by default.

272 changes: 154 additions & 118 deletions dist/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,127 +1,163 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Faultier-CV</title>
<style>
html,
body {
display: flex;
margin: 0;
padding: 0;
height: 100%;
width: 100%;
max-height: 100vh;
}
body {
display: grid;
grid-template-rows: 5em auto;
grid-template-columns: 50% 50%;
max-height: 100vh;
max-width: 100vw;
}
#editor,
body > div {
height: 100%;
width: 100%;
overflow: hidden;
}
#head {
grid-column: 1 / 3;
background-color: #131313;
color: #fff;
font-family: Arial, sans-serif;
display: flex;
align-items: center;
padding: 5px;
gap: 5px;
box-sizing: border-box;
}
#head a {
color: #fff;
text-decoration: none;
}
#head .spacer {
margin-left: 3em;

<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Faultier-CV</title>
<style>
html,
body {
display: flex;
margin: 0;
padding: 0;
height: 100%;
width: 100%;
max-height: 100vh;
}

body {
display: grid;
grid-template-rows: 5em auto;
grid-template-columns: 50% 50%;
max-height: 100vh;
max-width: 100vw;
}

#editor,
body>div {
height: 100%;
width: 100%;
overflow: hidden;
}

#head {
grid-column: 1 / 3;
background-color: #131313;
color: #fff;
font-family: Arial, sans-serif;
display: flex;
align-items: center;
padding: 5px;
gap: 5px;
box-sizing: border-box;
}

#head a {
color: #fff;
text-decoration: none;
}

#head .spacer {
margin-left: 3em;
}

#preview {
height: calc(100% - 2.3em);
overflow: hidden;
}

iframe {
border: none;
width: 100%;
height: 100%;
}

.actionButtons,
#fileTabs {
display: flex;
flex-direction: row;
gap: 1em;
align-items: center;
background-color: #131313;
color: #fff;
font-family: Arial, sans-serif;
padding: 5px;
box-sizing: border-box;
}

.actionButtons>div,
#fileTabs>div {
display: inline-flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
height: 100%;
border: 1px solid #fff;
padding: 3px;
}

.actionButtons>div:hover,
#fileTabs .active {
background-color: #fff;
color: #131313;
}

#warning {
display: none;
}

@media print {

body *,
#head,
#left,
#right {
visibility: hidden;
}
#preview {
height: calc(100% - 2.3em);
overflow: hidden;

#warning,
#warning * {
display: block;
visibility: visible;
}
iframe {
border: none;

#warning {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.actionButtons,
#fileTabs {
display: flex;
flex-direction: row;
gap: 1em;
align-items: center;
background-color: #131313;
color: #fff;
font-family: Arial, sans-serif;
padding: 5px;
box-sizing: border-box;
}
.actionButtons > div,
#fileTabs > div {
display: inline-flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
height: 100%;
border: 1px solid #fff;
padding: 3px;
}
.actionButtons > div:hover,
#fileTabs .active {
background-color: #fff;
color: #131313;
}
</style>
<script defer src="bundle.js"></script></head>
<body>
<div id="head">
<img
src="https://i5heu.github.io/Faultier-CV/media/logo.png"
height="80"
alt=""
/>
<h1>Faultier-CV</h1>
<div class="spacer"></div>
<a href="https://github.com/i5heu/Faultier-CV">Github</a>
<!-- Place this tag where you want the button to render. -->
<a
class="github-button"
href="https://github.com/i5heu/Faultier-CV"
data-size="large"
data-show-count="true"
aria-label="Star i5heu/Faultier-CV on GitHub"
>Star</a
>
</div>
<div id="left">
<div id="fileTabs">
<div data-file="html">html</div>
<div data-file="css">css</div>
<div data-file="markdown">markdown</div>
</div>
<div id="editor"></div>
}
</style>
<script defer src="bundle.js"></script></head>

<body>
<div id="head">
<img src="https://i5heu.github.io/Faultier-CV/media/logo.png" height="80" alt="" />
<h1>Faultier-CV</h1>
<div class="spacer"></div>
<a href="https://github.com/i5heu/Faultier-CV">Github</a>
<!-- Place this tag where you want the button to render. -->
<a class="github-button" href="https://github.com/i5heu/Faultier-CV" data-size="large" data-show-count="true"
aria-label="Star i5heu/Faultier-CV on GitHub">Star</a>
</div>
<div id="left">
<div id="fileTabs">
<div data-file="html">html</div>
<div data-file="css">css</div>
<div data-file="markdown">markdown</div>
</div>
<div>
<div class="actionButtons">
<div id="save">Save</div>
<div id="html">html</div>
<div id="import">Import</div>
</div>
<div id="preview">Loading...</div>
<div id="editor"></div>
</div>
<div>
<div class="actionButtons">
<div id="save">Save</div>
<div id="html">html</div>
<div id="import">Import</div>
</div>
<div id="preview">Loading...</div>
</div>
<div id="warning">
<h1>Warning</h1>
<p>As of now, using only browser-based JavaScript, it's not feasible to print HTML content into a PDF while
specifying a custom height. The workaround involves saving the HTML file, opening it, and then exporting it as a
PDF.</p>
</div>

<!-- Place this tag in your head or just before your close body tag. -->
<script async defer src="https://buttons.github.io/buttons.js"></script>
</body>

<!-- Place this tag in your head or just before your close body tag. -->
<script async defer src="https://buttons.github.io/buttons.js"></script>
</body>
</html>
</html>
7 changes: 1 addition & 6 deletions src/default.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,4 @@ export type Store = {
css: string;
};

export const defaults: Store = {
markdown:
"# Mia\nSoftware Developer\n\n[📧 Email](mailto:[email protected]) \n[🌍 Web](https://heidenstedt.org) \n[🛠GitHub](https://github.com/i5heu) \n[🐦Twitter](https://twitter.com/MiauPub) \n[🔗LinkedIn](https://www.linkedin.com/in/mia-heidenstedt-7198ab145/ ) \n[🖇Xing](https://www.xing.com/profile/Mia_Heidenstedt/cv)\n\n| | |\n|---|---|\n| Location: | Ulm, Germany |\n| Pronouns: | She/Her |\n| Phone: | Available on request |\n| Human Languages: | German, English |\n\n## Skills\n\n> ### Key Skills \n> Golang, TypeScript, SQL, Node\n\n#### Languages\nC#, CSS, HTML, JavaScript, PHP, Python, Liquid, Rust\n\n#### Frameworks\nSymfony, Doctrine, Selenium, Jest, Codeception, Svelte, Vue, Redux\n\n#### Databases\nMySql, CouchDB, RocksDB, PouchDB, Redis, SQLite, Postgres\n\n#### Systems\nLinux (Debian / Ubuntu), Nginx, Shell-Scripting, Git, Mercurial, Docker, IPFS, Shopify, Node, Github-Actions, Google Cloud Functions, WASM etc.\n\n## Experience\n\n> ### Golang Developer <small>@ Fireball Labs GmbH</small>\n> April 2022 - October 2022 \n> ***Tech:*** Golang, Svelte, ClickHouse, MySQL, Typescript, Git \n> ***Tasks:*** \n> - Implemented a interface for batch processing domain changes in nicmanager with the corresponding front end\n> - Build a background job to sync domains from nicmanager to Postgres\n> - Build a dashboard with statistics generated from ClickHouse\n> - Optimized various parts for speed and performance\n> - Initiated and implemented a swtich to a mono git repo\n\n\n> ### Frontend Developer <small>@ netshake GmbH</small>\n> March 2021 - April 2022 \n> ***Tech:*** JavaScript, PHP, Liquid, Shopify, Git, CSS \n> ***Tasks:*** \n> - implemented a synchronization middleware between MOEVE and Shopify for inventory, vouchers, orders, refunds and othe ERP functions\n> - build a framework to generate PDF-coupons through Shopify APIs \n> - build a module that allows to generate a slider with simple liquid instructions\n> - build various Shopify Shops \n\n> ### Apprenticeship Computer Science Expert <small>@ Intermetrics GmbH</small>\n> March 2018 - February 2021 \n> ***Tech:*** JavaScript, TypeScript, PHP (Symfony/Doctrine), Node, C#, Svelte, Vue, Redux, Mercurial, Google Cloud Functions, CSS, Jest, PHPUnit, Codeception, Selenium \n> ***Tasks:*** \n> - build a system to show the expected areas of change of a html module through css parameter changes\n> - implemented a low bandwidth, low latency system to sync nested data between the frontend and the server without interuptions for user in case of mild race conditions\n> - build a system to stack css animations and transitions \n> - prototyped a ui framework on top on shadow DOMs and Web Components\n\n> ### Managing Director <small>@ my own company</small>\n> September 2016 - April 2018 \n> ***Tech:*** JavaScript, Python, Bash-Scripting \n> ***Tasks:*** \n> - build a deamon to manage and run a small cluster of nodes for cluster rendering Systems\n> - used varoius software to machine with CNC Systems\n> - market investigation conducted\n> - sales and marketing\n\n## Projects\n\n> ### Faultier-CV\n> Generated this CV \n> https://github.com/i5heu/Faultier-CV\n\n> ### simple-S3-cache\n> Just hook it in front of your public S3 bucket and enjoy reduction in bandwidth costs from your bucket. \n> https://github.com/i5heu/simple-S3-cache\n\n> ### tor-simple-hidden-website \n> Create a hidden service with a static webpage in one minute. \n> https://github.com/i5heu/tor-simple-hidden-website\n\n> ### LGBTQIA.space\n> Running a Mastodon instance for the public. \n> https://lgbtqia.space\n\n#### Hobbys\nProgramming, Reading, Sailing, Community Work",
html: '<!DOCTYPE html>\n<html lang="en">\n<head>\n <meta charset="UTF-8">\n <meta http-equiv="X-UA-Compatible" content="IE=edge">\n <meta name="viewport" content="width=device-width, initial-scale=1.0">\n <title>CV</title>\n <style>\n {{css}}\n </style>\n</head>\n<body>\n <img style="display: inline-block; float: right; height: 15em;" src="https://chaos.social/system/media_attachments/files/109/218/005/993/015/344/original/b2fc03161409acc8.jpeg">\n {{markdown}}\n</body>\n</html>',
css: "html {\n font-family: Arial, Helvetica, sans-serif\n}\n\nbody {\n padding: 3em 3em 1em 3em;\n}\n\nh1 {\n margin-top: 0;\n}\n\nh4 {\n margin-bottom: 0.2em;\n}\n\np {\n margin-top: 0.3em;\n}\n\na {\n color: rgb(16, 6, 107);\n text-decoration: none;\n font-size: 1.2em;\n margin-right: 7px;\n}\n\nblockquote {\n border: 1px solid black;\n padding: 5px;\n border-radius: 5px;\n margin: 1em 0;\n}\n\nblockquote h3 {\n margin: 0;\n}\n\nblockquote p {\n margin: 0.5em 0;\n}\n\nblockquote a {\n line-height: 2em;\n font-size: 0.9em;\n margin: 0.5em 0;\n}",
};
export const defaults: Store = {"markdown":"# Mia Heidenstedt\nSoftware Developer\n\n[📧 Email](mailto:[email protected]) \n[🌍 Web](https://heidenstedt.org) \n[🛠GitHub](https://github.com/i5heu) \n[🐦Twitter](https://twitter.com/MiauPub) \n[🔗LinkedIn](https://www.linkedin.com/in/mia-heidenstedt-7198ab145/ ) \n[🖇Xing](https://www.xing.com/profile/Mia_Heidenstedt/cv)\n\n| | |\n|---|---|\n| Location: | Berlin, Germany |\n| Pronouns: | She/Her |\n| Phone: | Available on request |\n| Human Languages: | German, English |\n\n## Skills\n\n> ### Key Skills \n> Golang, TypeScript, SQL, Node\n\n#### Languages\nGolang, TypeScript, JavaScript, SQL, C#, CSS, HTML, PHP, Python, Liquid, Rust\n\n#### Frameworks\nSymfony, Doctrine, Selenium, Jest, Codeception, Svelte, Vue, Redux\n\n#### Databases\nMySql, CouchDB, RocksDB, PouchDB, Redis, SQLite, Postgres\n\n#### Systems\nLinux (Debian / Ubuntu), Nginx, Shell-Scripting, Git, Mercurial, Docker, IPFS, Shopify, Node, Github-Actions, Google Cloud Functions, WASM etc.\n\n## Experience\n\n> ### Senior Golang Developer <small>@ Devoteam GmbH</small>\n> January 2023 - NOW \n> ***Tech:*** Golang, IBM MQ, EDLS, Lambas, BlackDuck, SonarQube, Github Action, Docker, ECS, Stepfunction, S3, API Gateway, EFS \n> ***Tasks:*** \n> - Implemented IBM Message Queue using Go SDK\n> - Implemented Go Lambdas with EFS and resource optimization\n> - Cloudwatch and Postgres interactions in Go Lambdas\n> - Created Step Function with Open Search compatible logs\n> - Implemented REST interface with Open API documentation\n> - Created and expanded Github Actions Pipelines\n> - Set up a prototype of a Kafka system\n\n> ### Golang Developer <small>@ Fireball Labs GmbH</small>\n> April 2022 - October 2022 \n> ***Tech:*** Golang, Svelte, ClickHouse, MySQL, Typescript, Git \n> ***Tasks:*** \n> - Implemented a interface for batch processing domain changes in nicmanager with the corresponding front end\n> - Build a background job to sync domains from nicmanager to Postgres\n> - Build a dashboard with statistics generated from ClickHouse\n> - Optimized various parts for speed and performance\n> - Initiated and implemented a swtich to a mono git repo\n\n\n> ### Frontend Developer <small>@ netshake GmbH</small>\n> March 2021 - April 2022 \n> ***Tech:*** JavaScript, PHP, Liquid, Shopify, Git, CSS \n> ***Tasks:*** \n> - implemented a synchronization middleware between MOEVE and Shopify for inventory, vouchers, orders, refunds and othe ERP functions\n> - build a framework to generate PDF-coupons through Shopify APIs \n> - build a module that allows to generate a slider with simple liquid instructions\n> - build various Shopify Shops \n\n> ### Apprenticeship Computer Science Expert <small>@ Intermetrics GmbH</small>\n> March 2018 - February 2021 \n> ***Tech:*** JavaScript, TypeScript, PHP (Symfony/Doctrine), Node, C#, Svelte, Vue, Redux, Mercurial, Google Cloud Functions, CSS, Jest, PHPUnit, Codeception, Selenium \n> ***Tasks:*** \n> - build a system to show the expected areas of change of a html module through css parameter changes\n> - implemented a low bandwidth, low latency system to sync nested data between the frontend and the server without interuptions for user in case of mild race conditions\n> - build a system to stack css animations and transitions \n> - prototyped a ui framework on top on shadow DOMs and Web Components\n\n> ### Managing Director <small>@ my own company</small>\n> September 2016 - April 2018 \n> ***Tech:*** JavaScript, Python, Bash-Scripting \n> ***Tasks:*** \n> - build a deamon to manage and run a small cluster of nodes for cluster rendering Systems\n> - used varoius software to machine with CNC Systems\n> - market investigation conducted\n> - sales and marketing\n\n## Projects\n\n> ### Faultier-CV\n> Generated this CV \n> https://github.com/i5heu/Faultier-CV\n\n> ### simple-S3-cache\n> Just hook it in front of your public S3 bucket and enjoy reduction in bandwidth costs from your bucket. \n> https://github.com/i5heu/simple-S3-cache\n\n> ### tor-simple-hidden-website \n> Create a hidden service with a static webpage in one minute. \n> https://github.com/i5heu/tor-simple-hidden-website\n\n> ### LGBTQIA.space\n> Running a Mastodon instance for the public. \n> https://lgbtqia.space\n\n#### Hobbys\nProgramming, Reading, Sailing, Community Work","html":"<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>CV</title>\n <style>\n {{css}}\n </style>\n</head>\n<body>\n <img style=\"display: inline-block; float: right; height: 15em;\" src=\"https://heidenstedt.org/logo.webp\">\n {{markdown}}\n</body>\n</html>","css":"html {\n font-family: Arial, Helvetica, sans-serif\n}\n\nbody {\n padding: 3em 3em 1em 3em;\n}\n\nh1 {\n margin-top: 0;\n}\n\nh4 {\n margin-bottom: 0.2em;\n}\n\nimg {\n border-radius: 5px;\n}\n\np {\n margin-top: 0.3em;\n}\n\na {\n color: rgb(16, 6, 107);\n text-decoration: none;\n font-size: 1.2em;\n margin-right: 7px;\n}\n\nblockquote {\n border: 1px solid black;\n padding: 5px;\n border-radius: 5px;\n margin: 1em 0;\n}\n\nblockquote h3 {\n margin: 0;\n}\n\nblockquote p {\n margin: 0.5em 0;\n}\n\nblockquote a {\n line-height: 2em;\n font-size: 0.9em;\n margin: 0.5em 0;\n}"};
Loading

0 comments on commit f2dd849

Please sign in to comment.