mirror of
https://github.com/michivonah/website-v2.git
synced 2025-12-22 20:46:29 +01:00
Update index.html
This commit is contained in:
GitHub
parent
06e98f9715
commit
f50a5bee62
1 changed files with 36 additions and 27 deletions
63
index.html
63
index.html
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en-CH">
|
||||
<head>
|
||||
<title>Michi von Ah</title>
|
||||
<title>Michi von Ah - My personal website</title>
|
||||
<meta name="mobile-web-app-title" content="Michi">
|
||||
<meta name="apple-mobile-web-app-title" content="Michi">
|
||||
<link id="favicon" rel="icon" type="image/png" href="assets/logo/favicon_256.png">
|
||||
|
|
@ -59,7 +59,7 @@
|
|||
|
||||
<nav id="navbar">
|
||||
<div class="inner-width">
|
||||
<a href="#" onclick="scrollToTop();"><img id="logoImg" src="assets/logo/logo_white.svg" alt="Logo"></a>
|
||||
<a href="#" onclick="scrollToTop();"><img id="logoImg" src="assets/logo/logo_white.svg" alt="Logo" title="Logo"></a>
|
||||
<div id="closeNavbarPlaceholder" onclick="closeNavbar();">
|
||||
<i class="ai-cross"></i>
|
||||
</div>
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
<button onclick="scrollDown();">Scroll down!</button>
|
||||
</div>
|
||||
<div>
|
||||
<img id="homeImg" src="assets/bitmoji.png" alt="Bitmoji">
|
||||
<img id="homeImg" src="assets/bitmoji.png" alt="Bitmoji" title="Bitmoji">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -93,7 +93,7 @@
|
|||
<div id="aboutContent">
|
||||
<div id="aboutText" data-aos="fade-left">
|
||||
<p>Hi, my name is <b>Michi von Ah</b> and I'm <b><var id="age">loading...</var></b> years old. I'm interested in smartphones, computers and electromobility (mainly Tesla). In my free time I like to be on the <b>computer</b> and program something (for example this website), <b>go for a walk</b> or bake a <b>cake</b>. I also like to listen to <b>music and podcasts</b>. Besides, I'm an Apple fan and would love to have a Tesla someday. This is my website and here you can find some stuff I created. Good Luck!</p>
|
||||
<p><b>Funfact:</b> This website consists of a total of just over <u>1′760</u> lines of code.</p>
|
||||
<p><b>Funfact:</b> This website consists of a total of just over <u>1′827</u> lines of code.</p>
|
||||
<div id="aboutSocial">
|
||||
<a href="https://www.instagram.com/michivonah/"><i class="ai-instagram-fill" data-hover="#8a3ab9"></i></a>
|
||||
<a href="https://twitter.com/michivonah"><i class="ai-twitter-fill" data-hover="#1DA1F2"></i></a>
|
||||
|
|
@ -104,7 +104,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div id="aboutImg" data-aos="fade-right">
|
||||
<img src="assets/images/michi2_blob.png" alt="Michi von Ah" id="aboutImgImg" onclick="document.getElementById('aboutImgImg').style.animation = 'shake 250ms ease';">
|
||||
<img src="assets/images/michi2_blob.png" alt="Michi von Ah" title="A picture of me" id="aboutImgImg" onclick="document.getElementById('aboutImgImg').style.animation = 'shake 250ms ease';">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -145,7 +145,7 @@
|
|||
<button onclick="showQrcode('assets/socialmedia/insta-code.png', 'insta1Img', 'assets/socialmedia/michi_pb.jpeg');">Show QR-Code</button>
|
||||
</div>
|
||||
<div>
|
||||
<img src="assets/socialmedia/michi_pb.jpeg" alt="Michi" id="insta1Img">
|
||||
<img src="assets/socialmedia/michi_pb.jpeg" alt="Michi" title="A picture of me" id="insta1Img">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -155,29 +155,29 @@
|
|||
<div>
|
||||
<h3>Instagram @vompictures</h3>
|
||||
<ul>
|
||||
<li>15+ Followers</li>
|
||||
<li>19+ Posts</li>
|
||||
<li>225+ Likes (total)</li>
|
||||
<li>12+ Likes (average per post)</li>
|
||||
<li>20+ Followers</li>
|
||||
<li>20+ Posts</li>
|
||||
<li>280+ Likes (in total)</li>
|
||||
<li>13+ Likes (average per post)</li>
|
||||
<li>Photography, Nature, Switzerland</li>
|
||||
</ul>
|
||||
<button onclick="window.open('https://instagram.com/vompictures')">Follow now!</button>
|
||||
</div>
|
||||
<div id="insta2FirstImgContainer">
|
||||
<div id="insta2FirstImage" class="insta2FirstImg" data-location="Giswilerstock">
|
||||
<img class="insta2Img1" src="assets/socialmedia/img14.jpeg" alt="Giswilerstock">
|
||||
<img class="insta2Img1" src="assets/socialmedia/img14.jpeg" alt="Giswilerstock" title="Giswilerstock">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="insta2ImgContainer">
|
||||
<div class="insta2ImgDiv" data-location="Sachseln">
|
||||
<img class="insta2Img" src="assets/socialmedia/img7.jpeg" alt="Sachseln">
|
||||
<img class="insta2Img" src="assets/socialmedia/img7.jpeg" alt="Sachseln" title="Sachseln">
|
||||
</div>
|
||||
<div class="insta2ImgDiv" data-location="Giswilerstock">
|
||||
<img class="insta2Img" src="assets/socialmedia/img15.jpeg" alt="Giswilerstock">
|
||||
<img class="insta2Img" src="assets/socialmedia/img15.jpeg" alt="Giswilerstock" title="Giswilerstock">
|
||||
</div>
|
||||
<div class="insta2ImgDiv" data-location="Lugano">
|
||||
<img class="insta2Img" src="assets/socialmedia/img20.jpg" alt="Lugano">
|
||||
<img class="insta2Img" src="assets/socialmedia/img20.jpg" alt="Lugano" title="Lugano">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -190,9 +190,9 @@
|
|||
<li>150+ Tweets</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<img src="assets/tweets/tweet1.png" alt="Tweet">
|
||||
</div>
|
||||
<!--<div>
|
||||
<img src="assets/tweets/tweet1.png" alt="Tweet" title="Tweet">
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -203,12 +203,12 @@
|
|||
<ul>
|
||||
<li>20+ public repos</li>
|
||||
<li>Languages: HTML, CSS & JavaScript</li>
|
||||
<li>1′180+ Commits</li>
|
||||
<li>1′360+ Commits</li>
|
||||
<button onclick="window.open('https://github.michivonah.ch')">Read my code!</button>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<img src="assets/socialmedia/code-snippet-v2.png" alt="Code Snippet">
|
||||
<img src="assets/socialmedia/code-snippet-v2.png" alt="Code Snippet" title="Code Snippet from my news app">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -219,7 +219,7 @@
|
|||
<li></li>
|
||||
<li>Competence tests: HTML & CSS</li>
|
||||
</ul>
|
||||
<img src="" alt="LinkedIn">
|
||||
<!-- <img src="" alt="LinkedIn"> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -231,14 +231,14 @@
|
|||
<div id="projectContainer">
|
||||
<div id="projectRow1" class="projectRow"> <!-- ROW 1 for Projects -->
|
||||
<div class="project" data-aos="fade-right">
|
||||
<img src="assets/projects/escaperoom-logo.png">
|
||||
<img src="assets/projects/escaperoom-logo.png" alt="Michi's Escape Room Logo" title="Michi's Escape Room">
|
||||
<h3>Michi's Escape Room</h3>
|
||||
<p>As a final project for school, I programmed an Escape Room game. For this I used the programming languages HTML, CSS and JavaScript. If you want to know more about the development process of my game, click <a class="link" href="https://michivonah.notion.site/Michi-s-Escape-Room-9ba11f6e71a6449b9bdc222cd7c7f647">here <i class="ai-link-out"></i></a>. If you want to play it, click the button below. Good luck.</p>
|
||||
<button onclick="window.open('https://escape.michivonah.ch')">Open <i class="ai-link-out"></i></button>
|
||||
</div>
|
||||
|
||||
<div class="project" data-aos="fade-right">
|
||||
<img src="assets/projects/news-logo.png">
|
||||
<img src="assets/projects/news-logo.png" alt="News App Logo" title="N3WS App">
|
||||
<h3>N3WS App</h3>
|
||||
<p>I have created a simple RSS feed reader. It helps you to manage your news. You can use it on any device and install it as a PWA (Progressive web app). There may still be some bugs and errors as the app is still under development. As soon as the final version is ready, you will find it here.</p>
|
||||
<button onclick="window.open('https://news.michivonah.ch')">Open <i class="ai-link-out"></i></button>
|
||||
|
|
@ -246,14 +246,14 @@
|
|||
</div>
|
||||
<div id="projectRow2" class="projectRow"> <!-- ROW 2 for Projects -->
|
||||
<div class="project" data-aos="fade-left">
|
||||
<img src="assets/projects/pw-generator.png">
|
||||
<img src="assets/projects/pw-generator.png" alt="Password Generator Logo" title="Password Generator">
|
||||
<h3>Password Generator</h3>
|
||||
<p>I‘ve programmed a simple and minimalistic password generator. You can choose from different password types and copy the password afterwards.</p>
|
||||
<button onclick="window.open('https://passwords.michivonah.ch')">Open <i class="ai-link-out"></i></button>
|
||||
</div>
|
||||
|
||||
<div class="project" data-aos="fade-left">
|
||||
<img src="assets/jump.png">
|
||||
<img src="assets/jump.png" alt="Bitmoji" title="Michi's Blog">
|
||||
<h3>Michi′s Blog</h3>
|
||||
<p>I have created a blog with Notion. There I write small texts from time to time. The blog is written in German.</p>
|
||||
<button onclick="window.open('https://blog.michivonah.ch')">Open <i class="ai-link-out"></i></button>
|
||||
|
|
@ -266,6 +266,7 @@
|
|||
<div id="faq" class="section" data-aos="fade-right">
|
||||
<div class="inner-width">
|
||||
<h1 class="sectionTitle" title="This are some questions.">FAQ - Frequently Asked Questions</h1>
|
||||
<p>Click on the question to display the answer.</p>
|
||||
<div>
|
||||
<div class="faqObject" onclick="toggleQuestion();">
|
||||
<i class="ai-chevron-down faq-icon"></i>
|
||||
|
|
@ -304,6 +305,8 @@
|
|||
<input id="terms" type="checkbox" name="terms" required>
|
||||
<!-- <label for="terms" id="termsLabel"><p>I accept that my form submissions will be shared with the formspark service to organize them. You can find out how your data is treated at formspark in their <a class="link" href="https://formspark.io/legal/privacy-policy/">privacy policy <i class="ai-link-out"></i></a>.</p></label> -->
|
||||
<label for="terms" id="termsLabel"><p>I accept that the information I provide in the form will be shared with the WhatsApp Business API to send a message. You can find out how the data is processed by WhatsApp in the <a class="link" href="https://www.whatsapp.com/legal/business-data-processing-terms">WhatsApp privacy policy <i class="ai-link-out"></i></a>.</p></label>
|
||||
<input id="honeypot" type="checkbox" name="honeypot" hidden>
|
||||
<label for="honeypot" id="honeypotLabel" hidden></label>
|
||||
<button id="submitContactForm" name="submit" type="button" onclick="checkForm();">Send <i class="ai-send"></i></button>
|
||||
</form>
|
||||
<p>Hint: The form is currently disabled because the site is stil under construction. It can still change.</p>
|
||||
|
|
@ -334,7 +337,7 @@
|
|||
<p>The content of this page was created by me or I have the rights to use it here.</p>
|
||||
<p>Used resources from others:</p>
|
||||
<ul>
|
||||
<li>Animate on Scroll Libary - michalsnik.github.io/aos</li>
|
||||
<li>Animate on Scroll Library - michalsnik.github.io/aos</li>
|
||||
<li>Akar Icons - akaricons.com</li>
|
||||
<li>Google Fonts - fonts.google.com</li>
|
||||
<li>BGjar - bgjar.com</li>
|
||||
|
|
@ -367,6 +370,10 @@
|
|||
<i class="ai-chevron-up"></i>
|
||||
</div>
|
||||
|
||||
<div id="stats" style="display:none;">
|
||||
<img src="https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fmichivonah.ch%2FNEW&count_bg=%2379C83D&title_bg=%23555555&icon=&icon_color=%23E7E7E7&title=hits&edge_flat=false" alt="Stats" title="Stats">
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
// Loading
|
||||
|
|
@ -384,8 +391,8 @@
|
|||
}
|
||||
// random home img
|
||||
randomHomeImg();
|
||||
AOS.init({disable: 'mobile'});
|
||||
//AOS.init({disable: true});
|
||||
//AOS.init({disable: 'mobile'});
|
||||
AOS.init({disable: true});
|
||||
// hide loadingscreen
|
||||
document.getElementById('loadingScreen').style.display = "none";
|
||||
});
|
||||
|
|
@ -491,6 +498,7 @@
|
|||
}
|
||||
|
||||
function checkForm(){
|
||||
console.log();
|
||||
var requiredFields = ['surname-field', 'lastname-field', 'email-field', 'message-text', 'terms'];
|
||||
var errorCount = 0;
|
||||
for(var i = 0; i < requiredFields.length; i++){
|
||||
|
|
@ -508,6 +516,7 @@
|
|||
errorCount++;
|
||||
}
|
||||
}
|
||||
if(document.getElementById('honeypot').checked === true) errorCount++;
|
||||
if(errorCount <= 0){
|
||||
var name = document.getElementById('surname-field').value + " " + document.getElementById('lastname-field').value;
|
||||
sendWhatsapp(name, document.getElementById('email-field').value, document.getElementById('subject-field').value, document.getElementById('message-text').value);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue