complete website rework beginning

This commit is contained in:
2023-07-13 16:52:23 +02:00
parent ad14c03206
commit e5b3585761
32 changed files with 227 additions and 0 deletions

44
src/404.html Executable file
View File

@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html>
<head>
<title>404 - Page not Found - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
<link rel="stylesheet" href="/css/mainstyle.css">
<style>
.errorpage {
text-align: center;
width: 100%;
}
.box {
text-align: center;
width: 50%;
margin: 25%;
margin-top: 10%;
margin-bottom: 0%;
}
.Bigtext {
font-size: 400%;
}
.smalltext {
font-size: 150%;
}
</style>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="errorpage">
<div class="mainstyle">
<h2 class="Bigtext">The page you are looking for was not found</h2>
<p class="smalltext">The page you are looking for does not exist. It may have been moved, or removed altogether. Perhaps you can return back to the site's homepage and see if you can find what you are looking for.</p>
<br><br><br>
<a href="/" class="linkbutton">Go to homepage</a>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

33
src/about/aboutme/index.html Executable file
View File

@@ -0,0 +1,33 @@
<!DOCTYPE html>
<html>
<head>
<title>About - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./css/mainstyle.css">
<script defer src="./js/jquery.js"></script>
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<script defer src="./js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<div class="title-container">
<h1 class="title">About me</h1>
</div>
<div class="content">
<p>My name is Janis Hutz, I am 19 years old and am learning to code in many different programming languages. By now I am quite fluent in a couple of programming languages, including Swift & SwiftUI (Apple's programming languages); Python (with three different Graphical User Interface Toolkits (Kivy (and KivyMD), PyQT5 and PyGTK)); JavaScript, TypeScript, HTML and CSS. You may find my iOS Apps on the AppStore and most of my other projects as Free & Open Source Software over on GitHub. Usually, when I OpenSource a project, I tend to use the GNU General Public License V3.0 (GPL V3), as this allows you (if you are a FOSS-dev) to do the most with this code whilst not helping out big companies like Google, Micro$oft, etc.</p>
<p>I spend most of my freetime coding, as this is what I enjoy the most, other than that I am a passionate Archlinux user, so I spend occasionally some time troubleshooting something. Therefore I am not a big fan of Micro$oft, Google or Meta, but I quite adore the work that Apple does, surprisingly.</p>
<p>As I am still in my studies, my time to code is limited to what I can do outside of school, and sadly I cannot yet go to University, as I am too young and I haven't finished secondary school yet.</p>
<br><br>
</div>
<div class="itemsInline">
<a class="linkbutton" href="https://github.com/simplePCBuilding">Github</a>
<a class="linkbutton" href="https://apps.apple.com/us/developer/janis-hutz/id1636936538">AppStore</a>
</div>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

30
src/about/index.html Normal file
View File

@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html>
<head>
<title>About - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./css/mainstyle.css">
<script defer src="./js/jquery.js"></script>
<script defer src="./js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<div class="title-container">
<h1 class="title">About janishutz.com</h1>
</div>
<div class="content">
<hr class="pullquote-lines">
<h3 class="content-title-small">Technology is a remarkably interesting topic, that many people take for granted.</h3>
<hr class="pullquote-lines">
<p style="text-align: center; font-size: 120%;">Get support if you are stuck on a problem, purchase a new, fully customised PC, that is configured according to your needs* and get a webpage created for you.</p>
</div>
<div class="itemsInline">
<a class="linkbutton" href="/about.html">About me</a>
<a class="linkbutton" href="/privacypolicy.html">Privacy Policy</a>
<a class="linkbutton" href="/services.html">Services</a>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

BIN
src/assets/Logo.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

BIN
src/assets/codeSnippet.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

BIN
src/assets/logo.xcf Normal file

Binary file not shown.

31
src/css/altstyle.css Executable file
View File

@@ -0,0 +1,31 @@
html, body {
height: 100%;
width: 100%;
padding: 0;
margin: 0;
background-color: gray;
color: white;
}
.logo img {
width: 10%
}
div {
margin-right: 10%;
margin-left: 10%;
margin-top: 2%;
margin-bottom: 2%;
padding: 10%;
padding-top: 5%;
padding-bottom: 5%;
border-color: black;
border-style: double;
border-radius: 3%;
background-color:dimgray;
}
h1 {
font-size: 300%;
}

24
src/css/footerstyle.css Executable file
View File

@@ -0,0 +1,24 @@
.Footer-box {
background-color: #38444d;
width: 100%;
margin-bottom: -1%;
display: flex;
justify-content: center;
}
.footer-content-box {
width: 80%;
padding: 2%;
}
.footer-center-box {
display: flex;
justify-content: center;
}
.footer-logo {
width: 10%;
display: inline-block;
position: relative;
vertical-align: middle;
}

195
src/css/mainstyle.css Executable file
View File

@@ -0,0 +1,195 @@
/*
*
* janishutz.com - mainstyle.css
*
*
* Created 2023 by Janis Hutz
*/
/*
Set size of html and body to full width
*/
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
font-size: calc(14pt + 0.395vw);
}
body {
background-color: rgba(70, 72, 167, 0.5);
font-family: sans-serif;
}
/*
Style for quotes
*/
.bigquote {
width: 40%;
font-size: 300%;
}
.biggerquote {
font-size: 150%;
}
/*
Styling for the main content element
*/
.mainstyle {
margin-right: 5%;
margin-left: 5%;
margin-top: 2%;
margin-bottom: 2%;
padding: 5%;
padding-top: 3%;
padding-bottom: 3%;
border-color: black;
border-style: none;
border-radius: 50px;
background-color: rgba(195, 195, 229, 1);
}
/*
Styling for links and buttons
*/
.textlink {
font-size: 100%;
text-decoration: none;
color: black;
transition: 1s;
}
.textlink:hover {
color: darkblue;
font-size: 115%;
transition: 0.3s;
}
.linkbutton {
text-decoration: none;
display: inline-block;
padding: 20px;
color: white;
background-color:rgba(0, 40, 131, 1);
border-radius: 25px;
transition: 1s;
}
.linkbutton:hover {
background-color: darkblue;
border-radius: 5px;
transition: 0.3s;
}
.references {
color: gray;
}
/*
This styles the container for the home page
*/
.title-container {
background-image: url('/assets/codeSnippet.png');
background-repeat: no-repeat;
background-size: cover;
width: 100%;
height: 40vh;
border-radius: 20px;
color: white;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.title {
text-align: center;
font-size: 2.3rem;
}
.subtitle {
text-align: center;
font-size: 1.3rem;
}
.content {
font-size: 1rem;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 5%;
margin-bottom: 10%;
}
.content-title {
font-size: 3rem;
text-align: center;
}
.content-title-small {
font-size: 2rem;
text-align: center;
}
.pullquote-lines {
border-color: black;
margin-bottom: 2%;
margin-top: 2%;
width: 100%;
}
/*
Bottom container styling
*/
.bottom {
display: flex;
width: 100%;
justify-content: center;
align-items: center;
flex-direction: column;
}
.element {
text-align: center;
}
@media only screen and (min-width: 999px) {
/*
Align content side by side
*/
.sidebyside {
width: 100%;
display: flex;
flex-grow: 1;
gap: 5%;
}
.element {
width: 47%;
}
.itemsInline {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
gap: 5%;
margin-top: 3%;
margin-bottom: 3%;
}
.mainstyle {
margin-right: 10%;
margin-left: 10%;
padding: 10%;
padding-top: 5%;
padding-bottom: 5%;
}
}

155
src/css/menustyle.css Executable file
View File

@@ -0,0 +1,155 @@
/*
*
* janishutz.com - menustyle.css
*
*
* Created 2023 by Janis Hutz
*/
::selection {
background-color: darkblue;
color: white;
}
.Menu {
font-size: 0.8rem;
margin-top: -1%;
padding: 2%;
padding-left: 0;
padding-right: 0;
width: 100%;
overflow: hidden;
background-color: rgba(56, 68, 77, 1);
}
.logo {
height: 10vh;
display: inline-block;
margin-left: 2%;
position: relative;
vertical-align: middle;
}
.menu-container {
display: none;
width: 80%;
}
.active {
color: rgba(184, 214, 240, 1);
}
.listtoggle {
text-decoration: none;
color: black;
font-size: 2.5rem;
margin-right: 7%;
cursor: pointer;
}
.toggle-wrapper {
display: inline-flex;
height: 100%;
width: 70%;
align-items: center;
justify-content: flex-end;
}
.menu-container, .dropdown-menu {
list-style: none;
margin: 0 5%;
padding: 0;
}
.menubutton {
text-decoration: none;
width: 96%;
display: block;
padding: 2%;
color: white;
transition: 0.6s;
}
.menubutton:hover {
background-color: darkblue;
transition: 0.2s;
}
.sub {
width: 96%;
}
.dropdown-menu {
width: 95%;
}
@media only screen and (min-width: 999px) {
.listtoggle, .toggle-wrapper {
display: none;
}
.menu-wrapper {
display: inline-block;
}
.menu-container {
display: inline-flex;
list-style-type: none;
width: 80%;
margin: 0;
justify-content: center;
}
.menubutton {
text-decoration: none;
display: inline-block;
padding: 20px;
width: inherit;
color: white;
border-radius: 0%;
background-color: rgba(0,0,0,0);
transition: 0.6s;
}
.sub {
width: 92%;
padding: 20px 4%;
}
.menubutton:hover {
border-radius: 0%;
background-color: darkblue;
transition: 0.3s;
}
.dropdown-menu {
margin: 0;
padding: 0;
width: fit-content;
background-color: lightseagreen;
display: none;
list-style-type: none;
position: absolute;
min-width: 200px;
transform-origin: top center;
flex-direction: column;
}
@keyframes growDown {
0% {
transform: scaleY(0);
}
100% {
transform: scaleY(1);
}
}
.dropdown:hover .dropdown-menu {
display: flex;
animation: growDown 0.3s ease-in-out;
}
.mainitems {
display: inline-block;
}
}

65
src/css/nav/menu.css Normal file
View File

@@ -0,0 +1,65 @@
#menu {
color: white;
transform: scale( 0 );
transform-origin: top right;
transition: all 1s;
position: fixed;
top: 0;
right: 0;
width: 100vw;
height: 100vh;
cursor: default;
background-color: rgb(18, 12, 59);
}
#menu.open {
transform: scale( 1 );
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.menu-container {
width: 80%;
height: 80%;
}
.menu-main {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
flex-wrap: wrap;
}
.menu-category {
padding: 2vw;
transition: all 1s;
transition-delay: 0.5s;
}
/* TODO: Make multiple steps for this
TODO: Optimise for mobile devices (scale vertically) */
.menu-category:hover {
padding-right: 15vw;
transition-delay: 0s;
}
.category-list {
transition: all 0.5s;
transform: scaleY( 0 );
position: absolute;
transform-origin: top;
transition-delay: 0s;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: column;
}
.menu-category:hover .category-list {
transform: scaleY( 1 );
transition-delay: 0.5s;
}

