Merge branch 'master' into 'projectstile'

merge master into projects

See merge request lukas/personalwebsite!1
This commit is contained in:
Lukas Heiligenbrunner 2020-03-25 21:24:44 +00:00
commit cdcaaffe87
12 changed files with 269 additions and 72 deletions

View File

@ -1,4 +1,14 @@
/* About Me*/ /*!
* about.css - https://heili.eu
* Licensed under the MIT license - http://opensource.org/licenses/MIT
* E-mail: lukas.heiligenbrunner@gmail.com
* Copyright (c) 2020 Lukas Heiligenbrunner
*/
#section2 {
background-color: #deebff;
}
#aboutmeText { #aboutmeText {
width: 100%; width: 100%;
} }
@ -22,6 +32,33 @@
height: 100%; height: 100%;
} }
.aboutcontainer a {
text-decoration: none;
}
#downloadcvbtn {
margin-top: 15%;
width: 300px;
padding: 10px;
background-color: #7a96c2;
color: black;
border-radius: 5mm;
font-size: larger;
border-width: 1mm;
border-color: #194378;
border-style: solid;
transition: background-color 500ms;
}
#downloadcvbtn:hover {
/*background-color: #facf4d;*/
color: white;
background-color: #194378;
transition: all 500ms;
}
/* screen larger than 600px -- desktop */ /* screen larger than 600px -- desktop */
@media screen and (min-width: 1201px) { @media screen and (min-width: 1201px) {
#aboutPic:hover { #aboutPic:hover {
@ -49,6 +86,7 @@
#section2 { #section2 {
height: 130%; height: 130%;
min-height: 860px;
} }
#aboutPic { #aboutPic {

57
css/contact.css Normal file
View File

@ -0,0 +1,57 @@
/*!
* contact.css - https://heili.eu
* Licensed under the MIT license - http://opensource.org/licenses/MIT
* E-mail: lukas.heiligenbrunner@gmail.com
* Copyright (c) 2020 Lukas Heiligenbrunner
*/
#section5 {
background-color: #7a96c2;
}
.personalcontacts {
margin-top: 60px;
}
.personalcontacts a {
text-decoration: none;
}
#githubsign {
margin-top: 30px;
}
#emailsign {
}
#gitlabsign {
margin-top: 30px;
position: relative;
left: -6px;
}
.contactsign {
width: 400px;
padding: 10px;
border-radius: 5mm;
font-size: larger;
color: black;
}
.contactsign:hover {
color: white;
background-color: #194378;
transition: background-color 500ms;
}
#section5 {
height: 50%;
}
/* Screen smaller than 600px -- general small width screens */
@media screen and (max-width: 1200px) {
/*#section5 {*/
/* height: 100%;*/
/*}*/
}

View File

