diff --git a/src/about.md b/src/about.md
index 8ec9a072ba74ddf486cc3d83f696d2b99d647d97..710f7cec28096ac7eea42cb9416ad7114947d0d9 100644
--- a/src/about.md
+++ b/src/about.md
@@ -1,15 +1,13 @@
---
title: About
-menu: True
+introduction: "Coko is a fiscally sponsored charitable not-for-profit project of [Aspiration](https://aspirationtech.org/). All surplus goes back into the development of what we call “Community Products†(see [Community](https://coko.foundation/community)). These products are developed with the community, for the community, and are freely available (open source) for use and re-use. Here are the principles that guide us."
+menu: true
class: about
layout: single.njk
order: 1
heading: 100% Open Source. 100% Community.
-chapeau:
---
-Coko is a fiscally sponsored charitable not-for-profit project of [Aspiration](https://aspirationtech.org/). All surplus goes back into the development of what we call “Community Products†(see [Community](https://coko.foundation/community)). These products are developed with the community, for the community, and are freely available (open source) for use and re-use. Here are the principles that guide us:
-
## Collaboration and Community
Collaboration and community is at the heart of everything that we do. It defines who we are, how we work, and the things we believe in. Like openness, transparency, and treating people with respect.
diff --git a/src/layouts/base.njk b/src/layouts/base.njk
index 86dacfc6595290bba73603661ed1a00f0c11385c..eadd87742a914830ab4cf7fac41ad08184ebe2f5 100644
--- a/src/layouts/base.njk
+++ b/src/layouts/base.njk
@@ -12,13 +12,13 @@
<script type="module">
document
- .documentElement
- .classList
- .remove('no-js');
- document
- .documentElement
- .classList
- .add('js');
+.documentElement
+.classList
+.remove('no-js');
+document
+.documentElement
+.classList
+.add('js');
</script>
<meta name="description" content="{{site.description}}">
@@ -41,27 +41,27 @@
{# twitter: do not track #}
<meta name="twitter:dnt" content="on">
{% block styleLayout %}
- {# TODO: add a way to change the layout from the yaml/code #}
+ {# TODO: add a way to change the layout from the yaml/code #}
{% endblock %}
{% block styles %}
- {% if theme %}
- <link rel="stylesheet" href="/css/{{theme}}/main.css">
- {% elseif folder %}
- {# {% if folder in site.configuration.books %} #}
- {% for item in site.books %}
- {% if folder == item.folder %}
- <link rel="stylesheet" href="/css/{{item.theme}}/main.css">
- {% endif %}
- {% endfor %}
- {% else %}
- <link rel="stylesheet" href="/css/{{site.configuration.theme}}/theme.css">
- <link rel="stylesheet" href="/css/{{site.configuration.theme}}/main.css">
- {# {% endif %} #}
- {# {% else %} #}
- {% endif %}
+ {% if theme %}
+ <link rel="stylesheet" href="/css/{{theme}}/main.css">
+ {% elseif folder %}
+ {# {% if folder in site.configuration.books %} #}
+ {% for item in site.books %}
+ {% if folder == item.folder %}
+ <link rel="stylesheet" href="/css/{{item.theme}}/main.css">
+ {% endif %}
+ {% endfor %}
+ {% else %}
+ <link rel="stylesheet" href="/css/{{site.configuration.theme}}/theme.css">
+ <link rel="stylesheet" href="/css/{{site.configuration.theme}}/main.css">
+ {# {% endif %} #}
+ {# {% else %} #}
+ {% endif %}
{% endblock %}
<script>
@@ -77,38 +77,38 @@
{% block scriptHead %}
- {% include "_partials/scripthead.njk" %}
+ {% include "_partials/scripthead.njk" %}
{% endblock %}
{% block matomo %}
- <!-- Matomo -->
- <script type="text/javascript">
- var _paq = window._paq = window._paq || [];
- /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
- _paq.push(["setCookieDomain", "*.coko.foundation"]);
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function () {
- var u = "https://stats.coko.foundation/";
- _paq.push([
- 'setTrackerUrl', u + 'matomo.php'
- ]);
- _paq.push(['setSiteId', '1']);
- var d = document,
- g = d.createElement('script'),
- s = d.getElementsByTagName('script')[0];
- g.async = true;
- g.src = u + 'matomo.js';
- s
- .parentNode
- .insertBefore(g, s);
- })();
- </script>
- <noscript>
- <p><img src="https://stats.coko.foundation/matomo.php?idsite=1&rec=1" style="border:0;" alt=""/></p>
- </noscript>
- <!-- End Matomo Code -->
+ <!-- Matomo -->
+ <script type="text/javascript">
+ var _paq = window._paq = window._paq || [];
+ /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+ _paq.push(["setCookieDomain", "*.coko.foundation"]);
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function () {
+ var u = "https://stats.coko.foundation/";
+ _paq.push([
+ 'setTrackerUrl', u + 'matomo.php'
+ ]);
+ _paq.push(['setSiteId', '1']);
+ var d = document,
+ g = d.createElement('script'),
+ s = d.getElementsByTagName('script')[0];
+ g.async = true;
+ g.src = u + 'matomo.js';
+ s
+ .parentNode
+ .insertBefore(g, s);
+ })();
+ </script>
+ <noscript>
+ <p><img src="https://stats.coko.foundation/matomo.php?idsite=1&rec=1" style="border:0;" alt=""/></p>
+ </noscript>
+ <!-- End Matomo Code -->
{% endblock %}
</head>
@@ -117,11 +117,11 @@
{% block background %}{% endblock %}
{% block topbar %}
- {% include "_partials/menu.njk" %}
+ {% include "_partials/menu.njk" %}
{% endblock %}
{# {% block side %}
- <aside class="readMenu">
+ <aside class="readMenu">
<button id="nightmode">
<span class="icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"/><path d="M12 1v2M12 21v2M4.2 4.2l1.4 1.4M18.4 18.4l1.4 1.4M1 12h2M21 12h2M4.2 19.8l1.4-1.4M18.4 5.6l1.4-1.4"/></svg>
@@ -130,37 +130,37 @@
</button>
</aside>
- {% include "_partials/readbuttons.njk" %}
+ {% include "_partials/readbuttons.njk" %}
{% endblock %}#}
<main>
{% block header %}
- <header>
- <h1>{{heading}}</h1>
- {% if chapeau %}
-
- <section class="intro">
- <h2>{{chapeau | markdowninline | safe}}</h2>
- </section>
- {% endif %}
- </header>
+ <header>
+ <h1>{{heading}}</h1>
+ {% if chapeau %}
+
+ <section class="intro">
+ <h2>{{chapeau | markdowninline | safe}}</h2>
+ </section>
+ {% endif %}
+ </header>
{% endblock %}
{% block content %}
- <article>
- {{content | safe}}
- </article>
+ <article>
+ {{content | safe}}
+ </article>
{% endblock %}
</main>
{% block footer %}
- {% include "_partials/footer.njk" %}
+ {% include "_partials/footer.njk" %}
{% endblock %}
{# check instant #}
<script src="//instant.page/5.1.0" type="module" integrity="sha384-by67kQnR+pyfy8yWP4kPO12fHKRLHZPfEsiSXR8u2IKcTdxD805MGUXBzVPnkLHw"></script>
{% block scripts %}
- <script type="module" src="/js/main.js"></script>
+ <script type="module" src="/js/main.js"></script>
{% endblock %}
{% block printpreview %}{% endblock %}
diff --git a/src/layouts/single.njk b/src/layouts/single.njk
index a5fddd842fe71812aa62f756124811c8bceb1e71..172d3db9c54b6fbcb401c75d2b8bbaf20b5bba63 100644
--- a/src/layouts/single.njk
+++ b/src/layouts/single.njk
@@ -3,9 +3,13 @@
{% block content %}
-
- <article>
- {{content | safe}}
- </article>
-
-{% endblock %}
\ No newline at end of file
+
+
+ {% if "About" in title %}
+ <section class="introduction">{{ introduction | markdownify | safe }}</section>
+ {% endif %}
+ <article>
+ {{content | safe}}
+ </article>
+
+{% endblock %}
diff --git a/static/css/theme-coko/main.css b/static/css/theme-coko/main.css
index bbce73f7b7fefe4a29daba1e6f5925368753d1d2..b603920f4e157b4abd56843b7ea1cea038240460 100644
--- a/static/css/theme-coko/main.css
+++ b/static/css/theme-coko/main.css
@@ -1,32 +1,59 @@
@import url(../layout/one-column.css);
/* colors set up */
-
-.home h1, .home h2, .home h3, .home h4, .home p.tags, .home a{
+.home h1,
+.home h2,
+.home h3,
+.home h4,
+.home p.tags,
+.home a {
color: var(--color-primary);
}
-.about h1, .about h2, .about h3, .about h4, .about a {
+.about h1,
+.about h2,
+.about h3,
+.about h4,
+.about a {
color: var(--color-primary);
}
-
-.products h1, .products h2, .products h3, .products h4, .products a {
+.products h1,
+.products h2,
+.products h3,
+.products h4,
+.products a {
color: var(--color-primary);
}
-.services h1, .services h2, .services h3, .services h4, .services p.tags, .services .card, .services a {
-color: var(--color-secondary);}
+.services h1,
+.services h2,
+.services h3,
+.services h4,
+.services p.tags,
+.services .card,
+.services a {
+ color: var(--color-secondary);
+}
-.community h1, .community h2, .community h3, .community h4, .community a {
+.community h1,
+.community h2,
+.community h3,
+.community h4,
+.community a {
color: var(--color-secondary);
}
-.news h1, .news h2, .news h3, .news h4, .news p.tags, .news a {
+.news h1,
+.news h2,
+.news h3,
+.news h4,
+.news p.tags,
+.news a {
}
.blog-post h1,
.blog-post h2,
.blog-post h3,
-.blog-post a
-{}
+.blog-post a {
+}
.articles h1,
.articles h2,
.articles h3,
@@ -94,14 +121,13 @@ aside {
.about aside,
.blog-post aside {
background: linear-gradient(
- 6deg,
- rgba(255, 255, 255, 1) 58%,
- rgba(150, 208, 206, 1) 100%
+ 6deg,
+ rgba(255, 255, 255, 1) 58%,
+ rgba(150, 208, 206, 1) 100%
);
filter: drop-shadow(700px -15px 15px #62c8c4);
}
-
.articles aside,
.article-single aside,
.team aside {
@@ -416,7 +442,8 @@ img.team-map {
}
.team .board .wide {
grid-column-start: 1;
-grid-column-end: 5; }
+ grid-column-end: 5;
+}
.team .board .wide h2 {
max-width: 38ch;
@@ -637,7 +664,7 @@ footer section.infos a:hover {
font-size: 1.2em;
font-weight: 300;
}
-.article-single .post-content p ,
+.article-single .post-content p,
.article-single .post-content li {
font-weight: 300;
}
@@ -659,13 +686,13 @@ footer section.infos a:hover {
}
.articles main .grid-item {
- margin-top: 2em
+ margin-top: 2em;
}
.community article img {
width: 50%;
margin: 2em auto;
- text-align:right;
+ text-align: right;
}
.sponsors {
list-style-type: none;
@@ -677,15 +704,31 @@ footer section.infos a:hover {
grid-template-columns: repeat(4, minmax(1px, 1fr));
}
}
-@media screen and (min-width: 1300px) { .sponsors{grid-template-columns: repeat(4, minmax(1px, 1fr));} }
-@media screen and (max-width: 700px) { .sponsors{grid-template-columns: repeat(3, minmax(1px, 1fr));} }
-@media screen and (max-width: 500px) { .sponsors{grid-template-columns: repeat(2, minmax(1px, 1fr));} }
-@media screen and (max-width: 400px) { .sponsors{display: block} }
+@media screen and (min-width: 1300px) {
+ .sponsors {
+ grid-template-columns: repeat(4, minmax(1px, 1fr));
+ }
+}
+@media screen and (max-width: 700px) {
+ .sponsors {
+ grid-template-columns: repeat(3, minmax(1px, 1fr));
+ }
+}
+@media screen and (max-width: 500px) {
+ .sponsors {
+ grid-template-columns: repeat(2, minmax(1px, 1fr));
+ }
+}
+@media screen and (max-width: 400px) {
+ .sponsors {
+ display: block;
+ }
+}
.sponsors li {
padding: 3em;
padding-bottom: 2em;
- align-content:center;
+ align-content: center;
justify-content: center;
align-content: center;
align-items: center;
@@ -699,6 +742,15 @@ footer section.infos a:hover {
}
.sponsors li img {
- width: 100%;
+ width: 100%;
object-fit: contain;
}
+
+.introduction {
+ grid-column: 1/4;
+ margin-bottom: 3em;
+}
+
+.articles header + h2 {
+ margin-top: 0;
+}