87
src/css/nav/toggle.css Normal file
View File

@@ -0,0 +1,87 @@
.nav-container {
height: 13vh;
width: 13vh;
right: 0;
top: 0;
z-index: 9;
position: fixed;
transition: all 2s ease-in-out;
cursor: pointer;
}
.nav-toggle-container {
background-color: rgb(21, 21, 73);
width: 100%;
height: 100%;
z-index: 10;
justify-content: flex-start;
position: relative;
display: flex;
align-items: flex-end;
flex-direction: column;
border-bottom-left-radius: 100%;
}
.nav-container:hover {
height: 20vh;
width: 20vh;
transition: all 0.5s ease-in-out;
}
.nav-toggle-positioner {
width: 75%;
height: 75%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.nav-toggle {
text-decoration: none;
color: rgb(168, 212, 253);
font-size: 5vh;
cursor: pointer;
width: 35px;
height: 27px;
z-index: 11;
transition: 0.8s;
display: flex;
flex-direction: column;
justify-content: space-between;
}
/* Nav-Hide-Show button idea from here: https://codepen.io/alvarotrigo/pen/wvrzPWL*/
.line {
display: block;
width: 100%;
height: 3px;
background-color: rgb(49, 142, 230);
}
#line1 {
transform-origin: 0% 0%;
transition: transform 0.4s ease-in-out;
}
#line2 {
transition: transform 0.2s ease-in-out;
}
#line3 {
transform-origin: 0% 100%;
transition: transform 0.4s ease-in-out;
}
.nav-toggle.active #line1 {
transform: rotate( 45deg );
}
.nav-toggle.active #line2 {
transform: scaleY(0);
}
.nav-toggle.active #line3 {
transform: rotate( -45deg );
}

