Add files via upload
This commit is contained in:
@@ -0,0 +1,70 @@
|
||||
:root {
|
||||
--donation-modal-height: 200px;
|
||||
--donation-modal-width: 600px;
|
||||
--donation-modal-top: 50%;
|
||||
}
|
||||
|
||||
#donate {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
#donate:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#donateModal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.modal {
|
||||
top: 0;
|
||||
right: 0;
|
||||
position: absolute;
|
||||
margin: auto;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.modal .card {
|
||||
opacity: 1;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
height: var(--donation-modal-height);
|
||||
width: var(--donation-modal-width);
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.refer-area {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 700px) {
|
||||
:root {
|
||||
--donation-modal-height: 350px;
|
||||
--donation-modal-width: 600px;
|
||||
--donation-modal-top: 50%;
|
||||
}
|
||||
|
||||
.modal .card {
|
||||
vertical-align: middle;
|
||||
width: 80%;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.modal {
|
||||
position: absolute;
|
||||
margin: auto;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100% !important;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,60 @@
|
||||
.hoverable:hover {
|
||||
backdrop-filter: blur(150px);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#github_projects .stargazers {
|
||||
padding-right: var(--padding-small);
|
||||
}
|
||||
|
||||
#github_projects .stars {
|
||||
color: var(--main-txt-color) !important;
|
||||
}
|
||||
|
||||
#github_projects a {
|
||||
text-transform: capitalize;
|
||||
text-decoration-line: none;
|
||||
}
|
||||
|
||||
.github-modal>.card {
|
||||
height: 80% !important;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
#github_projects .card {
|
||||
padding: var(--padding-big);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#github_projects .card a {
|
||||
color: var(--main-txt-color) !important;
|
||||
}
|
||||
|
||||
#github_projects .card p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.github-hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.github-modal>.card {
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.github-modal img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #eaebfe;
|
||||
}
|
||||
+412
@@ -0,0 +1,412 @@
|
||||
:root {
|
||||
--main-padding: 15px;
|
||||
--main-margin: 10px;
|
||||
--main-img-size: 200px;
|
||||
--main-bio-size: 200px;
|
||||
--main-bio-margin: 5px;
|
||||
--main-icon-width: 80px;
|
||||
--main-border-radius: 5px;
|
||||
--padding-big: 20px;
|
||||
--padding-small: 5px;
|
||||
--main-container-width: 750px;
|
||||
--main-txt-color: #6F4E37;
|
||||
}
|
||||
|
||||
h2 {
|
||||
line-height-step: 100px;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
font-family: 'Outfit', Arial, sans-serif;
|
||||
margin: 0;
|
||||
color: var(--main-txt-color);
|
||||
text-align: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
background-image: url("../img/background.jpg");
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--main-txt-color);
|
||||
text-decoration-line: none;
|
||||
}
|
||||
|
||||
footer {
|
||||
padding-bottom: 5px;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
footer a {
|
||||
color: var(--main-txt-color);
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.js-reminder {
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
padding: var(--main-padding);
|
||||
}
|
||||
|
||||
.bio {
|
||||
display: none !important;
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
padding: var(--main-padding);
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
margin: var(--main-margin);
|
||||
display: grid;
|
||||
justify-content: center;
|
||||
grid-template-columns: auto auto;
|
||||
}
|
||||
|
||||
.grid-item {
|
||||
width: var(--main-bio-size);
|
||||
margin-left: var(--main-padding);
|
||||
backdrop-filter: blur(150px);
|
||||
border-radius: var(--main-border-radius);
|
||||
}
|
||||
|
||||
.grid-item h1,
|
||||
.grid-item-start h1 {
|
||||
margin: var(--main-bio-margin);
|
||||
}
|
||||
|
||||
.grid-item-start {
|
||||
grid-row-start: 1;
|
||||
grid-row-end: 8;
|
||||
}
|
||||
|
||||
.bio table .right {
|
||||
cursor: pointer;
|
||||
border-radius: var(--main-border-radius);
|
||||
backdrop-filter: blur(150px);
|
||||
}
|
||||
|
||||
.social {
|
||||
border: 0;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.project {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.project img {
|
||||
opacity: 1;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
transition: .5s ease;
|
||||
backface-visibility: hidden;
|
||||
box-shadow: 0 4px 8px 0 var(--main-txt-color);
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.project:hover img {
|
||||
opacity: 0.3
|
||||
}
|
||||
|
||||
.project:hover p {
|
||||
opacity: 1.0
|
||||
}
|
||||
|
||||
.project p {
|
||||
transition: .5s ease;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
-ms-transform: translate(-50%, -50%)
|
||||
}
|
||||
|
||||
.portfolio {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, 128px);
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.portfolio-done {
|
||||
display: grid;
|
||||
grid-template-columns: 24% 24% 24% 24%;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.portfolio-done-item {
|
||||
height: 128px;
|
||||
}
|
||||
|
||||
.social a {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
ul.nav {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
backdrop-filter: blur(150px);
|
||||
box-shadow: 0 4px 8px 0 var(--main-txt-color);
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
ul.nav li {
|
||||
float: right;
|
||||
}
|
||||
|
||||
ul.nav li a {
|
||||
display: block;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
ul.nav li a:hover:not(.active) {
|
||||
background-color: #111;
|
||||
}
|
||||
|
||||
ul.nav li a.active {
|
||||
background-color: #2F3136;
|
||||
}
|
||||
|
||||
ul.nav li.left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.card-projects {
|
||||
display: grid;
|
||||
box-shadow: 0 4px 8px 0 var(--main-txt-color);
|
||||
transition: 0.3s;
|
||||
backdrop-filter: blur(150px);
|
||||
}
|
||||
|
||||
.card-projects:hover {
|
||||
box-shadow: 0 8px 16px 0 var(--main-txt-color);
|
||||
}
|
||||
|
||||
.icon-area i {
|
||||
justify-content: space-between;
|
||||
width: var(--main-icon-width);
|
||||
padding-top: var(--main-padding);
|
||||
padding-bottom: var(--main-padding);
|
||||
border-radius: var(--main-border-radius);
|
||||
}
|
||||
|
||||
.icon-area i:hover {
|
||||
cursor: pointer;
|
||||
backdrop-filter: blur(150px);
|
||||
}
|
||||
|
||||
.icon-area a {
|
||||
color: var(#9ee700);
|
||||
}
|
||||
|
||||
.card {
|
||||
margin-top: var(--main-padding);
|
||||
box-shadow: 0 4px 8px 0 var(--main-txt-color);
|
||||
transition: 0.3s;
|
||||
backdrop-filter: blur(20px);
|
||||
padding: var(--main-padding);
|
||||
text-align: center;
|
||||
color: var(#9ee700);
|
||||
}
|
||||
|
||||
.nomargin {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.hover-items,
|
||||
.hover-items a {
|
||||
color: var(--main-txt-color);
|
||||
padding: var(--main-padding) 10px;
|
||||
font-size: large;
|
||||
margin: auto;
|
||||
line-height: 1.5em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.hover-items a:hover {
|
||||
cursor: pointer;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
||||
.profile img {
|
||||
margin: auto;
|
||||
max-width: var(--main-img-size);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
box-shadow: 0 8px 16px 0 var(--main-txt-color);
|
||||
}
|
||||
|
||||
.container {
|
||||
background: transparent;
|
||||
backdrop-filter: blur(20px);
|
||||
margin: auto;
|
||||
width: var(--main-container-width);
|
||||
}
|
||||
|
||||
.media-body {
|
||||
color: var(--main-txt-color) !important;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.table {
|
||||
color: var(--main-txt-color) !important;
|
||||
font-weight: lighter;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 700px) {
|
||||
:root {
|
||||
--mobile-margin: 5px;
|
||||
--main-container-width: 95%;
|
||||
--mobile-width: 90%;
|
||||
}
|
||||
|
||||
ul.nav li.right,
|
||||
ul.nav li {
|
||||
float: none;
|
||||
}
|
||||
|
||||
ul.nav li.left {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.portfolio-done {
|
||||
grid-template-columns: auto;
|
||||
justify-content: initial;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.portfolio-done-item {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
grid-template-columns: auto;
|
||||
}
|
||||
|
||||
.icon-area i {
|
||||
margin-top: var(--mobile-margin);
|
||||
}
|
||||
|
||||
.short_desc {
|
||||
width: var(--mobile-width);
|
||||
}
|
||||
|
||||
footer {
|
||||
width: var(--main-container-width);
|
||||
}
|
||||
|
||||
.bio-text {
|
||||
width: 95% !important;
|
||||
}
|
||||
|
||||
#left-arrow {
|
||||
position: initial !important;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
#right-arrow {
|
||||
position: initial !important;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.max60 {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#bio {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.max60 {
|
||||
max-width: 90%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
#bio:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#right-arrow {
|
||||
position: relative;
|
||||
-webkit-animation: linear infinite alternate;
|
||||
-webkit-animation-name: runRight;
|
||||
-webkit-animation-duration: 2s;
|
||||
}
|
||||
|
||||
#left-arrow {
|
||||
position: relative;
|
||||
-webkit-animation: linear infinite alternate;
|
||||
-webkit-animation-name: runLeft;
|
||||
-webkit-animation-duration: 2s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes runLeft {
|
||||
0% {
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
50% {
|
||||
left: 70%;
|
||||
}
|
||||
|
||||
100% {
|
||||
left: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes runRight {
|
||||
0% {
|
||||
right: 50%;
|
||||
}
|
||||
|
||||
50% {
|
||||
right: 70%;
|
||||
}
|
||||
|
||||
100% {
|
||||
right: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.hover-items {
|
||||
display: grid;
|
||||
grid-template-columns: auto auto auto;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bio-text {
|
||||
font-size: 20px;
|
||||
opacity: 0;
|
||||
width: 60%;
|
||||
margin-bottom: 15px !important;
|
||||
margin: auto;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1025px) {
|
||||
.circle {
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
border-radius: 24px;
|
||||
background-color: black;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
z-index: 99999999;
|
||||
}
|
||||
}
|
||||
BIN
Binary file not shown.
|
After Width: | Height: | Size: 259 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 352 KiB |
@@ -0,0 +1,89 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<title>Julian Lechner</title>
|
||||
<link rel="shortcut icon" type="image/png" href="../favicon.ico" />
|
||||
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/style.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/github.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/donation.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="container">
|
||||
<div class="card profile">
|
||||
|
||||
<h1>Imprint</h1>
|
||||
|
||||
<p>Information according to §5 TMG</p>
|
||||
|
||||
<p>
|
||||
Julian Lechner<br>
|
||||
Ulmenstraße 9<br>
|
||||
3380 Pöchlarn<br>
|
||||
Lower Austria<br>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<strong>Represented by:</strong><br>
|
||||
Julian Lechner<br>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<strong>Contact:</strong><br>
|
||||
Phone: +43 (0) 660 9254001<br>
|
||||
E-Mail: fraujulian@lechner.top</br>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<strong>Abuse Contact:</strong><br>
|
||||
E-Mail: abuse@fraujulian.xyz</br>
|
||||
</p> <br>
|
||||
|
||||
<p>
|
||||
<strong>Disclaimer:</strong> <br> <br>
|
||||
|
||||
<strong>Liability for links</strong> <br> <br>
|
||||
Our website contains links to external third-party websites over whose content we have no influence. Therefore, we cannot accept any liability for this third-party content. The respective provider or operator of the pages is always responsible for the content of the linked pages. The linked pages were checked for possible legal violations at the time of linking. Illegal content was not recognizable at the time of linking. However, permanent monitoring of the content of the linked pages is not reasonable without concrete evidence of an infringement. If we become aware of any legal infringements, we will remove such links immediately. <br> <br>
|
||||
|
||||
<strong>Google Analytics</strong> <br> <br>
|
||||
This website uses Google Analytics, a web analysis service of Google Inc (''Google''). Google Analytics uses "cookies", which are text files placed on your computer, to help the website analyze how users use the site. The information generated by the cookie about your use of the website (including your IP address) will be transmitted to and stored by Google on servers in the United States. Google will use this information for the purpose of evaluating your use of the website, compiling reports on website activity for website operators and providing other services relating to website activity and internet usage. Google may also transfer this information to third parties where required to do so by law, or where such third parties process the information on Google's behalf. Google will not associate your IP address with any other data held by Google. You may refuse the use of cookies by selecting the appropriate settings on your browser, however please note that if you do this you may not be able to use the full functionality of this website. By using this website, you consent to the processing of data about you by Google in the manner and for the purposes set out above. <br> <br>
|
||||
|
||||
<strong>Google AdSense</strong><br><br>
|
||||
This website uses Google Adsense, a web advertising service of Google Inc, USA (''Google''). Google Adsense uses so-called ''cookies'' (text files), which are stored on your computer and enable your use of the website to be analyzed. Google Adsense also uses so-called ''web beacons'' (small invisible graphics) to collect information. By using the web beacon, simple actions such as visitor traffic on the website can be recorded and collected. The information generated by the cookie and/or web beacon about your use of the website (including your IP address) will be transmitted to and stored by Google on servers in the United States. Google will use this information for the purpose of evaluating your use of the website with regard to the advertisements, compiling reports on website activity and advertisements for website operators and providing other services relating to website activity and internet usage. Google may also transfer this information to third parties where required to do so by law, or where such third parties process the information on Google's behalf. Google will not associate your IP address with any other data held by Google. You can prevent the storage of cookies on your hard disk and the display of web beacons by selecting ''Do not accept cookies'' in your browser settings (in MS Internet Explorer under ''Tools > Internet Options > Privacy > Settings''; in Firefox under ''Tools > Settings > Privacy > Cookies''); however, we would like to point out that in this case you may not be able to use all functions of this website to their full extent. By using this website, you consent to the processing of data about you by Google in the manner and for the purposes set out above.
|
||||
</p>
|
||||
|
||||
|
||||
<div class="max60">
|
||||
<div id="short-desc" class="hover-items">
|
||||
<i id="left-arrow" class="fas fa-arrow-right"></i>
|
||||
<a onclick="plausible('expandprofile')" href="https://fraujulian.xyz/"><h1>Back</h1></a>
|
||||
<i id="right-arrow" class="fas fa-arrow-left"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<p>
|
||||
<a href="imprint.html">Imprint</a>
|
||||
|
|
||||
©
|
||||
<script>document.write(new Date().getFullYear())</script> Julian Lechner - All rights reserved.
|
||||
</p>
|
||||
|
||||
<script src="../js/github.js"></script>
|
||||
<script src="../js/dynamic.js"></script>
|
||||
|
||||
<script rel="preload" data-name="BMC-Widget" data-cfasync="false" src="https://cdnjs.buymeacoffee.com/1.0.0/widget.prod.min.js" data-id="fraujuliannn" data-description="Support me on Buy me a hot choclate!" data-message="" data-color="#5F7FFF" data-position="Right" data-x_margin="18" data-y_margin="18" defer></script>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
+154
@@ -0,0 +1,154 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<meta name="google-adsense-account" content="ca-pub-8132805866670069">
|
||||
|
||||
<title>Julian Lechner</title>
|
||||
<link rel="shortcut icon" type="image/png" href="favicon.ico"/>
|
||||
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/style.css"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/github.css"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/donation.css"/>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="card profile">
|
||||
<img src="img/logo.png" width="200px" height="200px" fetchpriority="low">
|
||||
<h1>Hii! 👋 I'm Julian Lechner!</h1>
|
||||
<h2>aka. FrauJulian or Julie</h2>
|
||||
|
||||
<div class="max60">
|
||||
<div id="short-desc" class="hover-items">
|
||||
<i id="left-arrow" class="fas fa-arrow-right"></i>
|
||||
<a onclick="plausible('expandprofile')">A young enthusiastic developer from Austria!</a>
|
||||
<i id="right-arrow" class="fas fa-arrow-left"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bio-text hidden">
|
||||
<p>
|
||||
I come from beautiful Lower Austria and my name is Julian, many people also call me Julie. I spend most of my time in front of the PC, so I am very tied to it. In my spare time I spend a lot of time diving all over Austria in various lakes with compressed air and possibly with technical gases.
|
||||
<br />
|
||||
<br />
|
||||
I mainly work for the company SobIT GmbH as a software developer. This company develops software for care services.
|
||||
<br />
|
||||
<br />
|
||||
I also work as a software developer and support technician for the sole proprietorship SynHost. This company rents out servers in various data centers in Europe.
|
||||
<br />
|
||||
<br />
|
||||
Currently you can buy services from me. Especially in the NodeJS area. e.g. Discord/Telegram bots, APIs, websites and co. On request, I am also happy to develop other applications with other programming languages, e.g. C#, Java, TypeScript
|
||||
<br />
|
||||
<br />
|
||||
<h3>Just contact me!</h3>
|
||||
</p>
|
||||
</div>
|
||||
<div class="icon-area">
|
||||
|
||||
<a href="mailto:contact@fraujulian.xyz" onclick="plausible('envelope')" target="_blank">
|
||||
<i class="fa-solid fa-envelope fa-3x"></i></a>
|
||||
|
||||
<a href="tel:+436609254001" onclick="plausible('phone')" target="_blank">
|
||||
<i class="fa-solid fa-phone fa-3x"></i></a>
|
||||
|
||||
<a href="https://discord.com/users/860206216893693973" onclick="plausible('discord')" target="_blank">
|
||||
<i class="fab fa-discord fa-3x"></i></a>
|
||||
|
||||
<a href="https://github.com/fraujulian" onclick="plausible('github')" target="_blank">
|
||||
<i class="fab fa-github fa-3x"></i></a>
|
||||
|
||||
</div>
|
||||
<div class="bio grid-container">
|
||||
<div class="grid-item-start">
|
||||
<h1>I develop with</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>NodeJS</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>C#</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>WPF</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>.NET</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>NPM</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>HTML</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>Java</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>CSS</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>JavaScript</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>Linux</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>Windows</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>SQL</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>VSC</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>Cloudflare</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>express</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>TypeScript</h1>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<h1>DOCKER</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="github_projects" class="card">
|
||||
Loading...
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<p>
|
||||
<a href="/imprint/">Imprint</a>
|
||||
|
|
||||
©
|
||||
<script>document.write(new Date().getFullYear())</script> Julian Lechner - All rights reserved.
|
||||
</p>
|
||||
|
||||
<script rel="preload" src="js/github.js"></script>
|
||||
<script rel="preload" src="js/dynamic.js"></script>
|
||||
|
||||
<script rel="preload" data-name="BMC-Widget" data-cfasync="false" src="https://cdnjs.buymeacoffee.com/1.0.0/widget.prod.min.js" data-id="fraujuliannn" data-description="Support me on Buy me a hot choclate!" data-message="" data-color="#5F7FFF" data-position="Right" data-x_margin="18" data-y_margin="18" defer></script>
|
||||
|
||||
<script rel="preload" async src="https://www.googletagmanager.com/gtag/js?id=G-33TY5MDJ3X"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-33TY5MDJ3X');
|
||||
</script>
|
||||
|
||||
<script rel="preload" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8132805866670069" crossorigin="anonymous" defer></script>
|
||||
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,60 @@
|
||||
let bioBtn = document.getElementById('short-desc');
|
||||
let bioModel = document.getElementsByClassName('bio-text')[0];
|
||||
let leftArrow = document.getElementById("left-arrow");
|
||||
let rightArrow = document.getElementById("right-arrow");
|
||||
let hidden = true;
|
||||
bioBtn.onclick = function () {
|
||||
if (hidden) {
|
||||
bioModel.classList.remove("hidden");
|
||||
leftArrow.classList.remove("fa-arrow-right");
|
||||
leftArrow.classList.add("fa-arrow-down");
|
||||
rightArrow.classList.remove("fa-arrow-left");
|
||||
rightArrow.classList.add("fa-arrow-down");
|
||||
leftArrow.style.position = "relative";
|
||||
rightArrow.style.position = "relative";
|
||||
unfade(bioModel);
|
||||
} else {
|
||||
bioModel.classList.add("hidden");
|
||||
leftArrow.classList.remove("fa-arrow-down");
|
||||
leftArrow.classList.add("fa-arrow-right");
|
||||
rightArrow.classList.remove("fa-arrow-down");
|
||||
rightArrow.classList.add("fa-arrow-left");
|
||||
leftArrow.style.position = "relative";
|
||||
rightArrow.style.position = "relative";
|
||||
fade(bioModel);
|
||||
}
|
||||
hidden = !hidden;
|
||||
};
|
||||
|
||||
bioModel.onclick = function (evt) {
|
||||
if (evt.target == bioModel) {
|
||||
bioModel.classList.add("hidden");
|
||||
document.body.style.opacity = 1;
|
||||
}
|
||||
};
|
||||
|
||||
function fade(element) {
|
||||
var op = 1;
|
||||
var timer = setInterval(function () {
|
||||
if (op <= 0.1) {
|
||||
clearInterval(timer);
|
||||
element.style.display = 'none';
|
||||
}
|
||||
element.style.opacity = op;
|
||||
element.style.filter = 'alpha(opacity=' + op * 100 + ")";
|
||||
op -= op * 0.1;
|
||||
}, 5);
|
||||
}
|
||||
|
||||
function unfade(element) {
|
||||
var op = 0.1;
|
||||
element.style.display = 'block';
|
||||
var timer = setInterval(function () {
|
||||
if (op >= 1) {
|
||||
clearInterval(timer);
|
||||
}
|
||||
element.style.opacity = op;
|
||||
element.style.filter = 'alpha(opacity=' + op * 100 + ")";
|
||||
op += op * 0.1;
|
||||
}, 5);
|
||||
}
|
||||
@@ -0,0 +1,84 @@
|
||||
window.onload = function () {
|
||||
let script = document.createElement("script");
|
||||
script.src = "https://cdnjs.cloudflare.com/ajax/libs/showdown/2.1.0/showdown.min.js";
|
||||
document.body.appendChild(script);
|
||||
|
||||
const sortOnKey = (key, desc) => {
|
||||
return (a, b) => {
|
||||
a = a[key];
|
||||
b = b[key];
|
||||
return desc ? b - a : a - b;
|
||||
}
|
||||
};
|
||||
|
||||
String.prototype.replaceAt = function (index, replacement) {
|
||||
return this.substr(0, index) + replacement + this.substr(index + replacement.length);
|
||||
}
|
||||
fetch("https://api.github.com/users/fraujulian/repos?per_page=999")
|
||||
.then(response => response.json())
|
||||
.then(projects => {
|
||||
projects = projects.sort(sortOnKey("stargazers_count", true));
|
||||
let projectsDiv = document.getElementById("github_projects");
|
||||
projectsDiv.innerHTML = "";
|
||||
projectsDiv.classList = "";
|
||||
for (let i = 0; i < 16; i++) {
|
||||
let projectDiv = document.createElement("div");
|
||||
projectDiv.classList = "card hoverable";
|
||||
let project = projects[i];
|
||||
if (project != undefined) {
|
||||
if (project.description == null)
|
||||
project.description = "This project has no description";
|
||||
if (project.language == null)
|
||||
project.language = "No language stored!";
|
||||
project.name = project.name.replaceAll('_', ' ').replaceAll('-', ' ');
|
||||
projectDiv.innerHTML = `
|
||||
<div class="media">
|
||||
<div class="media-body">
|
||||
<a href="${project.html_url}" onclick="plausible('${project.name}')" target="_blank">
|
||||
<strong class="d-block text-gray-dark">${project.name}</strong>
|
||||
</a>
|
||||
<div class="stars" style="float:right;">
|
||||
📕 ${project.language} <br>
|
||||
⭐ ${project.stargazers_count}
|
||||
</div>
|
||||
</div>
|
||||
<p>${project.description}</p>
|
||||
</div>
|
||||
`;
|
||||
fetch(`https://raw.githubusercontent.com/${project.full_name}/master/README.md`)
|
||||
.then(response => response.text())
|
||||
.then(text => {
|
||||
let converter = new showdown.Converter();
|
||||
let html = converter.makeHtml(text);
|
||||
let projectModal = document.createElement("div");
|
||||
projectModal.classList = "modal github-modal hidden";
|
||||
projectModal.innerHTML = `
|
||||
<div class="card">
|
||||
<a onclick="location.reload()" href="#" style="float: right"> ❌</a>
|
||||
<a href="${project.html_url}" target="blank" style="float: left"> Visit on GitHub</a>
|
||||
<br>
|
||||
<br>
|
||||
${html}
|
||||
</div>
|
||||
`;
|
||||
|
||||
projectDiv.onclick = function () {
|
||||
projectModal.classList.remove("hidden");
|
||||
document.body.scrollTop = 0; // Safari
|
||||
document.documentElement.scrollTop = 0; // Chrome Firefox IE Opera
|
||||
document.body.style.opacity = 0.2;
|
||||
};
|
||||
|
||||
projectModal.onclick = function (evt) {
|
||||
if (evt.target == projectModal) {
|
||||
projectModal.classList.add("hidden");
|
||||
document.body.style.opacity = 1;
|
||||
}
|
||||
};
|
||||
document.getElementsByTagName("html")[0].appendChild(projectModal);
|
||||
});
|
||||
projectsDiv.appendChild(projectDiv);
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
Reference in New Issue
Block a user