index image link

This commit is contained in:
bronku 2026-05-14 21:51:19 +02:00
parent 90b0b4427d
commit 0849b5b442
2 changed files with 19 additions and 17 deletions

View file

@ -12,7 +12,9 @@
<body> <body>
<nav> <nav>
<div> <div>
<img href="index.html" alt="logo" src="images/logo.png"/> <a href="index.html">
<img alt="logo" src="images/logo.png"/>
</a>
<div> <div>
<a{{if (ne . "index")}} href="index.html" {{end}}>Strona Główna</a> <a{{if (ne . "index")}} href="index.html" {{end}}>Strona Główna</a>
<a{{if (ne . "wyroby")}} href="wyroby.html" {{end}}>Wyroby</a> <a{{if (ne . "wyroby")}} href="wyroby.html" {{end}}>Wyroby</a>

View file

@ -1,18 +1,18 @@
body > nav { body > nav {
position: sticky; position: sticky;
top: 0;
z-index: 50; z-index: 50;
backdrop-filter: blur(var(--backdrop-blur)); top: 0;
background-color: color-mix(in srgb, var(--surface), transparent 20%);
padding: 1rem; padding: 1rem;
background-color: color-mix(in srgb, var(--surface), transparent 20%);
backdrop-filter: blur(var(--backdrop-blur));
& > div { & > div {
display: grid; display: grid;
align-items: center;
grid-template-columns: 1fr auto 1fr; grid-template-columns: 1fr auto 1fr;
grid-template-rows: 1fr; grid-template-rows: 1fr;
align-items: center;
& > img { & img {
width: 20rem; width: 20rem;
} }
@ -36,18 +36,18 @@ body > nav {
gap: 2rem; gap: 2rem;
@media (max-width: 768px) { @media (max-width: 768px) {
display: flex;
align-items: center;
justify-content: center;
grid-row: 2; grid-row: 2;
grid-column: 1/ span 2; grid-column: 1/ span 2;
display: flex;
justify-content: center;
align-items: center;
} }
& > a { & > a {
font-size: 1.25rem; font-size: 1.25rem;
color: var(--on-background);
text-decoration: none;
font-weight: bold; font-weight: bold;
text-decoration: none;
color: var(--on-background);
&[href] { &[href] {
font-weight: 200; font-weight: 200;
@ -61,8 +61,8 @@ body > nav {
/* The main selected link doesn't have a href attribute, so we can use that for styles */ /* The main selected link doesn't have a href attribute, so we can use that for styles */
&:not([href]) { &:not([href]) {
color: var(--primary);
padding-bottom: 8px; padding-bottom: 8px;
color: var(--primary);
border-bottom: 2px solid var(--primary); border-bottom: 2px solid var(--primary);
} }
@ -90,25 +90,25 @@ footer {
} }
& > :last-child { & > :last-child {
font-weight: lighter;
font-size: 0.75rem; font-size: 0.75rem;
font-weight: lighter;
} }
} }
& > :nth-child(2) a { & > :nth-child(2) a {
flex-direction: column;
align-items: flex-start; align-items: flex-start;
flex-direction: column;
} }
& a { & a {
font-size: 0.875rem; font-size: 0.875rem;
color: var(--on-background);
display: flex; display: flex;
flex-direction: row;
align-items: center; align-items: center;
flex-direction: row;
justify-content: flex-start; justify-content: flex-start;
text-decoration: none;
margin: 1rem 0; margin: 1rem 0;
text-decoration: none;
color: var(--on-background);
& > div { & > div {
display: flex; display: flex;