BIN
src/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 174 KiB

17
src/footer.html Executable file
View File

@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="/css/footerstyle.css">
<title>Footer - janishutz.com</title>
</head>
<body>
<div class="Footer-box">
<div class="footer-content-box">
<img src="/assets/Logo.png" class="footer-logo">
<div class="footer-center-box">
<a href="/privacypolicy.html" class="linkbutton" id="ppbtn">Privacy Policy</a>
</div>
</div>
</div>
</body>

63
src/index.html Executable file
View File

@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html>
<head>
<title>Home - janishutz.com</title>
<meta name="description" content="Discover my Software projects and services, and get support if you encounter problems.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<div class="title-container">
<h1 class="title">Welcome to janishutz.com!</h1>
<h2 class="subtitle">iOS Apps, PC apps, Websites, PC Building & Support</h2>
</div>
<div class="content">
<h2 class="content-title">My work</h2>
<div class="sidebyside">
<div class="element">
<h3>Custom Websites</h3>
<p>Get your new online presence as anything ranging from a simple static website like this one to a highly complex webapp like <a href="https://libreevent.janishutz.com" class="textlink" style="color: darkblue" target="_blank">libreǝvent</a> or the <a href="https://booking.languageschoolhossegor.com" class="textlink" style="color: darkblue" target="_blank">Language School Hossegor Booking system</a></p>
<a href="https://development.janishutz.com" class="linkbutton">Learn more</a>
</div>
<div class="element">
<h3>PC Building</h3>
<p>Are you looking for a new gaming or work PC that is perfectly fitted for your needs and has an upgrade path in the future and you live in Switzerland? Here you can get your new, fully customised PC!</p>
<a href="https://pcbuilding.janishutz.com" class="linkbutton">Learn more</a>
</div>
</div>
<div class="sidebyside">
<div class="element">
<h3>iOS Apps</h3>
<p>My iOS apps mostly focus on things you use or do day-to-day. You can view and download my apps on the Apple AppStore</p>
<a href="https://apps.apple.com/us/developer/janis-hutz/id1636936538" class="linkbutton">AppStore</a>
</div>
<div class="element">
<h3>Open Source Software</h3>
<p>As a huge Open Source fan, I also developed some software whose code you can freely use, if your project uses the GPL V3 License. I am also contributing to a JavaScript presentation framework called <a href="https://impress.js.org" class="textlink" style="color: darkblue">impress.js</a></p>
<a href="https://github.com/simplePCBuilding" class="linkbutton">GitHub</a>
</div>
</div>
<div class="sidebyside">
<div class="element">
<h3>libreǝvent</h3>
<p>libreǝvent is THE free and open source event management solution with which you can save lots of time and money when managing your events!</p>
<a href="https://libreevent.janishutz.com" class="linkbutton">Learn more</a>
</div>
</div>
</div>
<div class="bottom">
<h2 class="content-title">Check out my projects!</h2>
<a class="linkbutton" href="/projects.html">Projects</a>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

