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

Add new assets

Browse Source
This commit is contained in:
Janis Hutz
2026-02-11 13:03:03 +01:00
parent b1062fcad5
commit 9e641a2b9b
11 changed files with 51 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/home/conductorcalc-mobile.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 72 KiB

BIN
assets/home/conductorcalc-mobile.xcf Normal file
View File

Binary file not shown.

0
assets/home/foss.jpg → assets/home/foss-mobile.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 100 KiB

After

Width:  |  Height:  |  Size: 100 KiB

BIN
assets/home/musicplayer-mobile.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 77 KiB

BIN
assets/home/musicplayer-mobile.xcf Normal file
View File

Binary file not shown.

7
src/css/style.css
View File

@@ -119,7 +119,7 @@ a {
.slider { .slider {
width: 100vw; width: 100vw;
height: 70vh; height: 80vh;
} }
.slider-element { .slider-element {
@@ -262,11 +262,6 @@ a {
} }
@media only screen and (min-width: 800px) { @media only screen and (min-width: 800px) {
.slider {
width: 100vw;
height: 80vh;
}
.slider-controls { .slider-controls {
font-size: 3rem; font-size: 3rem;
} }

8
src/index.html
View File

@@ -3,8 +3,7 @@
<head> <head>
<!-- CSS --> <!-- CSS -->
<!-- <link rel="stylesheet" href="https://static.janishutz.com/css/slider.css"> --> <link rel="stylesheet" href="https://static.janishutz.com/css/slider.css">
<link rel="stylesheet" href="http://localhost:8081/css/slider.css">
<link rel="stylesheet" href="/css/style.css"> <link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/side-by-side.css"> <link rel="stylesheet" href="/css/side-by-side.css">
@@ -49,7 +48,7 @@
</div> </div>
</div> </div>
<div class="slider-element" <div class="slider-element"
data-image-base-url="https://static.janishutz.com/assets/projects/musicplayer-title" data-image-base-url="https://static.janishutz.com/assets/home/musicplayer"
data-filetype="jpg"> data-filetype="jpg">
<div class="slider-info"> <div class="slider-info">
<h2>MusicPlayer</h2> <h2>MusicPlayer</h2>
@@ -72,8 +71,7 @@
onclick="sliderControl( 'next' )">arrow_forward</span> onclick="sliderControl( 'next' )">arrow_forward</span>
</div> </div>
<!-- <script src="https://static.janishutz.com/js/slider.js"></script> --> <script src="https://static.janishutz.com/js/slider.js"></script>
<script src="http://localhost:8081/js/slider.js"></script>
<script src="/slider-rwd.js"></script> <script src="/slider-rwd.js"></script>
<script>activateSlider(7500, null)</script> <script>activateSlider(7500, null)</script>

53
src/projects/index.html
View File

@@ -24,14 +24,14 @@
<meta name="theme-color" content="#152b5c"> <meta name="theme-color" content="#152b5c">
<style> <style>
#yt-embed {
width: 70vw;
height: 40vw;
}
.side-by-side { .side-by-side {
margin-top: 20px; margin-top: 20px;
} }
.slider {
height: calc(100vw * 0.8);
max-height: 80vh;
}
</style> </style>
</head> </head>
@@ -82,7 +82,10 @@
<span class="slider-controls slider-control-right material-symbols-outlined" <span class="slider-controls slider-control-right material-symbols-outlined"
onclick="sliderControl( 'next' )">arrow_forward onclick="sliderControl( 'next' )">arrow_forward
</div> </div>
</div> <script src="https://static.janishutz.com/js/slider.js"></script>
<script>
activateSlider(7500, null);
</script>
<div class="content" style="margin-top: 50px;"> <div class="content" style="margin-top: 50px;">
<h1>Projects</h1> <h1>Projects</h1>
@@ -104,8 +107,8 @@
<a href="/projects/libreevent" class="button">Details</a> <a href="/projects/libreevent" class="button">Details</a>
</div> </div>
<div class="side-by-side-item right"> <div class="side-by-side-item right">
<img src="https://github.com/janishutz/MusicPlayerV2/raw/master/assets/logo.png" <img src="https://github.com/janishutz/MusicPlayerV2/raw/master/assets/logo.png" alt="musicplayer logo"
alt="musicplayer logo" class="project-logo small-logo"> class="project-logo small-logo">
<h3>MusicPlayer</h3> <h3>MusicPlayer</h3>
<p>A browser-based Music Player with remote playlist sharing and support for your local playlists, as <p>A browser-based Music Player with remote playlist sharing and support for your local playlists, as
well as Apple Music</p> well as Apple Music</p>
@@ -114,13 +117,16 @@
</div> </div>
<div class="side-by-side"> <div class="side-by-side">
<div class="side-by-side-item left"> <div class="side-by-side-item left">
<img src="https://static.janishutz.com/assets/logos/impress.jpg" alt="impress.js logo" class="project-logo small-logo"> <img src="https://static.janishutz.com/assets/logos/impress.jpg" alt="impress.js logo"
class="project-logo small-logo">
<h3>impress</h3> <h3>impress</h3>
<p>A JavaScript library to create fancy browser-based presentations in 3D. Not my own project, but one I occasionally contribute to</p> <p>A JavaScript library to create fancy browser-based presentations in 3D. Not my own project, but one I
occasionally contribute to</p>
<a href="https://github.com/impress/impress.js" class="button" target="_blank">GitHub</a> <a href="https://github.com/impress/impress.js" class="button" target="_blank">GitHub</a>
</div> </div>
<div class="side-by-side-item right"> <div class="side-by-side-item right">
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="project-logo small-logo"> <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo"
class="project-logo small-logo">
<h3>Arch-Dev-VM</h3> <h3>Arch-Dev-VM</h3>
<p>Looking for an easy to set up Arch Linux virtual machine for development? The scripts here allow you <p>Looking for an easy to set up Arch Linux virtual machine for development? The scripts here allow you
to set up an Arch Linux Virtual Machine in under 1 hour, of which most time is waiting for downloads to set up an Arch Linux Virtual Machine in under 1 hour, of which most time is waiting for downloads
@@ -138,7 +144,8 @@
<a href="/projects/biogascontrollerapp" class="button">Details</a> <a href="/projects/biogascontrollerapp" class="button">Details</a>
</div> </div>
<div class="side-by-side-item right"> <div class="side-by-side-item right">
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="project-logo small-logo"> <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo"
class="project-logo small-logo">
<h3>Configurations, etc</h3> <h3>Configurations, etc</h3>
<p>Various configuration files I personally use are available on my personal Gitea instance</p> <p>Various configuration files I personally use are available on my personal Gitea instance</p>
<a href="https://git.janishutz.com/janishutz?tab=repositories" class="button" target="_blank">Git</a> <a href="https://git.janishutz.com/janishutz?tab=repositories" class="button" target="_blank">Git</a>
@@ -151,7 +158,8 @@
<p>Apps designed for your phone and tablet</p> <p>Apps designed for your phone and tablet</p>
<div class="side-by-side"> <div class="side-by-side">
<div class="side-by-side-item left"> <div class="side-by-side-item left">
<img src="https://static.janishutz.com/assets/logos/storagemanager.jpg" alt="StorageManager logo" class="project-logo small-logo"> <img src="https://static.janishutz.com/assets/logos/storagemanager.jpg" alt="StorageManager logo"
class="project-logo small-logo">
<h3>StorageManager</h3> <h3>StorageManager</h3>
<p>Missing stock keeping in your home storage? Keep throwing food away because it went bad? <p>Missing stock keeping in your home storage? Keep throwing food away because it went bad?
StorageManager aims to help you with this by providing easy to use tools to keep track of what you StorageManager aims to help you with this by providing easy to use tools to keep track of what you
@@ -159,7 +167,8 @@
<a href="/projects/storagemanager" class="button">Details</a> <a href="/projects/storagemanager" class="button">Details</a>
</div> </div>
<div class="side-by-side-item right"> <div class="side-by-side-item right">
<img src="https://static.janishutz.com/assets/logos/qrscanner.jpg" alt="QR & Barcode Insight logo" class="project-logo small-logo"> <img src="https://static.janishutz.com/assets/logos/qrscanner.jpg" alt="QR & Barcode Insight logo"
class="project-logo small-logo">
<h3>QR &amp; Barcode Insight</h3> <h3>QR &amp; Barcode Insight</h3>
<p>QR Codes have become a massive security risk. QR &amp; Barcode Insight helps protect you by showing <p>QR Codes have become a massive security risk. QR &amp; Barcode Insight helps protect you by showing
you the unfiltered content of QR codes as well as the option to check the scanned links with you the unfiltered content of QR codes as well as the option to check the scanned links with
@@ -180,7 +189,8 @@
<a href="https://conductorcalc.com" target="_blank" class="button">Details</a> <a href="https://conductorcalc.com" target="_blank" class="button">Details</a>
</div> </div>
<div class="side-by-side-item right"> <div class="side-by-side-item right">
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="project-logo small-logo"> <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo"
class="project-logo small-logo">
<h3>Store</h3> <h3>Store</h3>
<p>The way to buy my software and support the development of my open source software</p> <p>The way to buy my software and support the development of my open source software</p>
<a href="https://store.janishutz.com" class="button" target="_blank">Store</a> <a href="https://store.janishutz.com" class="button" target="_blank">Store</a>
@@ -188,14 +198,16 @@
</div> </div>
<div class="side-by-side"> <div class="side-by-side">
<div class="side-by-side-item left"> <div class="side-by-side-item left">
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="project-logo small-logo"> <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo"
class="project-logo small-logo">
<h3>Accounts</h3> <h3>Accounts</h3>
<p>Tired of creating lots of accounts? All my services rely on a single account backend, not requiring <p>Tired of creating lots of accounts? All my services rely on a single account backend, not requiring
you to create a new account for each</p> you to create a new account for each</p>
<a href="https://account.janishutz.com" class="button" target="_blank">Account</a> <a href="https://account.janishutz.com" class="button" target="_blank">Account</a>
</div> </div>
<div class="side-by-side-item right"> <div class="side-by-side-item right">
<img src="https://static.janishutz.com/assets/logos/lsh.png" alt="Language School Hossegor logo" class="project-logo small-logo"> <img src="https://static.janishutz.com/assets/logos/lsh.png" alt="Language School Hossegor logo"
class="project-logo small-logo">
<h3>Language School Hossegor Booking System</h3> <h3>Language School Hossegor Booking System</h3>
<p>A fully featured booking system for a French language school, written from scratch specifically for <p>A fully featured booking system for a French language school, written from scratch specifically for
their purposes with a highly customizable booking process.</p> their purposes with a highly customizable booking process.</p>
@@ -206,13 +218,6 @@
<footer></footer> <footer></footer>
<script src="https://static.janishutz.com/js/yt-embed.js"></script>
<script src="https://static.janishutz.com/js/slider.js"></script>
<script>
activateSlider(7500);
</script>
</body> </body>
</html> </html>

16
src/projects/libreevent/index.html
View File

@@ -36,6 +36,11 @@
height: 40vw; height: 40vw;
} }
} }
.slider {
height: calc(100vw * 11/16);
max-height: 80vh;
}
</style> </style>
</head> </head>
@@ -45,10 +50,6 @@
<div class="slider"> <div class="slider">
<div class="slider-container"> <div class="slider-container">
<div class="slider-element current" <div class="slider-element current"
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-title.jpg' );">
<a href="https://libreevent.janishutz.com" class="button offset-button">Project Website</a>
</div>
<div class="slider-element"
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-admin-eventsettings.jpg' );"> style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-admin-eventsettings.jpg' );">
<div class="slider-info"> <div class="slider-info">
<h2>Create Events with Ease</h2> <h2>Create Events with Ease</h2>
@@ -94,10 +95,11 @@
<span class="slider-controls slider-control-right material-symbols-outlined" <span class="slider-controls slider-control-right material-symbols-outlined"
onclick="sliderControl( 'next' )">arrow_forward onclick="sliderControl( 'next' )">arrow_forward
</div> </div>
</div> <script src="https://static.janishutz.com/js/slider.js"></script>
<script>activateSlider(7500, null)</script>
<div class="content"> <div class="content">
<!-- <img src="https://libreevent.janishutz.com/assets/logo.png" alt="libreevent logo" class="project-logo"> --> <img src="https://libreevent.janishutz.com/assets/logo.png" alt="libreevent logo" class="project-logo">
<h1>libreǝvent</h1> <h1>libreǝvent</h1>
<a href="/projects" class="back-button">&leftarrow; All projects</a> <a href="/projects" class="back-button">&leftarrow; All projects</a>
@@ -123,10 +125,8 @@
<script src="https://static.janishutz.com/js/yt-embed.js"></script> <script src="https://static.janishutz.com/js/yt-embed.js"></script>
<script src="https://static.janishutz.com/js/slider.js"></script>
<script> <script>
YTEmbed('yt-embed', 'UYMa-xTyZYo'); YTEmbed('yt-embed', 'UYMa-xTyZYo');
activateSlider(7500);
</script> </script>
</body> </body>

