Kenzo/Gallus_Pub
2
1
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Update styles and layout for improved responsiveness and consistency:

Browse Source 
- **Global fonts**: Adjusted `font-family` fallback to include `serif`.
- **Header improvements**: Refined structure with flexbox, adjusted heights, and fixed responsive issues (e.g., removed hardcoded margins).
- **New Layout styles**: Added scoped `Layout.css` for better layout control and modularity.
- **Links fix**: Corrected casing in `About` and `Contact` links for proper navigation.
This commit is contained in:
k
2025-07-20 13:57:33 +02:00
parent f3952e7e81
commit 3c1a6fae2c
5 changed files with 35 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Header.astro
View File

@ -35,8 +35,8 @@ import "../../styles/components/Header.css"
</div>
<a href="/about">About</a>
<a href="/contact">Contact</a>
<a href="/About">About</a>
<a href="/Contact">Contact</a>
</nav>

1
src/components/Layout.astro
View File

@ -2,6 +2,7 @@
// src/components/Layout.astro
import Header from "./Header.astro";
import Footer from "./Footer.astro";
import "../../styles/components/Layout.css"
---
<!doctype html>

34
styles/components/Header.css
View File

@ -7,6 +7,11 @@
z-index: 1000;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(5px);
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem 1rem;
height: 70px;
}
@ -34,7 +39,6 @@
.nav-main {
display: flex;
align-items: center;
margin-right: 377px;
}
.nav-main a,
@ -86,16 +90,8 @@
}
@media (max-width: 768px) {
.nav-container {
padding: 1rem;
}
.nav-links {
gap: 1rem;
}
.nav-main {
margin-right: 20px;
.header {
height: 65px;
}
.logo {
@ -106,14 +102,16 @@
.dropdown-content {
right: 0;
}
.header-spacer {
height: 65px;
}
}
@media (max-width: 480px) {
.header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem;
height: 60px;
}
.logo {
@ -121,13 +119,13 @@
height: 2.5em;
}
.nav-main {
margin-right: 10px;
}
.nav-main a,
.dropdbtn {
margin: 0 0.5rem;
font-size: 0.9rem;
}
.header-spacer {
height: 60px;
}
}

15
styles/components/Layout.css Normal file
View File

@ -0,0 +1,15 @@
html, body {
height: 100%;
margin: 0;
}
body {
display: flex;
flex-direction: column;
min-height: 100vh;
}
main {
flex: 1;
padding: 0 1rem;
}

2
styles/index.css
View File

@ -11,7 +11,7 @@ html {
}
body {
font-family: var(--font-family-primary);
font-family: var(--font-family-primary), serif;
background-color: var(--color-background);
color: var(--color-text);
line-height: var(--line-height);