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

progress on webpage

Browse Source
This commit is contained in:
Janis Hutz
2023-05-22 08:43:22 +02:00
parent e621cc7a7c
commit 7872038aaf
22 changed files with 44 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
newVersion/assets/screenshotPage1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 MiB

After

Width:  |  Height:  |  Size: 2.3 MiB

BIN
newVersion/assets/screenshotPage1a.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

BIN
newVersion/assets/screenshotPage2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 287 KiB

After

Width:  |  Height:  |  Size: 213 KiB

BIN
newVersion/assets/screenshotPage2a.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 287 KiB

BIN
newVersion/assets/screenshotPage3.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 454 KiB

After

Width:  |  Height:  |  Size: 499 KiB

BIN
newVersion/assets/screenshotPage3a.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 454 KiB

BIN
newVersion/assets/screenshotPage4.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.0 MiB

After

Width:  |  Height:  |  Size: 1.0 MiB

BIN
newVersion/assets/screenshotPage4a.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 MiB

BIN
newVersion/assets/screenshotPage5.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 111 KiB

After

Width:  |  Height:  |  Size: 112 KiB

BIN
newVersion/assets/screenshotPage6.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 100 KiB

After

Width:  |  Height:  |  Size: 124 KiB

BIN
newVersion/assets/screenshotPage6a.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 100 KiB

9
newVersion/contact/index.html
View File

@@ -16,7 +16,10 @@
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Order :: Development - janishutz.com</title>
<meta name="description" content="Get in touch with me if you have any questions about the websites">
<meta name="keywords" content="custom website design, custom web development, custom website solutions, personalised websites, custom websites, websites built from scratch, affordable custom websites">
<title>Contact me :: Development - janishutz.com</title>
</head>
<body>
<div id="nav"></div>
@@ -38,8 +41,8 @@
<div class="step" id="step-1">
<div class="step-content">
<h1 class="gradient huge small-margin">Contact</h1>
<h3 class="gradient bigger">Any questions?</h3>
<h1 class="gradient huge small-margin">Con&shy;tact</h1>
<h3 class="gradient bigger">Ready for your new website?</h3>
</div>
</div>

3
newVersion/contactForm.html
View File

@@ -2,7 +2,10 @@
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="X-UA-Compatible" content="IE=7">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<link rel="stylesheet" href="/css/formstyle.css">
<meta name="robots" content="noindex">
</head>
<body>
<form action="https://api.janishutz.com/contact?origin=development" method="post" class="form">

10
newVersion/css/examplesStyle.css
View File

@@ -14,21 +14,21 @@ body {
#step-2 {
position: fixed;
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage6.png');
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage6a.png');
background-repeat: no-repeat;
background-size: cover;
}
#step-3 {
position: fixed;
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage2.png');
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage2a.png');
background-repeat: no-repeat;
background-size: cover;
}
#step-4 {
position: fixed;
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage3.png');
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage3a.png');
background-repeat: no-repeat;
background-size: cover;
}
@@ -42,14 +42,14 @@ body {
#step-6 {
position: fixed;
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage4.png');
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage4a.png');
background-repeat: no-repeat;
background-size: cover;
}
#step-7 {
position: fixed;
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage1.png');
background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage1a.png');
background-repeat: no-repeat;
background-size: cover;
}

4
newVersion/css/style.css
View File

@@ -62,6 +62,10 @@ body {
font-size: 500%;
}
.small-huge {
font-size: 400%;
}
.biggest {
font-size: 325%;
}

3
newVersion/examples/index.html
View File

@@ -16,6 +16,9 @@
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Your new website can be exactly like the ones shown here or be of any other style you want. They are always custom built from scratch specifically for your business's use case.">
<meta name="keywords" content="custom website design, custom web development, custom website solutions, personalised websites, custom websites, websites built from scratch, affordable custom websites">
<title>Order :: Development - janishutz.com</title>
</head>
<body>

9
newVersion/index.html
View File

@@ -10,11 +10,14 @@
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/homeStyle.css">
<link rel="stylesheet" href="/css/fancyStyle.css">
<!-- <script src="/js/langHandler.js"></script> -->
<meta http-equiv="X-UA-Compatible" content="IE=8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Unlock the full potential of your online presence with my hand crafted custom websites. Your new website is tailored to your exact needs and built from scratch. Stand out from the crowd and leave a lasting impression with a website that truly represents your business.">
<meta name="keywords" content="custom website design, custom web development, custom website solutions, personalised websites, custom websites, websites built from scratch, affordable custom websites">
<title>Home :: Development - janishutz.com</title>
</head>
@@ -61,7 +64,7 @@
<div class="step reveal" id="step-2">
<div class="step-content">
<h1 class="gradient biggest small-margin">Beau&shy;ti&shy;ful</h1>
<h1 class="gradient biggest small-margin">Con&shy;tempo&shy;rary</h1>
<p class="white half-width">Get a website of any style you want</p>
</div>
</div>
@@ -76,7 +79,7 @@
<div class="step reveal" id="step-4">
<div class="step-content">
<h1 class="gradient biggest small-margin">Static</h1>
<p class="white half-width">Websites that display your content in a stylish, beautiful manner, like this page</p>
<p class="white half-width">Websites that display your content in a stylish, beautiful manner, like this website</p>
</div>
</div>
@@ -89,7 +92,7 @@
<div class="step reveal" id="step-6">
<div class="step-content">
<h1 class="gradient huge small-margin">In&shy;te&shy;res&shy;ted?</h1>
<h1 class="gradient small-huge small-margin">In&shy;te&shy;res&shy;ted?</h1>
<h3 class="gradient bigger"><a href="/order" class="link-invisible">contact me for an offer</a></h3>
</div>
</div>