@ -1,5 +1,13 @@
/*!
* experience.css - https://heili.eu
* Licensed under the MIT license - http://opensource.org/licenses/MIT
* E-mail: lukas.heiligenbrunner@gmail.com
* Copyright (c) 2020 Lukas Heiligenbrunner
*/
#section3 { #section3 {
background-color: #53bf65; background-color: #001631;
color: white;
} }
.content > div { .content > div {
@ -27,7 +35,7 @@
border: 6mm solid hsla(0, 100%, 50%, 0); border: 6mm solid hsla(0, 100%, 50%, 0);
padding-left: 2mm; padding-left: 2mm;
border-left-color: #357840; border-left-color: #194378;
transition: border-left-color 500ms; transition: border-left-color 500ms;
border-bottom-right-radius: 5mm; border-bottom-right-radius: 5mm;
@ -35,9 +43,10 @@
} }
.tab:hover { .tab:hover {
color: aqua; color: #74f9d4;
background-color: #357840; background-color: #194378;
transition: background-color 500ms; transition: background-color 500ms;
cursor: pointer;
} }
.ratiobtn:checked + .tab { .ratiobtn:checked + .tab {
@ -51,9 +60,9 @@
width: 80%; width: 80%;
top: -200px; top: -200px;
height: 260px; height: 260px;
background-color: #357840; background-color: #194378;
color: white; color: white;
border-radius: 5mm;; border-radius: 5mm;
} }
.ratiobtn { .ratiobtn {
@ -64,15 +73,59 @@
margin-top: 100px; margin-top: 100px;
} }
.experiencetitle{ .experiencetitle {
font-size: x-large; font-size: x-large;
} }
.companyname{ .companyname {
color: aqua; color: #74f9d4;
} }
.experienceworktext{ .experienceworktext {
margin-top: 5mm; margin-top: 5mm;
font-size: large; font-size: large;
} }
/* Screen smaller than 600px -- general small width screens */
@media screen and (max-width: 1200px) {
#section3 {
height: 100%;
min-height: 700px;
}
.tab {
display: inline;
width: auto;
/*float: left;*/
margin: 2px;
border: 0.5mm solid hsla(0, 100%, 50%, 0);
padding: 2px 2px 2px 0;
clear: none;
margin-bottom: 20px;
}
#tab1 + .tab {
margin-left: 15px;
}
#tab4 + .tab {
float: none;
display: block;
}
.content {
position: static;
display: block;
float: none;
width: auto;
height: 350px;
}
.ratiobtn:checked + .tab {
color: aqua;
background-color: #234177;
transition: border-left-color 500ms;
}
}

View File

@ -1,18 +1,32 @@
/*!
* general.css - https://heili.eu
* Licensed under the MIT license - http://opensource.org/licenses/MIT
* E-mail: lukas.heiligenbrunner@gmail.com
* Copyright (c) 2020 Lukas Heiligenbrunner
*/
body, html, #maincontent { body, html, #maincontent {
height: 100%; height: 100%;
scroll-behavior: smooth; scroll-behavior: smooth;
min-width: fit-content;
/*font-family: Calibre, "San Francisco", "SF Pro Text", -apple-system, system-ui, BlinkMacSystemFont, Roboto, "Helvetica Neue", "Segoe UI", Arial, sans-serif;*/ /*font-family: Calibre, "San Francisco", "SF Pro Text", -apple-system, system-ui, BlinkMacSystemFont, Roboto, "Helvetica Neue", "Segoe UI", Arial, sans-serif;*/
} }
h1{
text-transform: uppercase;
font-family: 'Open Sans', arial, sans-serif;
font-weight: bold;
}
/* general definition of a tile */ /* general definition of a tile */
.tile { .tile {
height: 80%; height: 80%;
padding-top: 70px; padding-top: 70px;
padding-bottom: 70px; padding-bottom: 70px;
min-height: 530px; min-height: 570px;
} }
#backtotopbutton{ #backtotopbutton {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
right: 0; right: 0;
@ -21,7 +35,7 @@ body, html, #maincontent {
margin-bottom: 40px; margin-bottom: 40px;
margin-right: 60px; margin-right: 60px;
background-color: #311E25; background-color: #194378;
opacity: 0.5; opacity: 0.5;
transition: opacity 500ms; transition: opacity 500ms;
color: white; color: white;
@ -30,7 +44,7 @@ body, html, #maincontent {
text-align: center; text-align: center;
} }
#backtotopbutton:hover{ #backtotopbutton:hover {
opacity: 1; opacity: 1;
transition: opacity 500ms; transition: opacity 500ms;
} }
@ -51,14 +65,10 @@ body, html, #maincontent {
@media screen and (max-width: 1200px) { @media screen and (max-width: 1200px) {
/*background color of collapsed navbar*/ /*background color of collapsed navbar*/
.navbar-nav { .navbar-nav {
background: #311E25; background: #001631;
} }
.tile { #backtotopbutton {
min-height: 300px;
}
#backtotopbutton{
display: none; /* hide scroll to top button on mobile devices */ display: none; /* hide scroll to top button on mobile devices */
} }
} }

View File

