Skip to content

Commit

Permalink
Create header and footer
Browse files Browse the repository at this point in the history
  • Loading branch information
mraerino committed Jun 8, 2024
1 parent 955444f commit 6a62d98
Show file tree
Hide file tree
Showing 14 changed files with 439 additions and 3 deletions.
Binary file added assets/hero.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions layouts/assets/blahaj.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions layouts/assets/logo-monochrome.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 2 additions & 1 deletion layouts/base.njk
Original file line number Diff line number Diff line change
Expand Up @@ -30,11 +30,12 @@
</style>
</head>
<body>
{% include "header.njk" %}
<main>
{{ logos["logo-monochrome.svg"] | safe }}
<article>
{{ content | safe }}
</article>
</main>
{% include "footer.njk" %}
</body>
</html>
14 changes: 14 additions & 0 deletions layouts/footer.njk
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<footer>
<div class="blahaj">
{% include "assets/blahaj.svg" %}
</div>
<nav>
<ul>
{%- for page in collections.all -%}
{%- if page.data.footer_link -%}
<li><a href="{{ page.url }}">{{ page.data.title }}</a></li>
{%- endif -%}
{%- endfor -%}
</ul>
</nav>
</footer>
12 changes: 12 additions & 0 deletions layouts/header.njk
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<header>
{% include "./assets/logo-monochrome.svg" %}
<nav>
<ul>
{%- for page in collections.all -%}
{%- if page.data.header_link -%}
<li><a href="{{ page.url }}">{{ page.data.title }}</a></li>
{%- endif -%}
{%- endfor -%}
</ul>
</nav>
</header>
131 changes: 129 additions & 2 deletions layouts/style.css
Original file line number Diff line number Diff line change
@@ -1,14 +1,141 @@
:root {
--color-bg: #171717;
--color-fg: #e8e8e8;
--color-accent: #00c300;
--color-accent-focus: #00ff00;
}

body {
font-family: sans-serif;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
background: #fff;
color: #1f1f1f;
background: var(--color-bg);
color: var(--color-fg);
margin: 0;
}

a {
color: var(--color-accent);
}

a:hover {
color: var(--color-accent-focus);
}

main {
max-width: 600px;
padding: 2rem;
}

main article {
line-height: 1.5;
}

main article p {
margin-bottom: 1.5rem;
}

main article hr {
border: none;
margin-bottom: 5rem;
}

.video-embed {
position: relative;
overflow: hidden;
width: 100%;
height: 0;
padding-top: calc(100% / (16 / 9));
}

.video-embed > iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

header {
background-image: linear-gradient(
0deg,
var(--color-bg) 0,
var(--color-bg) 1rem,
rgba(255, 255, 255, 0) 6rem
),
url("/assets/hero.jpg");
background-size: cover;
background-position: center;
width: 100%;
padding: 50vh 2rem 0 2rem;
box-sizing: border-box;
position: relative;

display: flex;
align-items: stretch;
flex-wrap: wrap;
}

header svg {
width: 100%;
height: auto;
max-width: 20rem;
}

header svg path {
stroke: transparent;
fill: var(--color-fg);
}

header nav {
display: flex;
margin-left: auto;
margin-top: 2rem;

font-family: "CP Mono", monospace;
font-size: 1.25em;
}

header nav ul {
margin: 0;
list-style: none;
display: flex;
gap: 1rem;
height: 45%;
align-items: flex-end;
}

footer {
width: 100%;
display: flex;
}

footer .blahaj {
padding: 1rem;
}

footer .blahaj svg {
height: 100%;
width: auto;
}

footer nav {
margin-left: auto;
}

footer nav ul {
list-style: none;
display: flex;
justify-content: flex-start;
gap: 0.5rem;
padding: 0 2rem;
}

@media (prefers-color-scheme: light) {
:root {
--color-bg: #fff;
--color-fg: #1f1f1f;
}
}
Binary file added pages/code-of-conduct/Awareness-Briefkasten.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 6a62d98

Please sign in to comment.