20
src/js/basicanimations.js Executable file
View File

@@ -0,0 +1,20 @@
$( document ).ready( function() {
$( '#ContentToInclude' ).load( '/menu.html' );
$( '#Footer' ).load('/footer.html');
setTimeout( highlightLocation, 200 );
} );
function highlightLocation () {
let pagename = $(location).attr( 'pathname' );
if ( pagename.slice(0, 8) == '/project' ) {
$( '#projects' ).css( 'background-color', 'darkblue' );
} else if ( pagename.slice( 0, 6 ) == '/about' || pagename.slice( 0, 14 ) == '/privacypolicy' ) {
$( '#about' ).css( 'background-color', 'darkblue' );
} else if ( pagename.slice( 0, 6 ) == '/' || pagename == '/index.html' ) {
$( '#home' ).css( 'background-color', 'darkblue' );
} else if ( pagename.slice( 0, 8 ) == '/support' ) {
$( '#support' ).css( 'background-color', 'darkblue' );
} else if ( pagename.slice( 0, 9 ) == '/services' ) {
$( '#services' ).css( 'background-color', 'darkblue') ;
};
}

10911
src/js/jquery.js vendored Executable file

File diff suppressed because it is too large Load Diff

0
src/js/specialanimations.js Executable file
View File

75
src/menu.html Normal file
View File