@ -1,6 +1,14 @@
/*!
* home.css - https://heili.eu
* Licensed under the MIT license - http://opensource.org/licenses/MIT
* E-mail: lukas.heiligenbrunner@gmail.com
* Copyright (c) 2020 Lukas Heiligenbrunner
*/
#section1 { #section1 {
background-color: #311E25; background-color: #001631;
color: white; color: white;
padding-top: 200px;
} }
.lightOpacity { .lightOpacity {
@ -12,8 +20,9 @@
} }
#preTitle { #preTitle {
font-size: 35px;
opacity: 0.8; opacity: 0.8;
color: #fffd80; color: #78ffd9;
} }
#homepicture { #homepicture {
@ -21,36 +30,42 @@
height: 400px; height: 400px;
} }
/* screen larger than 600px -- desktop */ #selfimg1 {
@media screen and (min-width: 1201px) { display: block;
#section1 { margin-left: auto;
padding-top: 200px; margin-right: auto;
} height: 100%
}
#preTitle { #titleText {
font-size: 35px; font-size: 80px;
} color: #ced5f6;
}
#titleText { #subTitleText {
font-size: 80px; font-size: 50px;
} color: #bec1d4;
}
#subTitleText { #meaningFullSentence {
font-size: 50px; width: 40%;
} color: #babccd;
}
#meaningFullSentence { /* todo maybe a bit weird?? */
width: 40%; #homepicture:hover {
} box-shadow: rgba(2, 12, 27, 0.7) 0px 10px 30px 0px;
transition: all 500ms;
}
/* todo maybe a bit weird?? */ /* height smaller than 720px */
#homepicture:hover { @media screen and (max-height: 720px) {
box-shadow: rgba(2, 12, 27, 0.7) 0px 10px 30px 0px; #homepicture {
transition: all 500ms; height: 300px;
} }
} }
/* Screen smaller than 600px -- mobile */ /* Screen smaller than 600px -- general small width screens */
@media screen and (max-width: 1200px) { @media screen and (max-width: 1200px) {
#section1 { #section1 {
padding-top: 100px; padding-top: 100px;
@ -78,4 +93,13 @@
height: 300px; height: 300px;
width: 100%; width: 100%;
} }
/* hide name tag on mobiles */
#nameTag {
display: none;
}
}
@media only screen and (min-width: 600px) {
/* For tablets: */
} }

View File

@ -1,3 +1,10 @@
#section4{ /*!
* projects.css - https://heili.eu
* Licensed under the MIT license - http://opensource.org/licenses/MIT
* E-mail: lukas.heiligenbrunner@gmail.com
* Copyright (c) 2020 Lukas Heiligenbrunner
*/
#section4 {
background-color: #6c757d; background-color: #6c757d;
} }

View File

