diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 00000000..7a73a41b --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,2 @@ +{ +} \ No newline at end of file diff --git a/style.css b/style.css index 148eadd4..cdbb742f 100644 --- a/style.css +++ b/style.css @@ -15,25 +15,29 @@ body { } .navbar { - padding: 8px 0px; - height: 60px; - transition: background-color 0.3s, backdrop-filter 0.3s, color 0.3s; /* Added transitions for smooth color change */ - backdrop-filter: blur(0); /* Initially no blur */ + padding: fixed; + top: 0; + width: 100%; + z-index: 1030; + padding: 15px 0; + background-color: rgba(245, 190, 190, 0.7); + backdrop-filter: blur(8px); + transition: background-color 0.5s ease, backdrop-filter 0.5s ease; } .navbar a { text-decoration: none; - color: white; + color: #333; font-size: 1.3rem; + transition: color 0.3s ease,border-bottom 0.3s ease; } /* Navbar link hover effect */ -.navbar a:hover, -.navbar.scrolled a:hover { - color :#fff; - border-bottom: 1px solid #fff; /* Add bottom border on hover */ - border-top: 1px solid #fff; /* Add top border on hover */ +.navbar a:hover{ + color: #fff; + border-bottom: 1px solid #fff; } -s + + .navbar.fixed-top { position: fixed; top: 0; @@ -42,7 +46,7 @@ s } .navbar.scrolled { background-color: rgb(176, 63, 63); - backdrop-filter: blur(10px); + backdrop-filter: blur(15px); color: #fff; } .intro_container {