diff --git a/_includes/head.njk b/_includes/head.njk index 15a0426..3099fd6 100644 --- a/_includes/head.njk +++ b/_includes/head.njk @@ -23,9 +23,9 @@ - + + content="the logo of FediZineFest 2026-2027 which is a 4 by 4 grid of blocky letters reading fedi zine fest 26-27, randomly colored with the 26-27 palette" /> diff --git a/css/main.css b/css/main.css index 3430715..0be98fb 100644 --- a/css/main.css +++ b/css/main.css @@ -1,20 +1,20 @@ +@font-face { + font-family: "Bloktype"; + src: url("/fonts/BLOKTYPE.woff2"); +} + :root { color-scheme: light dark; - --color-bg-light: #f0f0f0; - --color-text-light: #640054; - --color-header-light: #185370; - --color-warn-light: #fbcc0a; + --color-light: #f3ccfb; + --color-dark: #130b16; + --color-pink: #ea33d2; + --color-blurple: #6d12e2; - --color-bg-dark: #1f1f1f; - --color-text-dark: #91c73b; - --color-header-dark: #ff9b37; - --color-warn-dark: #540033; - - --color-bg: light-dark(var(--color-bg-light), var(--color-bg-dark)); - --color-text: light-dark(var(--color-text-light), var(--color-text-dark)); - --color-header: light-dark(var(--color-header-light), var(--color-header-dark)); - --color-warn: light-dark(var(--color-warn-light), var(--color-warn-dark)); + --color-bg: light-dark(var(--color-light), var(--color-dark)); + --color-text: light-dark(var(--color-dark), var(--color-light)); + --color-header: light-dark(var(--color-blurple), var(--color-pink)); + --color-warn: light-dark(var(--color-pink), var(--color-blurple)); } /* numbered components are from https://www.joshwcomeau.com/css/custom-css-reset/ */ @@ -211,3 +211,33 @@ footer p { text-align: center; } } + +.bloktype { + font-family: "Bloktype"; + font-size: 1.35em; /* because of the blocks the letters are rather small */ + color: var(--color-text); +} + +@media (prefers-color-scheme: light) { + .dark-mode { + display: none; + } +} + +@media (prefers-color-scheme: dark) { + .light-mode { + display: none; + } +} + +/* only float insets on larger screens */ +@media (min-width: 551px) { + .inset { + clear: both; + width: 40%; + padding-left: 1rem; + padding-bottom: .5rem; + float: right; + background-color: var(--color-bg); + } +} diff --git a/css/palette.css b/css/palette.css index a2a8a99..60d22f3 100644 --- a/css/palette.css +++ b/css/palette.css @@ -9,24 +9,40 @@ --color-header-dark-2025: #ff9b37; --color-warn-dark-2025: #540033; + --color-light-2026: #f3ccfb; + --color-dark-2026: #130b16; + --color-pink-2026: #ea33d2; + --color-blurple-2026: #6d12e2; + border-radius: .5rem; padding: .5rem; text-align: center; font-weight: bold; } -@media (prefers-color-scheme: light) { - .color { - border: .1rem solid var(--color-bg-dark); - } +.color { + border: .1rem solid var(--color-text); } -@media (prefers-color-scheme: dark) { - .color { - border: .1rem solid var(--color-bg-light); - } +/* 2026-2027 */ + +#light-2026, +#pink-2026 { + color: var(--color-dark-2026); } +#dark-2026, +#blurple-2026 { + color: var(--color-light-2026); +} + +#light-2026 { background-color: var(--color-light-2026); } +#dark-2026 { background-color: var(--color-dark-2026); } +#pink-2026 { background-color: var(--color-pink-2026); } +#blurple-2026 { background-color: var(--color-blurple-2026); } + +/* 2025 */ + #bg-light-2025, #warn-light-2025 { color: var(--color-text-light-2025); diff --git a/eleventy.config.js b/eleventy.config.js index 45a1579..837cd72 100644 --- a/eleventy.config.js +++ b/eleventy.config.js @@ -24,7 +24,10 @@ export default async function (eleventyConfig) { }); /* Passthroughs */ - eleventyConfig.addPassthroughCopy("./favicon.ico"); + eleventyConfig + .addPassthroughCopy("favicon.ico") + .addPassthroughCopy("robots.txt") + .addPassthroughCopy("fonts"); /* Images */ eleventyConfig.addPlugin(eleventyImageTransformPlugin, { diff --git a/favicon.ico b/favicon.ico index f4d1448..69eb868 100644 Binary files a/favicon.ico and b/favicon.ico differ diff --git a/fonts/BLOKTYPE.woff2 b/fonts/BLOKTYPE.woff2 new file mode 100644 index 0000000..800f007 Binary files /dev/null and b/fonts/BLOKTYPE.woff2 differ diff --git a/src/img/2026-2027-logo-dark.png b/src/img/2026-2027-logo-dark.png new file mode 100644 index 0000000..620e7f3 Binary files /dev/null and b/src/img/2026-2027-logo-dark.png differ diff --git a/src/img/2026-2027-logo-light.png b/src/img/2026-2027-logo-light.png new file mode 100644 index 0000000..5604ebf Binary files /dev/null and b/src/img/2026-2027-logo-light.png differ diff --git a/src/index.md b/src/index.md index 7c369cd..e64f057 100644 --- a/src/index.md +++ b/src/index.md @@ -3,10 +3,16 @@ eleventyNavigation: key: home order: 1 title: FediZineFest +layout: base.njk --- +

FediZineFest

+ FediZineFest ran in [2024](/years/2024) and [2025](/years/2025). We're now looking at [FediZineFest 2026-2027](/years/2026-2027). +![the logo of FediZineFest 2026-2027 which is a 4 by 4 grid of blocky letters reading fedi zine fest 26-27, randomly colored with the 26-27 palette](/img/2026-2027-logo-dark.png){class="inset light-mode"} +![the logo of FediZineFest 2026-2027 which is a 4 by 4 grid of blocky letters reading fedi zine fest 26-27, randomly colored with the 26-27 palette](/img/2026-2027-logo-light.png){class="inset dark-mode"} + ## What A zine sharing and distribution project for the fediverse. diff --git a/src/palette.md b/src/palette.md index 4f17908..d8943f4 100644 --- a/src/palette.md +++ b/src/palette.md @@ -4,6 +4,13 @@ title: Palette {% css %}{% include "css/palette.css" %}{% endcss %} +## 2026-2027 + +

#f3ccfb

+

#130b16

+

#ea33d2

+

#6d12e2

+ ## 2025 ### Light diff --git a/src/years/2026-2027/guidelines.md b/src/years/2026-2027/guidelines.md index 948beaa..32a3aa0 100644 --- a/src/years/2026-2027/guidelines.md +++ b/src/years/2026-2027/guidelines.md @@ -1,7 +1,10 @@ --- title: FediZineFest 2026-2027 Guidelines +layout: base.njk --- +

FediZineFest 2026-2027 Guidelines

+ ## What A zine sharing and distribution project for the fediverse. diff --git a/src/years/2026-2027/index.md b/src/years/2026-2027/index.md index 62f306e..655214a 100644 --- a/src/years/2026-2027/index.md +++ b/src/years/2026-2027/index.md @@ -1,8 +1,12 @@ --- title: FediZineFest 2026-2027 +layout: base.njk --- -## Overview +

FediZineFest 2026-2027

+ +![the logo of FediZineFest 2026-2027 which is a 4 by 4 grid of blocky letters reading fedi zine fest 26-27, randomly colored with the 26-27 palette](/img/2026-2027-logo-dark.png){class="inset light-mode"} +![the logo of FediZineFest 2026-2027 which is a 4 by 4 grid of blocky letters reading fedi zine fest 26-27, randomly colored with the 26-27 palette](/img/2026-2027-logo-light.png){class="inset dark-mode"} The interest form for 2026-2027 is open on the [signup page.](/signup)