a up to top button
This commit is contained in:
lukas-heiligenbrunner
parent
8935ea95ba
commit
8a237c61dc
@ -38,3 +38,7 @@
|
||||
.ratiobtn{
|
||||
display: none;
|
||||
}
|
||||
|
||||
#experiencecontentcontainer{
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
body, html {
|
||||
body, html, #maincontent {
|
||||
height: 100%;
|
||||
scroll-behavior: smooth;
|
||||
/*font-family: Calibre, "San Francisco", "SF Pro Text", -apple-system, system-ui, BlinkMacSystemFont, Roboto, "Helvetica Neue", "Segoe UI", Arial, sans-serif;*/
|
||||
@ -12,6 +12,29 @@ body, html {
|
||||
min-height: 530px;
|
||||
}
|
||||
|
||||
#backtotopbutton{
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
height: 88px;
|
||||
width: 120px;
|
||||
|
||||
margin-bottom: 40px;
|
||||
margin-right: 60px;
|
||||
background-color: #311E25;
|
||||
opacity: 0.5;
|
||||
transition: opacity 500ms;
|
||||
color: white;
|
||||
|
||||
border-radius: 13px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#backtotopbutton:hover{
|
||||
opacity: 1;
|
||||
transition: opacity 500ms;
|
||||
}
|
||||
|
||||
/* nav item formattings */
|
||||
.nav-item {
|
||||
text-transform: uppercase;
|
||||
@ -34,4 +57,8 @@ body, html {
|
||||
.tile {
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
#backtotopbutton{
|
||||
display: none; /* hide scroll to top button on mobile devices */
|
||||
}
|
||||
}
|
||||
49
index.html
49
index.html
@ -23,8 +23,8 @@
|
||||
</head>
|
||||
<!-- The scrollable area -->
|
||||
<body data-spy="scroll" data-target=".navbar" data-offset="50">
|
||||
|
||||
<nav class="navbar navbar-expand-sm navbar-dark fixed-top">
|
||||
<div id="maincontent">
|
||||
<nav class="navbar navbar-expand-sm navbar-dark fixed-top">
|
||||
<a class="navbar-brand" href="#">Lukas</a>
|
||||
<!-- Toggler/collapsibe Button -->
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
|
||||
@ -51,11 +51,11 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Home Page-->
|
||||
<div id="section1" class="tile">
|
||||
<!-- Home Page-->
|
||||
<div id="section1" class="tile">
|
||||
<div class="container">
|
||||
<div style="float: left;">
|
||||
<div id="preTitle">Hey, my name is</div>
|
||||
@ -70,10 +70,10 @@
|
||||
<img src="rsc/self3.png" height="100%" style="display: block;margin-left: auto; margin-right: auto">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- About Page -->
|
||||
<div id="section2" class="bg-warning tile">
|
||||
<!-- About Page -->
|
||||
<div id="section2" class="bg-warning tile">
|
||||
<div class="container">
|
||||
<div class="aboutcontainer">
|
||||
<h1>About me</h1>
|
||||
@ -81,7 +81,8 @@
|
||||
Hello! I'm Lukas, a software engineer based in Austria who enjoys building GUI-Software as well as
|
||||
things
|
||||
that live on the internet.
|
||||
I develop hardware near software exceptional websites and apps that provide intuitive and user friendly
|
||||
I develop hardware near software exceptional websites and apps that provide intuitive and user
|
||||
friendly
|
||||
interfaces with efficient and modern backends.
|
||||
I'm currently a student of the HTL Steyr and I am in the final year now.
|
||||
<br><br>
|
||||
@ -102,10 +103,10 @@
|
||||
<img src="rsc/self4.jpg" id="aboutPic">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Experience Page -->
|
||||
<div id="section3" class="tile">
|
||||
<!-- Experience Page -->
|
||||
<div id="section3" class="tile">
|
||||
<div class="container">
|
||||
<h1>Experience</h1>
|
||||
<div id="experiencecontentcontainer">
|
||||
@ -135,7 +136,8 @@
|
||||
07.2019 – 08.2019
|
||||
</div>
|
||||
<p>
|
||||
Development of picture corrections for a surface inspection robot with the help of OpenCV.<br>
|
||||
Development of picture corrections for a surface inspection robot with the help of
|
||||
OpenCV.<br>
|
||||
außeruniversitäres Forschungsinstitut
|
||||
▪ Programmieren von Bildkorrekturen für
|
||||
Oberflächeninspektionen mithilfe von OpenCV in C++
|
||||
@ -175,10 +177,10 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Projects Page -->
|
||||
<div id="section4" class="tile">
|
||||
<!-- 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!
|
||||
@ -186,10 +188,10 @@
|
||||
Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo Projects Page! Todo
|
||||
Projects Page! </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Contact Page -->
|
||||
<div id="section5" class="bg-danger tile">
|
||||
<!-- Contact Page -->
|
||||
<div id="section5" class="bg-danger tile">
|
||||
<div class="container">
|
||||
<h1>Contact</h1>
|
||||
<h3>Stay in Contact!</h3>
|
||||
@ -198,7 +200,16 @@
|
||||
Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo Contacts page!
|
||||
Todo Contacts page! Todo Contacts page! Todo Contacts page! Todo Contacts page! </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="#section1">
|
||||
<div id="backtotopbutton">
|
||||
<div style="margin-top: 25%">
|
||||
Back to Top!
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user