8
newVersion/info/index.html
View File

@@ -16,6 +16,9 @@
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Tailor-Made websites for Your Business: Stand out from the competition with my custom built websites that are built from scratch specifically for your business's use case and therefore get a significant boost in loading times.">
<meta name="keywords" content="custom website design, custom web development, custom website solutions, personalised websites, custom websites, websites built from scratch, affordable custom websites">
<title>Details :: Development - janishutz.com</title>
</head>
<body>
@@ -44,7 +47,7 @@
<div class="step" id="step-1">
<div class="step-content">
<h1 class="gradient huge small-margin">Details</h1>
<h1 class="gradient huge small-margin">De&shy;tails</h1>
<h3 class="gradient bigger">on how this works</h3>
</div>
</div>
@@ -81,13 +84,14 @@
<div class="step-content">
<h1 class="gradient biggest small-margin">SEO</h1>
<p class="white half-width">You can choose how SEO should be handled: either by an SEO expert or by me</p>
<p class="very-small half-width">SEO or Search Engine Optimisation, is what is required to make your website perform well in search engines like Google.</p>
</div>
</div>
<div class="step reveal" id="step-7">
<div class="step-content">
<h1 class="gradient biggest small-margin">Pri&shy;cing</h1>
<p class="white half-width">Prices are calculated on a per-hour basis. You will receive an estimate in costs before I start developing anything - for free.</p>
<p class="white half-width">Prices are calculated on a per-hour basis. You will receive an estimate in costs for free before I start developing anything</p>
</div>
</div>

6
newVersion/js/langHandler.js Normal file
View File

@@ -0,0 +1,6 @@
let preferredLang = navigator.languages.includes( 'de', 'de-CH' ) ? 'de' : 'en';
console.log( preferredLang );
function switchLanguage ( lang ) {
window.location.pathname
}

4
newVersion/js/scrolling.js
View File

@@ -62,8 +62,8 @@ $( document ).ready( function () {
moveTo( parseInt( $( this ).attr( 'id' ).substring( 4 ) ) );
} );
$( '.scroll-wrapper' ).click( function () {
moveTo( currentlyShowing + 1 );
$( '.scroll-container' ).click( function () {
moveTo( currentlyShowing + 2 );
} );
function moveTo ( id ) {

8
newVersion/nav.html
View File

@@ -6,6 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>nav</title>
<link rel="stylesheet" href="/css/navstyle.css">
<meta name="robots" content="noindex">
</head>
<body>
<div id="nav-menu">
@@ -16,7 +17,6 @@
<a class="navitem inactive" id="info" href="/info">Details</a>
<a class="navitem inactive" id="examples" href="/examples">Examples</a>
<a class="navitem inactive" id="contact" href="/contact">Contact</a>
<a class="navitem inactive" id="order" href="/order">Order</a>
</div>
</div>
</div>
@@ -28,7 +28,7 @@
<script>
let offset = 0;
let menuOpen = false;
const offsetList = { 'home': 0, 'info': -200, 'examples': -400, 'contact': -600, 'order': -800 };
const offsetList = { 'home': 0, 'info': -200, 'examples': -400, 'contact': -600 };
$( document ).ready( function () {
if ( sessionStorage.getItem( 'menuOpen' ) == 'true' ) {
$( '#nav-menu' ).hide( 700 );
@@ -58,10 +58,8 @@
$( '#nav-menu' ).css( 'background-position', `${200 + offset}px` );
} else if ( obj == 'examples' ) {
$( '#nav-menu' ).css( 'background-position', `${400 + offset}px` );
} else if ( obj == 'contact' ) {
} else if ( obj == 'contact' ) {
$( '#nav-menu' ).css( 'background-position', `${600 + offset}px` );
} else if ( obj == 'order' ) {
$( '#nav-menu' ).css( 'background-position', `${800 + offset}px` );
}
} )
$( '.inactive' ).mouseleave ( function () {

61
newVersion/order/index.html
View File

@@ -1,61 +0,0 @@
<!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">
<link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet'>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/orderStyle.css">
<link rel="stylesheet" href="/css/fancyStyle.css">
<meta http-equiv="X-UA-Compatible" content="IE=8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Order :: Development - janishutz.com</title>
</head>
<body>
<div id="nav"></div>
<div class="scroll-indicator" id="scroll-hint">
<div class="scroll-wrapper">
<div class="scroll-container">
Scroll to discover more
<span class="material-symbols-outlined scroll-symbol">keyboard_double_arrow_down</span>
</div>
</div>
</div>
<div class="progress" id="progress">
<div class="progress-wrapper">
<span class="material-symbols-outlined progress-item" id="step1">radio_button_checked</span>
<span class="material-symbols-outlined progress-item" id="step2">radio_button_unchecked</span>
</div>
</div>
<div class="step" id="step-1">
<div class="step-content">
<h1 class="gradient huge small-margin">Order</h1>
<h3 class="gradient bigger">Ready for your new website?</h3>
</div>
</div>
<div class="step reveal" id="step-2">
<div class="step-content">
<h1 class="gradient biggest small-margin">Order</h1>
<div id="contact"></div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script defer src="/js/scrolling.js"></script>
<script>
$( '#nav' ).load( '/nav.html' );
$( '#contact' ).load( '/contactForm.html' );
</script>
</body>
</html>