header fixes

This commit is contained in:
Leif Niemczik 2022-11-18 15:09:45 +01:00
parent 504f06b0d0
commit 824e5d9533

View file

@ -16,6 +16,7 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin'
<title>{`${title ? title + ' / ' : ''}${permaTitle}`}</title> <title>{`${title ? title + ' / ' : ''}${permaTitle}`}</title>
</head> </head>
<body> <body>
<header class='site-header'>
{ {
title && ( title && (
<a href='/'> <a href='/'>
@ -23,6 +24,7 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin'
</a> </a>
) )
} }
{!title && <div />}
<ul class='socials'> <ul class='socials'>
<li class='mastodon'> <li class='mastodon'>
<a <a
@ -39,6 +41,7 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin'
</a> </a>
</li> </li>
</ul> </ul>
</header>
<slot /> <slot />
<footer> <footer>
<a href='/imprint/'>Imprint</a> //// <a href='/imprint/'>Imprint</a> ////
@ -89,16 +92,22 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin'
overflow-x: hidden; overflow-x: hidden;
width: 100%; width: 100%;
} }
.site-header {
display: flex;
justify-content: space-between;
}
.logo { .logo {
max-width: 12rem; max-width: 12rem;
height: 100%;
margin-left: 0.75rem;
} }
.socials { .socials {
list-style: none; list-style: none;
display: inline-flex;
justify-content: flex-end;
margin: 0; margin: 0;
padding: 1.5rem; padding: 1.5rem;
height: 1.5rem; height: 4.5rem;
display: flex;
justify-content: flex-end;
gap: 1rem; gap: 1rem;
li { li {
height: 100%; height: 100%;