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 --- +
#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 --- +