15
src/projects/musicplayer/index.html
View File

@@ -26,6 +26,13 @@
<meta name="og:locale" content="en_GB" /> <meta name="og:locale" content="en_GB" />
<meta property="twitter:card" content="summary_large_image"> <meta property="twitter:card" content="summary_large_image">
<meta name="theme-color" content="#152b5c"> <meta name="theme-color" content="#152b5c">
<style>
.slider {
height: calc(100vw * 11/16);
max-height: 80vh;
}
</style>
</head> </head>
<body> <body>
@@ -89,6 +96,8 @@
<span class="slider-controls slider-control-right material-symbols-outlined" <span class="slider-controls slider-control-right material-symbols-outlined"
onclick="sliderControl( 'next' )">arrow_forward onclick="sliderControl( 'next' )">arrow_forward
</div> </div>
<script src="https://static.janishutz.com/js/slider.js"></script>
<script>activateSlider(7500, null)</script>
<div class="content"> <div class="content">
<img src="https://github.com/janishutz/MusicPlayerV2/raw/master/assets/logo.png" alt="MusicPlayer logo" <img src="https://github.com/janishutz/MusicPlayerV2/raw/master/assets/logo.png" alt="MusicPlayer logo"
@@ -139,12 +148,6 @@
<footer></footer> <footer></footer>
<script src="https://static.janishutz.com/js/slider.js"></script>
<script>
activateSlider(7500);
</script>
</body> </body>
</html> </html>

2
src/slider-rwd.js
View File

@@ -1,6 +1,6 @@
/* eslint-disable no-undef */ /* eslint-disable no-undef */
const loadImageByScreenSize = () => { const loadImageByScreenSize = () => {
if ( window.innerHeight / window.innerWidth >= 1 ) { if ( window.innerHeight / window.innerWidth >= 1.2 ) {
loadImageType( '-mobile' ); loadImageType( '-mobile' );
} else { } else {
loadImageType( '' ); loadImageType( '' );