ebby/Bluewaterblog
1
0
Fork 0
Code Issues 10 Pull requests Projects Releases Packages Wiki Activity Actions

added new logo and made stuff
All checks were successful
Build and Deploy Astro App / build_and_deploy (push) Successful in 51s
Details

Browse source
This commit is contained in:
Chiara 2026-08-22 17:55:29 +02:00
parent d84c5a9973
commit 1dcfb77157
7 changed files with 40 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
blog/public/BWM_512.webp Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 66 KiB

BIN
blog/public/favicon.ico Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 9.4 KiB

BIN
blog/public/favicon.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 1.3 KiB

37
blog/src/components/Header.astro
View file

@ -1,16 +1,18 @@
---
import Logo from "./Logo.astro";
---
<header> <header>
<span>Blauwasser Mausis</span> <Logo />
<span class="vertical-line"></span>
<nav> <nav>
<div class="nav-left"> <div class="nav-left">
<span id="side-nav-header">Blauwasser Mausis</span> <Logo id="side-nav-logo" />
<a class="nav-link" href="/">Startseite</a> <a class="" href="/">Startseite</a>
<!-- <a class="nav-link" href="/about">Über uns</a> -->
</div> </div>
<div class="nav-right"> <div class="nav-right">
<a class="nav-link" href="/impressum" style="#789">Impressum</a> <a href="/impressum" style="#789">Impressum</a>
<a class="nav-link" href="/privacy-policy" style="#789">Datenschutz</a> <a href="/privacy-policy" style="#789">Datenschutz</a>
</div> </div>
</nav> </nav>
@ -60,7 +62,7 @@
#menu-toggle, #menu-toggle,
.menu-icon, .menu-icon,
.menu-backdrop, .menu-backdrop,
#side-nav-header { #side-nav-logo {
display: none; display: none;
} }
@ -79,29 +81,27 @@
pointer-events: none; pointer-events: none;
} }
#side-nav-header {
display: block;
padding-bottom: 32px;
}
nav { nav {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
width: 66vw; width: 66vw;
height: 100vh; height: 100vh;
padding: 42px 24px 24px; padding: 32px;
background: #ddd; background: var(--primary-color);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
justify-content: flex-start; justify-content: flex-start;
gap: 30px;
transform: translateX(-100%); transform: translateX(-100%);
transition: transform 0.3s ease; transition: transform 0.3s ease;
z-index: 3; z-index: 3;
a {
color: whitesmoke;
}
} }
.nav-left, .nav-left,
@ -110,8 +110,9 @@
align-items: flex-start; align-items: flex-start;
} }
.nav-right > a { .nav-left {
font-size: 1rem; gap: 32px;
margin-bottom: 64px;
} }
nav:has(~ #menu-toggle:checked) { nav:has(~ #menu-toggle:checked) {

20
blog/src/components/Logo.astro Normal file
View file

@ -0,0 +1,20 @@
<a id="logo-container" class="no-link-link" href="/">
<img id="logo-img" src="/BWM_512.webp" />
<span id="logo-text">Blauwasser Mausis</span>
</a>
<style>
#logo-container {
display: flex;
align-items: center;
gap: 16px;
}
#logo-img {
height: 64px;
}
#logo-text {
font-weight: bold;
}
</style>

2
blog/src/layouts/Main.astro
View file

@ -6,7 +6,7 @@ import "../styles/global.css";
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" type="image/png" href="/favicon.png" /> <link rel="icon" type="image/x-icon" href="/favicon.ico" />
<link <link
rel="alternate" rel="alternate"
type="application/rss+xml" type="application/rss+xml"

1
blog/src/styles/global.css
View file

@ -23,7 +23,6 @@ body {
} }
.nav-link { .nav-link {
font-size: 1.2rem;
text-decoration: none; text-decoration: none;
color: black; color: black;
} }