@@ -0,0 +1,75 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=7">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>nav</title>
<link rel="stylesheet" href="/css/nav/toggle.css">
<link rel="stylesheet" href="/css/nav/menu.css">
</head>
<body>
<div class="nav-container">
<div class="nav-toggle-container">
<div class="nav-toggle-positioner">
<div class="nav-toggle active" onclick="menu()">
<span class="line" id="line1"></span>
<span class="line" id="line2"></span>
<span class="line" id="line3"></span>
</div>
</div>
</div>
<div id="menu" class="open">
<div class="menu-container">
<h2>Menu</h2>
<div class="menu-main">
<div class="menu-category">
<h3>Projects</h3>
<div class="category-list">
<a href="/projects/storagemanager" class="category-item">StorageManager</a>
<a href="/projects/smuL" class="category-item">SimpleMediaUpscalerLite</a>
<a href="/projects/libreevent" class="category-item">libreǝvent</a>
<a href="/projects/qrscanner" class="category-item">QR & Barcode Insight</a>
<a href="/projects/musicplayer" class="category-item">MusicPlayer</a>
<a href="/projects/biogascontrollerapp" class="category-item">BiogasControllerApp</a>
<a href="/projects/impress" class="category-item">impress.js</a>
</div>
</div>
<div class="menu-category">
<h3>About</h3>
<div class="category-list">
<a href="/privacypolicy" class="category-item">Privacy Policy</a>
<a href="/about" class="category-item">About janishutz.com</a>
<a href="/about/aboutme" class="category-item">About me</a>
</div>
</div>
<div class="menu-category">
<h3>Services</h3>
<div class="category-list">
<a href="/services" class="category-item">Overview</a>
<a href="/services/websites" class="category-item">Custom Websites</a>
<a href="/services/pcbuilding" class="category-item">PC Building</a>
</div>
</div>
<div class="menu-category">
<h3>Support</h3>
<div class="category-list">
<a href="/support" class="category-item">Support hub</a>
<a href="/support/faq" class="category-item">FAQ</a>
<a href="/support/contact" class="category-item">Contact</a>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
function menu () {
$( '.menu-container' ).fadeToggle( 1000 );
$( '#menu' ).toggleClass( 'open' );
$( '.nav-toggle' ).toggleClass( 'active' );
}
</script>
</body>
</html>

63
src/menu_old.html Executable file
View File

