janishutz-website/old-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

partial restyle

Browse Source
This commit is contained in:
janis
2023-01-04 20:58:41 +01:00
parent a82227b485
commit cb6c095d0c
17 changed files with 454 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
server.js
View File

@@ -1,6 +1,16 @@
var ejs = require('express')
var path = require('path')
var http = require('http')
/*
*
* janishutz.com - Backend
* server.js
*
* Developed 2023 by Janis Hutz
*
*/
var ejs = require( 'express' );
var path = require( 'path' );
var http = require( 'http' );
var fs = require( 'fs' );
var app = ejs();
@@ -9,27 +19,71 @@ app.get('/', (request, response) => {
});
app.get( '/:filename', ( request, response ) => {
response.sendFile(path.join(__dirname + "/ui/" + request.params.filename));
let fileExtension = '';
if ( request.params.filename.slice( request.params.filename.length - 5, request.params.filename.length ) == '.html' ) {} else {
fileExtension = '.html'
};
fs.readFile( path.join(__dirname + '/ui/' + request.params.filename + fileExtension ), ( err, data ) => {
if ( err ) {
response.status( 404 ).sendFile( path.join( __dirname + '/ui/404.html' ) );
} else {
response.status( 200 ).sendFile( path.join( __dirname + '/ui/' + request.params.filename + fileExtension ) );
};
});
});
app.get('/css/:file', (request, response) => {
response.sendFile(path.join(__dirname + "/ui/css/" + request.params.file));
app.get( '/css/:filename', ( request, response ) => {
fs.readFile( path.join( __dirname + '/ui/css/' + request.params.filename ), ( err, data ) => {
if ( err ) {
response.status( 404 ).sendFile( path.join( __dirname + '/ui/404.html' ) );
} else {
response.status( 200 ).sendFile( path.join( __dirname + '/ui/css/' + request.params.filename ) );
};
});
});
app.get('/js/:file', (request, response) => {
response.sendFile(path.join(__dirname + "/ui/js/" + request.params.file));
app.get( '/js/:filename', ( request, response ) => {
fs.readFile(path.join(__dirname + '/ui/js/' + request.params.filename), (err, data) => {
if (err) {
response.status( 404 ).sendFile( path.join( __dirname + '/ui/404.html' ) );
} else {
response.status( 200 ).sendFile( path.join( __dirname + '/ui/js/' + request.params.filename ) );
};
});
});
app.get('/projects/:file', (request, response) => {
response.sendFile(path.join(__dirname + "/ui/projects/" + request.params.file));
app.get( '/projects/:filename', ( request, response ) => {
let fileExtension = '';
if ( request.params.filename.slice( request.params.filename.length - 5, request.params.filename.length ) == '.html' ) {} else {
fileExtension = '.html'
};
fs.readFile(path.join(__dirname + '/ui/projects/' + request.params.filename + fileExtension ), (err, data) => {
if (err) {
response.status(404).sendFile( path.join( __dirname + '/ui/404.html' ) );
} else {
response.status(200).sendFile( path.join( __dirname + '/ui/projects/' + request.params.filename + fileExtension ) );
};
});
});
app.get('/projects/css/:file', (request, response) => {
response.sendFile(path.join(__dirname + "/ui/css/" + request.params.file));
app.get( '/assets/:filename', ( request, response ) => {
fs.readFile(path.join(__dirname + '/ui/assets/' + request.params.filename), (err, data) => {
if (err) {
response.status(404).sendFile( path.join( __dirname + '/ui/404.html' ) );
} else {
response.status(200).sendFile( path.join( __dirname + '/ui/assets/' + request.params.filename ) );
};
});
});
app.get('/assets/:file', (request, response) => {
response.sendFile(path.join(__dirname + "/ui/assets/" + request.params.file));
// Serve 404 pages
app.use( ( req, res, next ) => {
if ( req.query.lang == 'en' ) {
res.status( 404 ).sendFile( path.join( __dirname + '/ui/en/errorResponses/404.html' ) );
} else {
res.status( 404 ).sendFile( path.join( __dirname + '/ui/de/errorResponses/404.html' ) );
};
});

7
ui/404.html
View File

@@ -30,16 +30,15 @@
</head>
<body>
<div class="navbars">
<div id="ContentToInclude"></div>
</div>
<div class="errorpage">
<div class="box">
<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 back</a>
<a href="/" class="linkbutton">Go to homepage</a>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

9
ui/about.html
View File

@@ -11,16 +11,21 @@
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<h1>About me</h1>
<div class="title-container">
<h1 class="title">About me</h1>
</div>
<div class="content">
<p>My name is Janis Hutz, I am 18 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, 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>
<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
ui/aboutPage.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 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">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">About me</a>
<a class="linkbutton" href="/privacypolicy">Privacy Policy</a>
<a class="linkbutton" href="/services">Services</a>
</div>
</div>
<div id="Footer"></div>
</body>
</html>

BIN
ui/assets/Logo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 22 KiB

BIN
ui/assets/codeSnippet.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 80 KiB

116
ui/css/mainstyle.css
View File

@@ -1,12 +1,26 @@
/*
*
* 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;
background-color: rgba(70, 72, 167, 0.5);
font-family: Arial, Helvetica, sans-serif;
font-family: sans-serif;
}
/*
Style for quotes
*/
.bigquote {
width: 40%;
font-size: 300%;
@@ -16,6 +30,9 @@ html, body {
font-size: 150%;
}
/*
Styling for the main content element
*/
.mainstyle {
margin-right: 10%;
margin-left: 10%;
@@ -30,11 +47,9 @@ html, body {
background-color:dimgray;
}
h1 {
font-size: 300%;
}
/*
Styling for links and buttons
*/
.textlink {
font-size: 100%;
text-decoration: none;
@@ -62,3 +77,92 @@ h1 {
.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 {
font-size: 350%;
}
.subtitle {
font-size: 200%;
}
.content {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 5%;
margin-bottom: 10%;
}
.content-title {
font-size: 300%;
text-align: center;
}
.content-title-small {
font-size: 200%;
text-align: center;
}
.pullquote-lines {
border-color: black;
margin-bottom: 2%;
margin-top: 2%;
width: 100%;
}
/*
Align content side by side
*/
.sidebyside {
width: 100%;
display: flex;
flex-grow: 1;
gap: 5%;
}
.element {
width: 47%;
text-align: center;
}
.itemsInline {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
gap: 5%;
margin-top: 3%;
margin-bottom: 3%;
}
/*
Bottom container styling
*/
.bottom {
display: flex;
width: 100%;
justify-content: center;
align-items: center;
flex-direction: column;
}

2
ui/footer.html
View File

@@ -10,7 +10,7 @@
<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>
<a href="/privacypolicy" class="linkbutton" id="ppbtn">Privacy Policy</a>
</div>
</div>
</div>

20
ui/getos.html
View File

@@ -1,20 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>OS Detection - 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>
<h1>This is just a testscript to get user's OS and Browser</h1>
<script>alert(navigator.appVersion);</script>
<br><br><br>
Note: This website is not completed yet and some pages are still missing!
</body>
</html>

47
ui/index.html
View File

@@ -4,21 +4,52 @@
<title>Home - janishutz.com</title>
<meta name="description" content="Get informed about my projects, get in support or contact me">
<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>
<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">
<h1>Welcome to janishutz.com!</h1>
<p>iOS Apps, PC apps, Websites</p>
<p>Learn more about my projects!</p>
<a class="linkbutton" href="./projects.html">Projects</a>
<div class="title-container">
<h1 class="title">Welcome to janishutz.com!</h1>
<h2 class="subtitle">iOS Apps, PC apps, Websites</h2>
</div>
<div class="content">
<h2 class="content-title">My work</h2>
<div class="sidebyside">
<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 class="element">
<h3>Custom Websites</h3>
<p>Websites generally perform very well in Google searches when built from scratch using HTML, CSS & JavaScript. That's exactly what I do. Need more than just a static website with a blog and some contact forms? Depending on what it is, I might not be able to do it for you.</p>
<a href="https://development.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>
<div class="bottom">
<h2 class="content-title">Check out my projects!</h2>
<a class="linkbutton" href="/projects">Projects</a>
</div>
<br><br><br>
Note: This website is not completed yet and some pages are still missing! The design will also change to something more appealing in the future
Note: This website is not completed yet and some pages are still missing! The design may also change in the future
</div>
<div id="Footer"></div>

40
ui/js/basicanimations.js
View File

@@ -1,34 +1,36 @@
$(document).ready(function() {
$("#ContentToInclude").load("/menu.html");
$("#Footer").load("/footer.html");
$(".linkbutton").mouseenter(function() {
$('#ContentToInclude').load('/menu.html');
$('#Footer').load('/footer.html');
$('.linkbutton').mouseenter(function() {
$(this).stop()
$(this).animate({"border-radius": "0px", "background-color": "darkblue"}, 200)
$(this).animate({'border-radius': '0px', 'background-color': 'darkblue'}, 200)
})
$(".linkbutton").mouseleave(function() {
$('.linkbutton').mouseleave(function() {
$(this).stop()
$(this).animate({"border-radius": "20px", "background-color": "rgba(0,0,0,0)"}, 200)
$(this).animate({'border-radius': '20px', 'background-color': 'rgba(0,0,0,0)'}, 200)
})
$(".textlink").mouseenter(function() {
$('.textlink').mouseenter(function() {
$(this).stop()
$(this).animate({"color": "darkblue", "font-size": "120%"}, 200)
$(this).animate({'color': 'darkblue', 'font-size': '120%'}, 200)
})
$(".textlink").mouseleave(function() {
$('.textlink').mouseleave(function() {
$(this).stop()
$(this).animate({"color": "black", "font-size": "100%"}, 200)
$(this).animate({'color': 'black', 'font-size': '100%'}, 200)
})
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 == "/privacypolicy.html") {
$('#about').css("background-color", "darkblue")
} else if (pagename == "/" || pagename == "/index.html") {
$('#home').css("background-color", "darkblue")
} else if (pagename == "/support.html") {
$('#support').css("background-color", "darkblue")
}
if ( pagename.slice(0, 8) == '/project' ) {
$('#projects').css('background-color', 'darkblue');
} else if ( pagename.slice(0, 6) == '/about' || pagename == '/privacypolicy' ) {
$('#about').css('background-color', 'darkblue');
} else if ( pagename == '/' || pagename == '/index.html' ) {
$('#home').css('background-color', 'darkblue');
} else if ( pagename == '/support' ) {
$('#support').css('background-color', 'darkblue');
} else if ( pagename == '/services' ) {
$('#services').css('background-color', 'darkblue');
};
}

27
ui/menu.html
View File

@@ -11,23 +11,30 @@
<div 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>
<a class="menubutton" id="projects" href="/projects">Projects</a>
<ul class="dropdown-menu">
<li class="subitems"><a class="menubutton" href="/projects/qrinsight.html">QR & Barcode Insight</a></li>
<li class="subitems"><a class="menubutton" href="/projects/storagemanager.html">StorageManager</a></li>
<li class="subitems"><a class="menubutton" href="/projects/imagescaler.html">FSR Image & Video Upscaler Frontend</a></li>
<li class="subitems"><a class="menubutton" href="/projects/musiplayer.html">MusicPlayer</a></li>
<li class="subitems"><a class="menubutton" href="/projects/bgac.html">BiogasControllerApp</a></li>
<li class="subitems"><a class="menubutton" href="/projects/qrinsight">QR & Barcode Insight</a></li>
<li class="subitems"><a class="menubutton" href="/projects/storagemanager">StorageManager</a></li>
<li class="subitems"><a class="menubutton" href="/projects/imagescaler">FSR Image & Video Upscaler Frontend</a></li>
<li class="subitems"><a class="menubutton" href="/projects/musiplayer">MusicPlayer</a></li>
<li class="subitems"><a class="menubutton" href="/projects/bgac">BiogasControllerApp</a></li>
</ul>
</li>
<li class="dropdown mainitems">
<a class="menubutton" id="about" href="#">About</a>
<a class="menubutton" id="about" href="/aboutPage">About</a>
<ul class="dropdown-menu">
<li class="subitems"><a class="menubutton" href="/privacypolicy.html">Privacy Policy</a></li>
<li class="subitems"><a class="menubutton" href="/about.html">About me</a></li>
<li class="subitems"><a class="menubutton" href="/privacypolicy">Privacy Policy</a></li>
<li class="subitems"><a class="menubutton" href="/about">About me</a></li>
</ul>
</li>
<li class="mainitems"><a class="menubutton" id="support" href="/support.html">Support</a></li>
<li class="dropdown mainitems">
<a class="menubutton" id="services" href="/services">Services</a>
<ul class="dropdown-menu">
<li class="subitems"><a class="menubutton" href="https://pcbuilding.janishutz.com">PC Building</a></li>
<li class="subitems"><a class="menubutton" href="https://development.janishutz.com">Custom Websites</a></li>
</ul>
</li>
<li class="mainitems"><a class="menubutton" id="support" href="/support">Support</a></li>
</div>
</ul>
</body>

14
ui/privacypolicy.html
View File

@@ -3,22 +3,24 @@
<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 src="./js/jquery.js"></script>
<script src="./js/basicanimations.js"></script>
<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">
<h1>Privacy Policy</h1>
<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>

17
ui/projects.html
View File

@@ -7,22 +7,23 @@
<script src="./js/jquery.js"></script>
<script src="./js/basicanimations.js"></script>
</head>
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<h1>My projects</h1>
<p>Here you can get an overview of all my projects!</p>
<div class="home">
<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>
<li><a class="textlink" href="/projects/storagemanager">StorageManager</a></li>
<li><a class="textlink" href="/projects/qrinsight">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/imagescaler.html">FSR Image & Video Upscaler Frontend</a></li>
<li><a class="textlink" href="/projects/bgac.html">BiogasControllerApp</a></li>
<li><a class="textlink" href="/projects/musiplayer">MusicPlayer</a></li>
<li><a class="textlink" href="/projects/imagescaler">FSR Image & Video Upscaler Frontend</a></li>
<li><a class="textlink" href="/projects/bgac">BiogasControllerApp</a></li>
</ul>
<h3>JavaScript, HTML, CSS (Webapps / Websites)</h3>
<ul>

30
ui/services.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 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">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>

9
ui/support.html
View File

@@ -10,17 +10,20 @@
<body>
<div id="ContentToInclude"></div>
<div class="mainstyle">
<h1>Support</h1>
<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>
<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>
<br><br><br><br><br><br><br>
</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>