finished navbar

This commit is contained in:
janis
2022-11-04 12:59:44 +01:00
parent 5847297d34
commit 1a488cf029
3 changed files with 40 additions and 14 deletions

View File

@@ -1,21 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<title>Home - janishutz.com</title>
<title>About - janishutz.com</title>
<link rel="stylesheet" href="./mainstyle.css">
</head>
<body>
<ul>
<li><a href="#">Home</a></li>
<li class="dropdown">
<a href="javascript:void(0)" class="dropbtn">Legal</a>
<div class="dropdown-content dropdown-animation">
<a href="./privacypolicy.html">Privacy Policy for apps</a>
</div>
<ul class="Menu">
<li class="mainitems"><a href="./index.html">Home</a></li>
<li class="dropdown mainitems">
<a href="#">Legal</a>
<ul class="dropdown-menu">
<li class="subitems"><a href="./privacypolicy.html">Privacy Policy for apps</a></li>
</ul>
</li>
<li><a href="./support.html">Support</a></li>
<li><a href="./about.html">About me</a></li>
<li class="mainitems"><a href="./support.html">Support</a></li>
<li class="mainitems"><a href="#">About me</a></li>
</ul>
<h1>About me</h1>

View File

@@ -9,15 +9,27 @@
<ul class="Menu">
<li class="mainitems"><a href="#">Home</a></li>
<li class="dropdown mainitems">
<a href="#">Legal</a>
<a href="./projects.html">Projects</a>
<ul class="dropdown-menu">
<li class="subitems"><a href="./privacypolicy.html">QR & Barcode Insight</a></li>
<li class="subitems"><a href="./privacypolicy.html">StorageManager</a></li>
<li class="subitems"><a href="./privacypolicy.html">FSR Image & Video Upscaler Frontend</a></li>
<li class="subitems"><a href="./privacypolicy.html">MusicPlayer</a></li>
<li class="subitems"><a href="./privacypolicy.html">BiogasControllerApp</a></li>
</ul>
</li>
<li class="dropdown mainitems">
<a href="#">About</a>
<ul class="dropdown-menu">
<li class="subitems"><a href="./privacypolicy.html">Privacy Policy for apps</a></li>
<li class="mainitems"><a href="./about.html">About me</a></li>
</ul>
</li>
<li class="mainitems"><a href="./support.html">Support</a></li>
<li class="mainitems"><a href="./about.html">About me</a></li>
</ul>
<h1>Welcome to janishutz.com</h1>
<h1>Welcome to janishutz.com!</h1>
<p>Learn more about my projects!</p>
<a href="./projects">Learn more</a>
</body>
</html>

View File

@@ -26,6 +26,8 @@ a {
}
a:hover {
animation-name: fadein;
animation-duration: 300ms;
background-color: darkblue;
}
@@ -56,9 +58,21 @@ a:hover {
}
}
@keyframes rotateMenu {
0% {
transform: rotateX(-90deg)
}
70% {
transform: rotateX(20deg)
}
100% {
transform: rotateX(0deg)
}
}
.dropdown:hover .dropdown-menu {
display: block;
animation: growDown 300ms ease-in-out forwards;
animation: rotateMenu 300ms ease-in-out forwards;
}