@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="/css/menustyle.css">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Navmenu - janishutz.com</title>
</head>
<body>
<div class="Menu">
<a href="/"><img src="/assets/Logo.png" class="logo"></a>
<div class="toggle-wrapper">
<a class="listtoggle" onclick="togglelist()">&#9776</a>
</div>
<ul class="menu-container">
<li class="mainitems"><a class="menubutton" id="home" href="/">Home</a></li>
<li class="dropdown mainitems">
<a class="menubutton" id="projects" href="/projects.html">Projects</a>
<ul class="dropdown-menu">
<a class="menubutton sub" href="/projects/qrinsight.html">QR & Barcode Insight</a>
<a class="menubutton sub" href="/projects/storagemanager.html">StorageManager</a>
<a class="menubutton sub" href="/projects/smuL.html">Simple&shy;Media&shy;Upscaler&shy;Lite</a>
<a class="menubutton sub" href="/projects/musiplayer.html">MusicPlayer</a>
<a class="menubutton sub" href="/projects/bgac.html">BiogasControllerApp</a>
<a class="menubutton sub" href="https://libreevent.janishutz.com">libreǝvent</a>
</ul>
</li>
<li class="dropdown mainitems">
<a class="menubutton" id="about" href="/aboutPage.html">About</a>
<ul class="dropdown-menu">
<a class="menubutton sub" href="/privacypolicy.html">Privacy Policy</a>
<a class="menubutton sub" href="/about.html">About me</a>
</ul>
</li>
<li class="dropdown mainitems">
<a class="menubutton" id="services" href="/services.html">Services</a>
<ul class="dropdown-menu">
<a class="menubutton sub" href="https://pcbuilding.janishutz.com">PC Building</a>
<a class="menubutton sub" href="https://development.janishutz.com">Custom Websites</a>
</ul>
</li>
<li class="mainitems"><a class="menubutton" id="support" href="/support.html">Support</a></li>
</ul>
</div>
<script>
let previous = 1;
function togglelist() {
$( '.menu-container' ).slideToggle(300);
$( '.listtoggle' ).toggleClass( 'active' );
}
window.addEventListener( 'resize', function( event ) {
if ( $(window).width() > 999 ) {
$( '.menu-container' ).slideDown();
previous = 1;
} else if ( $(window).width() < 999 && previous == 1 ) {
$( '.menu-container' ).slideUp();
$( '.listtoggle' ).removeClass( 'active' );
previous = 0;
};
}, true);
</script>
</body>

26
src/privacypolicy/index.html Executable file
View File

@@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<title>Privacy Policy - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<div class="title-container">
<h1 class="title">Privacy Policy</h1>
</div>
<div class="content">
<h2>Privacy in my iOS Apps</h2>
<p>All of the apps developed by Janis Hutz follow strict privacy rules. As such, my Apps do not collect any data other than the standard data that is being collected by Apple to give me an idea on how many people use the app. You may opt out of that feature in the system settings. All of the data collected there is anonymised and I therefore cannot see anything other than a higher number on the active user data. Privacy is one of the most important factors in the development of my apps! This may have an impact on the stability of the apps, so please, if you would like, enable "Share with Developers" setting in the Settings app under "Privacy" > "Analytics & Improvements". This allows me to see an anonymised crash report if the app'd crash.
I do heavily rely on AppStore Reviews, Ratings and Beta feedback to improve my apps, as this is the least privacy invading option out there. Please also contact me, if you'd like to test this app as a beta!</p>
<h2>Privacy on janishutz.com</h2>
<p>This website does not collect any data on your interaction with it as it stands today. This may change in the future, but all data collected will not allow me to uniquely identify you as an individual. You may have a look at the source code of the data-collection module, if I end up adding one on this website, if you wish. The rest of the server backend will remain closed-source due to security concerns.</p>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

View File

@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<title>BiogasControllerApp - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<h1>BiogasControllerApp</h1>
<p>Still under construction</p>
</div>
<div id="Footer"></div>
</body>
</html>

View File

40
src/projects/index.html Executable file
View File

@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html>
<head>
<title>Projects - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<link rel="stylesheet" href="./css/mainstyle.css">
<script defer src="./js/jquery.js"></script>
<script defer src="./js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<div class="title-container">
<h1 class="title">My projects</h1>
<h2 class="subtitle">Here you can get an overview over all my projects!</h2>
</div>
<h3>Swift & SwiftUI (iOS Apps)</h3>
<ul>
<li><a class="textlink" href="/projects/storagemanager.html">StorageManager</a></li>
<li><a class="textlink" href="/projects/qrinsight.html">QR & Barcode Insight</a></li>
</ul>
<h3>Python, Kivy, KivyMD, PyQT5, PyGTK (Desktop apps using different UI toolkits)</h3>
<ul>
<li><a class="textlink" href="/projects/musiplayer.html">MusicPlayer</a></li>
<li><a class="textlink" href="/projects/smuL.html">SimpleMediaUpscalerLite</a></li>
<li><a class="textlink" href="/projects/bgac.html">BiogasControllerApp</a></li>
</ul>
<h3>JavaScript, HTML, CSS (Webapps / Websites)</h3>
<ul>
<li><a class="textlink" href="/">This website</a></li>
<li><a class="textlink" href="https://libreevent.janishutz.com">Libreǝvent - free & open source self-hosted event management solution</a></li>
<li><a class="textlink" href="/projects/smuL.html">SimpleMediaUpscalerLite</a></li>
<li><a class="textlink" href="https://booking.languageschoolhossegor.com">Booking system for Language School Hossegor</a></li>
<li><a class="textlink" href="https://impress-testing.janishutz.com">Impress.js website (Not yet up, in development)</a></li>
</ul>
</div>
<div id="Footer"></div>
</body>
</html>