@ -1,8 +1,9 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta NAME="author" CONTENT="Lukas Heiligenbrunner">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, user-scaleable=0">
<title>Lukas Heiligenbrunner</title> <title>Lukas Heiligenbrunner</title>
<!-- Latest compiled and minified CSS --> <!-- Latest compiled and minified CSS -->
@ -20,12 +21,13 @@
<link rel="stylesheet" href="css/about.css"> <link rel="stylesheet" href="css/about.css">
<link rel="stylesheet" href="css/experience.css"> <link rel="stylesheet" href="css/experience.css">
<link rel="stylesheet" href="css/projects.css"> <link rel="stylesheet" href="css/projects.css">
<link rel="stylesheet" href="css/contact.css">
</head> </head>
<!-- The scrollable area --> <!-- The scrollable area -->
<body data-spy="scroll" data-target=".navbar" data-offset="50"> <body data-spy="scroll" data-target=".navbar" data-offset="50">
<div id="maincontent"> <div id="maincontent">
<nav class="navbar navbar-expand-sm navbar-dark fixed-top"> <nav class="navbar navbar-expand-sm navbar-dark fixed-top">
<a class="navbar-brand" href="#">Lukas</a> <a class="navbar-brand" href="#"><div id="nameTag">Lukas</div></a>
<!-- Toggler/collapsibe Button --> <!-- Toggler/collapsibe Button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
<span class="navbar-toggler-icon"></span> <span class="navbar-toggler-icon"></span>
@ -43,9 +45,6 @@
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="#section3">Experience</a> <a class="nav-link" href="#section3">Experience</a>
</li> </li>
<li class="nav-item">
<a class="nav-link" href="#section4">Projects</a>
</li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="#section5">Contact</a> <a class="nav-link" href="#section5">Contact</a>
</li> </li>
@ -67,13 +66,13 @@
</p> </p>
</div> </div>
<div id="homepicture"> <div id="homepicture">
<img src="rsc/self3.png" height="100%" style="display: block;margin-left: auto; margin-right: auto"> <img id="selfimg1" src="rsc/self3.png" alt="">
</div> </div>
</div> </div>
</div> </div>
<!-- About Page --> <!-- About Page -->
<div id="section2" class="bg-warning tile"> <div id="section2" class="tile">
<div class="container"> <div class="container">
<div class="aboutcontainer"> <div class="aboutcontainer">
<h1>About me</h1> <h1>About me</h1>
@ -98,9 +97,15 @@
<li>Latex</li> <li>Latex</li>
<li>OpenSCAD</li> <li>OpenSCAD</li>
</ul> </ul>
<a href="rsc/curriculumvitaee.pdf" target="_blank">
<div id="downloadcvbtn">
Download Curriculum Vitae
</div>
</a>
</div> </div>
<div class="aboutPicContainer"> <div class="aboutPicContainer">
<img src="rsc/self4.jpg" id="aboutPic"> <img src="rsc/self4.jpg" alt="" id="aboutPic">
</div> </div>
</div> </div>
</div> </div>
@ -136,7 +141,8 @@
07.2019 08.2019 07.2019 08.2019
</div> </div>
<p class="experienceworktext"> <p class="experienceworktext">
Diploma thesis - "Image correction for surface inspection": Development of picture corrections for a surface inspection robot in C++. Diploma thesis - "Image correction for surface inspection": Development of picture
corrections for a surface inspection robot in C++.
A C++ library was created for equalization of one of the parts picked up by a robot arm. A C++ library was created for equalization of one of the parts picked up by a robot arm.
Surface picture Processing using OpenCV and especially the affine transformation. Surface picture Processing using OpenCV and especially the affine transformation.
</p> </p>
@ -192,26 +198,28 @@
</div> </div>
</div> </div>
<!-- Projects Page -->
<div id="section4" class="tile">
<div class="container">
<h1>Projects</h1>
<p>Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo Projects Page!
Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo Projects Page!
Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo
Projects Page! </p>
</div>
</div>
<!-- Contact Page --> <!-- Contact Page -->
<div id="section5" class="bg-danger tile"> <div id="section5" class="tile">
<div class="container"> <div class="container">
<h1>Contact</h1> <h1>Contact</h1>
<h3>Stay in Contact!</h3> <h3>I'd love to hear from You!</h3>
<p>Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo <div class="personalcontacts">
Contacts page! Todo Contacts page! <a href="mailto:lukas.heiligenbrunner@gmail.com" target="_blank">
Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo Contacts page! <div id="emailsign" class="contactsign">
Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo Contacts page! </p> <span><img src="rsc/emailicon.png" alt="" height="32px"> &nbsp; lukas.heiligenbrunner@gmail.com</span>
</div>
</a>
<a href="https://github.com/lukas-heiligenbrunner" target="_blank">
<div id="githubsign" class="contactsign">
<span><img src="rsc/GitHub-Mark-64px.png" alt="" height="32px"> &nbsp; github.com/Lukas-Heiligenbrunner</span>
</div>
</a>
<a href="https://gitlab.heili.eu/lukas" target="_blank">
<div id="gitlabsign" class="contactsign">
<span><img src="rsc/gitlab-icon-black.png" alt="" height="40px"> gitlab.heili.eu/lukas</span>
</div>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>

BIN
rsc/GitHub-Mark-64px.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

BIN
rsc/curriculumvitaee.pdf Normal file

Binary file not shown.

BIN
rsc/emailicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 382 B

BIN
rsc/gitlab-icon-black.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.9 KiB