Commits: 7

Uniform capitalization of Esc, not ESC

Fix a typo.

index 1b16067..c94b4d7 100644
--- a/content/people/joachim-nuyttens.md
+++ b/content/people/joachim-nuyttens.md
@@ -4,4 +4,4 @@ date: 2025-05-09T22:10:00
=---
=
=
-I'm the COO of [Trevalco](https://trevalco.com/), an SME providing services to the life sciences industry. As a technology, open-source and Linux enthusiast I advise ESC on the development of services of value to small and medium sized companies in EU.
+I'm the COO of [Trevalco](https://trevalco.com/), an SME providing services to the life sciences industry. As a technology, open-source and Linux enthusiast I advise Esc Co. on the development of services of value to small and medium sized companies in EU.
index 6a04119..b651d38 100644
--- a/content/solutions/features/switzerland-based.md
+++ b/content/solutions/features/switzerland-based.md
@@ -4,6 +4,6 @@ extra:
=render: false
=---
=
-Companies which have their headquarters in Switzerland fall under the jurisdiction of this country. They are obliged to follow Swiss law and Swiss court orders. Switzerland has currently very strict privacy regulations, and it has a history of neutrality which goes back centuries. ESC advices that Switzerland is a very safe country to store your data.
+Companies which have their headquarters in Switzerland fall under the jurisdiction of this country. They are obliged to follow Swiss law and Swiss court orders. Switzerland has currently very strict privacy regulations, and it has a history of neutrality which goes back centuries. Esc Co. advises that Switzerland is a very safe country to store your data.
=
=<!-- more -->
index 03ca26e..f0af211 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -50,7 +50,7 @@
=    <meta name="twitter:card" content="summary_large_image">
=    <meta property="og:description" content="{\{ description \}}">
=    <meta property="og:site_name" content="{\{ config.title \}}">
-    <meta name="twitter:image:alt" content="The ESC Collective logo">
+    <meta name="twitter:image:alt" content="The Esc Collective logo">
=
=    <style type="text/css">
=      :root {
@@ -518,11 +518,11 @@
=        <img
=          id="logo"
=          src="{\{ get_url(path='/esc-logo.svg') \}}"
-          alt="The ESC logo with a sky-blue ring and a bright yellow ray passing through it."
+          alt="The Esc logo with a sky-blue ring and a bright yellow ray passing through it."
=        />
=
=        <hgroup class="title">
-          <h1>esc collective</h1>
+          <h1>Esc Collective</h1>
=          <p>supporting european digital independence</p>
=        </hgroup>
=      </a>
@@ -538,7 +538,7 @@
=    <footer class="full-bleed-background">
=      <img
=        src="{\{ get_url(path='/favicon.svg') \}}"
-        alt="ESC Icon"
+        alt="Esc Icon"
=        class="icon"
=      />
=
@@ -556,7 +556,7 @@
=        <li><span class="input">Extremely Sassy and Classy</span></li>
=        <li><span class="input">Electronic Sustainability Collective</span></li>
=        <li><span class="input">Etiam Secundum Comodum</span></li>
-        <li><span class="input">ESC Sounds Cool</span></li>
+        <li><span class="input">Esc Sounds Cool</span></li>
=        <li><span class="input">Europe Stands with Canada</span></li>
=        <li><span class="input">Egalitarian Software Community</span></li>
=        <li><span class="input">Einstein Collective</span></li>

Set footnotes to appear at the bottom

They are not used on this branch, but other branches use them, so it's better to unify the behavior early.

index 42b8539..7c5153d 100644
--- a/config.toml
+++ b/config.toml
@@ -17,6 +17,7 @@ build_search_index = true
=# Whether to do syntax highlighting
=# Theme can be customised by setting the `highlight_theme` variable to a theme supported by Zola
=highlight_code = true
+bottom_footnotes = true
=
=[[taxonomies]]
=name = "solution_categories"
index f0af211..1344f7b 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -144,6 +144,15 @@
=        color: var(--light-color);
=      }
=
+      .footnotes {
+        font-size: 75%;
+        margin-top: 25vh;
+
+        &:before {
+          content: "Footnotes";
+          font-weight: bold;
+        }
+      }
=
=      /* playful colors */
=      .yellow-accent {

Improve home page spacing and scroll behavior

index 1344f7b..c0256a8 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -75,6 +75,7 @@
=        --blue: oklch(from var(--yellow) L C 264deg);
=
=        scroll-behavior: smooth;
+        scroll-padding-top: 20vh;
=      }
=
=      /* Special treatment for landing page */
@@ -88,8 +89,7 @@
=        }
=
=        main h2 {
-          padding-top: 25vh;
-          margin-top: 25vh;
+          margin-top: 50vh;
=        }
=
=        body > footer {
@@ -97,7 +97,6 @@
=        }
=
=        main > p:first-of-type {
-          padding-top: 15vh;
=          font-size: 200%;
=        }
=
@@ -154,6 +153,11 @@
=        }
=      }
=
+      .footnote-reference {
+        scroll-margin-top: 35vh;
+      }
+
+
=      /* playful colors */
=      .yellow-accent {
=        --accent-color: var(--yellow)

Remove excessive whitespace from openmoji component

So it space around the moji can be better controlled by content authors.

index 7d2a03f..d97c22c 100644
--- a/templates/components.html
+++ b/templates/components.html
@@ -53,11 +53,10 @@
={\% endmacro natural_list %}
=
=
-{\% macro openmoji (moji, size="1x") %}
-{# An icon from https://openmoji.org/library/ #}
-  <i class="om om-{\{ moji | slugify \}} om-{\{ size \}}">
-  </i>
-{\% endmacro openmoji %}
+{\%- macro openmoji (moji, size="1x") -%}
+{#- An icon from https://openmoji.org/library/ -#}
+  <i class="om om-{\{ moji | slugify \}} om-{\{ size \}}"></i>
+{\%- endmacro openmoji -%}
=
={\% macro strip_interactive (html, tags="a button") %}
={# Remove interactive tags (links and buttons).
index bd99dfb..72d6caf 100644
--- a/templates/shortcodes/om.html
+++ b/templates/shortcodes/om.html
@@ -1,7 +1,7 @@
-{\% import "components.html" as components %}
+{\%- import "components.html" as components -%}
=
-{\% if not size %}
-{\% set size="1x" %}
-{\% endif %}
+{\%- if not size -%}
+{\%- set size="1x" -%}
+{\%- endif -%}
=
-{\{ components::openmoji (moji=moji, size=size) \}}
+{\{- components::openmoji (moji=moji, size=size) -\}}

Implement a nowrap class

Useful on a span to keep moji and corresponding text together.

index c0256a8..9a93d78 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -390,6 +390,10 @@
=        padding: 3rem calc(1rem + var(--full-bleed-margin));
=      }
=
+      .nowrap {
+        white-space: nowrap;
+      }
+
=
=      /* PROMPT ANIMATION */
=
index f1684d7..3cba3ab 100644
--- a/templates/shortcodes/wrap_with.html
+++ b/templates/shortcodes/wrap_with.html
@@ -1,3 +1,3 @@
=<{\{ tag \}} class="{\{ class \}}">
-{\{ body | markdown | safe \}}
+{\{ body | markdown(inline=true) | safe \}}
=</{\{tag\}}>

Prevent line break before the call to action moji

More generally icons can now have labels, in which case the icon will stay on the same line as the beginning (or end) of the text.

index 2586bef..0589652 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -1,7 +1,7 @@
=---
=---
=
-Move away from big tech. Stay in control of your tools, your data, and your values. [Book a call to learn more](https://cal.com/tad-lispy/esc-co-intro) {\{ om (moji="call me hand") \}}
+Move away from big tech. Stay in control of your tools, your data, and your values. {\% om (moji="call me hand", position="end", size="4x") %}[Book a call to learn more](https://cal.com/tad-lispy/esc-co-intro){\% end %}
=
={\{ table_of_contents() \}}
=
index 10e0501..af0b17e 100644
--- a/static/openmoji-preamble.css
+++ b/static/openmoji-preamble.css
@@ -21,6 +21,28 @@ licensed under MIT: https://ellekasai.mit-license.org/
=    background-size: contain;
=}
=
+/* Icon with label
+ *
+ * Applied to an <i> element that has content (is not empty)
+ *
+ * Use om-position-end to put icon to the right of label.
+ *
+ * Does not support size classes.
+*/
+i.om:not(:empty) {
+    display: inline;
+    margin: 0;
+
+    padding-left: var(--moji-base-size);
+    background-position: 0 center;
+
+    &.om-position-end {
+        padding-left: 0;
+        padding-right: var(--moji-base-size);
+        background-position: 100% center;
+    }
+}
+
=/* When applied to a list item, use it as a bullet */
=li.om {
=    display: list-item;
index d97c22c..b66e8f7 100644
--- a/templates/components.html
+++ b/templates/components.html
@@ -53,9 +53,11 @@
={\% endmacro natural_list %}
=
=
-{\%- macro openmoji (moji, size="1x") -%}
+{\%- macro openmoji (moji, size="1x", position="start", body="") -%}
={#- An icon from https://openmoji.org/library/ -#}
-  <i class="om om-{\{ moji | slugify \}} om-{\{ size \}}"></i>
+  <i class="om om-{\{ moji | slugify \}} om-{\{ size \}} om-position-{\{ position \}}">{\{
+    body | markdown(inline=true) | safe
+  \}}</i>
={\%- endmacro openmoji -%}
=
={\% macro strip_interactive (html, tags="a button") %}
index 72d6caf..838d727 100644
--- a/templates/shortcodes/om.html
+++ b/templates/shortcodes/om.html
@@ -1,7 +1,13 @@
={\%- import "components.html" as components -%}
=
={\%- if not size -%}
-{\%- set size="1x" -%}
+{\%- set size = "1x" -%}
+{\%- endif -%}
+{\%- if not position -%}
+{\%- set position = "start" -%}
+{\%- endif -%}
+{\%- if not body -%}
+{\%- set body = "" -%}
={\%- endif -%}
=
-{\{- components::openmoji (moji=moji, size=size) -\}}
+{\{- components::openmoji (moji=moji, size=size, position=position, body=body) -\}}

Add "back to top" links to home page sections

index 0589652..d66b7e5 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -19,6 +19,9 @@ But that choice comes with trade-offs:
=
=For many mission-led teams, that's no longer acceptable.
=
+{\{ back_to_top() \}}
+
+
=
=# {\{ om(moji="handshake" size="2x") \}} What we do
=
@@ -33,6 +36,9 @@ We guide you through the transition from proprietary platforms to ethical tools
=
=[You can read more about our services here](@/services/_index.md).
=
+{\{ back_to_top() \}}
+
+
=
=# How it works
=
@@ -56,6 +62,8 @@ We don't drop a list of tools and walk away. We work with you from start to fini
=    We train your team in plain language and stay available for any follow-up questions or support.
={\% end %}
=
+{\{ back_to_top() \}}
+
=
=# {\{ om(moji="index pointing at the viewer" size="2x") \}} Who we work with
=
@@ -66,6 +74,8 @@ We're built for organisations with long-term goals, and who care about autonomy,
=- Schools and Educational Projects
=- Local governments and public sector organisations
=
+{\{ back_to_top() \}}
+
=
=# {\{ om(moji="glowing star" size="2x") \}} Why Esc Collective?
=
@@ -78,3 +88,4 @@ You're not stuck. There are better tools. And you don't need to figure them out
=
=[Book a free 30-minute intro call](https://cal.com/tad-lispy/esc-co-intro) to see what switching away from big tech could look like for you.
=
+{\{ back_to_top() \}}
index 9a93d78..d1b6aa7 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -230,6 +230,11 @@
=        }
=      }
=
+      a[href="#top"] {
+        font-size: 200%;
+        float: right;
+      }
+
=      hgroup h1 {
=        margin: 0;
=        font-weight: 400;
new file mode 100644
index 0000000..ce33cb2
--- /dev/null
+++ b/templates/shortcodes/back_to_top.html
@@ -0,0 +1,3 @@
+{\%- import "components.html" as components -%}
+
+<a href="#top" title="back to top">{\{ components::openmoji(moji="TOP arrow") \}}</a>