View File

@@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<title>MusicPlayer - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<h1>MusicPlayer</h1>
<p>This project will merge with a new project in the coming months and will be rewritten from scratch and will be packaged as an electron app.</p>
<p>Still under construction</p>
</div>
<div id="Footer"></div>
</body>
</html>

View File

@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<title>QR & Barcode Insight - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<h1>QR & Barcode Insight</h1>
<p>Ever wanted to scan QR-Codes and Barcodes from a screenshot? This app allows you to do exactly that, whilst showing the full scanned link to you so you need to worry a little less about opening a harmful link.</p>
<div></div>
<br><br><br><br><br>
<h5>This app is available to download now from the AppStore!</h5>
<a class="linkbutton" href="https://apps.apple.com/us/app/qr-barcode-insight/id6443884642">Download from the Apple AppStore!</a>
</div>
<div id="Footer"></div>
</body>
</html>

50
src/projects/smuL/index.html Executable file
View File

@@ -0,0 +1,50 @@
<!DOCTYPE html>
<html>
<head>
<title>smuL - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<div class="content">
<h2 class="content-title">Simple&shy;Media&shy;Upscaler&shy;Lite</h2>
<div class="sidebyside">
<div class="element">
<h3>Upscale with EASE.</h3>
<p>Upscale any kind of video or image with ease using the electron GUI.</p>
<a href="https://github.com/simplePCBuilding/SimpleMediaUpscalerLite" class="linkbutton">Learn more</a>
</div>
<div class="element">
<h3>Electron Frontend</h3>
<p>smuL features a gorgeous electron frontend as these UIs look a lot better usually compared to QT, GTK or any other toolkit.</p>
<a href="https://github.com/simplePCBuilding/SimpleMediaUpscalerLite" class="linkbutton">Learn more</a>
</div>
</div>
<div class="sidebyside">
<div class="element">
<h3>CLI.</h3>
<p>smuL features a CLI to enable you to upscale things in bulk without the downsides that GUIs bring with them</p>
<a href="https://github.com/simplePCBuilding/SimpleMediaUpscalerLite" class="linkbutton">Learn more</a>
</div>
<div class="element">
<h3>Plugins.</h3>
<p>smuL features plugin support without having to restart the GUI app. You may simply add a new upscaling engine by downloading a plugin.</p>
<a href="https://github.com/simplePCBuilding/SimpleMediaUpscalerLite" class="linkbutton">Learn more</a>
</div>
</div>
<div class="sidebyside">
<div class="element">
<h3>FOSS.</h3>
<p>smuL is fully open source, you may have a look at its entire source code below and contribute to it if you wish to.</p>
<a href="https://github.com/simplePCBuilding/SimpleMediaUpscalerLite" class="linkbutton">Learn more</a>
</div>
</div>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

View File

@@ -0,0 +1,32 @@
<!DOCTYPE html>
<html>
<head>
<title>StorageManager - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<h1>StorageManager</h1>
<h3 class="bigquote"><b class="biggerquote">MANAGE</b> <br> your storage <br> with Ease. </h3>
<p>Add items by simply <b class="biggerquote">SCANNING</b> them with your phone and adding important infos to it. The app will remember all the products you have scanned before and auto fills the info to save your time.</p>
<p>Get notified when a product is about to expire.</p>
<p>Remove products by simply swiping left or by scanning them with your phone</p>
<p>Sync the data between all your Apple Devices <sup>1</sup>.</p>
<p>Import and export the data<sup>2</sup> so you can share it between multiple AppleIDs and even a PC app<sup>3</sup></p>
<p>Sync data between multiple AppleIDs without the need of exporting the data and importing it again on the other device<sup>4</sup></p>
<br><br><br>
<p>Still under construction</p>
<div class="references">
<sup>1</sup> iCloud is required in order for this feature to work. You may enable it in the system settings. <br>
<sup>2</sup> Part of an In-App-Purchase coming at a later point <br>
<sup>3</sup> Part of an In-App-Purchase coming at a later point. <br>
<sup>4</sup> Coming in a Software update at a later point and requires a subscription. <br>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

67
src/search/index.html Normal file
View File

@@ -0,0 +1,67 @@
<!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>Search (redirects to duckduckgo) :: janishutz.com</title>
<style>
html {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
background-image: radial-gradient(
rgb(25, 25, 151), lightblue
);
background-repeat: no-repeat;
background-size: contain;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-family: sans-serif;
}
.search-wrapper {
text-align: center;
background-color: white;
min-height: fit-content;
min-width: fit-content;
height: 50%;
padding: 3% 5%;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.search-box {
background-color: rgb(191, 196, 255);
border-style: solid;
padding: 1%;
width: 40vw;
font-size: 110%;
border-radius: 10px;
}
.submit-button {
}
</style>
</head>
<body>
<div class="search-wrapper">
<h1 style="font-size: 400%;">Search</h1>
<form action="https://duckduckgo.com/?q=" method="get">
<input type="text" placeholder="Search..." class="search-box">
<input type="submit" value="Search" class="submit-button">
</form>
</div>
</body>
</html>

30
src/services/index.html Normal file
View File

@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html>
<head>
<title>Services - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<script defer src="/js/jquery.js"></script>
<script defer src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<div class="title-container">
<h1 class="title">Services</h1>
</div>
<div class="content">
<hr class="pullquote-lines">
<h3 class="content-title-small">Technology is a remarkably interesting topic, that many people take for granted.</h3>
<hr class="pullquote-lines">
<p style="text-align: center; font-size: 120%;">To make technology more accessible, I thrive to offer services that help people not that well versed in technology start to enjoy it. A first step for many people to discover their interest in technology is to have a decent PC, where they can play games and / or create videos and livestream. If you have a problem, you can also get PC support! For people trying to get an online presence, I offer creating static websites and websites featuring some more complex features.</p>
</div>
<div class="itemsInline">
<a class="linkbutton" href="https://pcbuilding.janishutz.com">PC Build service</a>
<a class="linkbutton" href="https://pcbuilding.janishutz.com/support">PC Support</a>
<a class="linkbutton" href="https://development.janishutz.com">Website</a>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

33
src/support/index.html Executable file
View File

@@ -0,0 +1,33 @@
<!DOCTYPE html>
<html>
<head>
<title>Support - janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/mainstyle.css">
<script src="/js/jquery.js"></script>
<script src="/js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<div class="title-container">
<h1 class="title">Support</h1>
</div>
<div class="content">
<p>Have you run into a problem with one of my apps? Please contact me by clicking the button below! I am here to help you out.</p>
<br>
<h2>Troubleshooting</h2>
<p>You may try to fix the problem yourself, by trying these steps here:</p>
<ul style="width: 100%;">
<li>Force close the app (open App switcher and swipe up the app) and reopening it / Close the program and reopen it</li>
<li>Check for an update in the AppStore / on GitHub</li>
</ul>
<p>If nothing of the above helps or you'd like to give feedback, please click the button below! If you found an issue with my FOSS apps, please click <a href="https://github.com/simplePCBuilding" style="color: black">here</a>, search for the respective repository and create a new issue. Alternatively you may click the button below</p>
</div>
<h3>Before you contact me: Have you tried the troubleshooting steps above?</h3>
<br><br>
<a class="linkbutton" href='mailto:dev.janishutz@protonmail.com'>Contact me</a>
</div>
<div id="Footer"></div>
</body>
</html>