feat: add audio-tactile card content and template

fluid-project · Jun 15, 2022 · 50884a7 · 50884a7
1 parent fdae354
commit 50884a7
Show file tree

Hide file tree

Showing 3 changed files with 74 additions and 4 deletions.
diff --git a/src/_includes/layouts/audio-tactile-cards.njk b/src/_includes/layouts/audio-tactile-cards.njk
@@ -0,0 +1,29 @@
+{% extends "layouts/base.njk" %}
+
+{% block pageBody %}
+<body class="audio-tactile">
+    {% uioTemplate %}
+    {% include "partials/global/header.njk" %}
+    <main class="main">
+        <h1 class="audio-tactile__title">{{ title }}</h1>
+
+        {% include "partials/components/breadcrumb.njk" %}
+
+        <nav class="flc-toc-tocContainer"></nav>
+
+        {% block content %}
+            {{ content | safe }}
+        {% endblock %}
+    </main>
+    {% include "partials/global/footer.njk" %}
+    {# 
+        Calling a custom duplicate of eleventy-plugin-fluid's uioInit shortcode in
+        order to run it without the text-size preference until issue #57 is solved.
+        
+        This call is duplicated in base.njk and home.njk
+
+        https://github.com/fluid-project/handbook.floeproject.org/issues/57
+    #}
+    {% uioCustomInit config.languages[lang].uioSlug, config.languages[lang].dir %}
+</body>
+{% endblock %}
diff --git a/src/collections/techniques/en-CA/3DPrintedAudioTactileGraphics.md b/src/collections/techniques/en-CA/3DPrintedAudioTactileGraphics.md
@@ -5,9 +5,10 @@ eleventyNavigation:
     key: 3D Printed Audio-Tactile Graphics
     order: 3
 ---
-This article introduces a set of recommendations which is intended for educators, designers, makers, or others who want
-to create inclusive materials for a wider range of students, including and with a greater focus on blind students.
-Specifically, the recommendations are aimed at developing audio-tactile graphics that are 3D printed.
+This article introduces [a set of recommendations](/techniques/45-recommendations-for-3d-printed-audio-tactile-graphic-design/)
+which is intended for educators, designers, makers, or others who want to create inclusive materials for a wider range
+of students, including and with a greater focus on blind students. Specifically, the recommendations are aimed at
+developing audio-tactile graphics that are 3D printed.
 
 The information on these pages won’t make you an expert on the subject, but it will help you understand the process of
 planning, producing and using audio-tactile graphics. We encourage you to access the related resources, seek out more
@@ -45,7 +46,7 @@ of students, even those without disabilities. By eliminating barriers to informa
 These are materials that can be developed with and for the community, produced with low-cost technologies and shared for
 free on the web.
 
-## Read more about the 45 recommendations.
+## Read more about [the 45 recommendations](/techniques/45-recommendations-for-3d-printed-audio-tactile-graphic-design/)
 
 ## Related resources
 

diff --git a/src/collections/techniques/en-CA/AudioTactileCards.md b/src/collections/techniques/en-CA/AudioTactileCards.md
@@ -0,0 +1,40 @@
+---
+title: 45 recommendations for 3D printed audio-tactile graphic design
+layout: layouts/audio-tactile-cards
+eleventyNavigation:
+    parent: 3D Printed Audio-Tactile Graphics
+    key: 45 recommendations for 3D printed audio-tactile graphic design
+---
+
+<div class="audio-tactile__intro">
+
+Here we present 45 recommendations for the design of 3D printed audio-tactile graphics, organised into three categories:
+
+- Planning,
+- Materials and Production, and
+- Context, Use, and Inclusion.
+
+The recommendations are arranged on interactive cards (see diagram) containing:
+
+- The recommendation code (code legend),
+- The recommendation,
+- Additional information, tips and/or examples.
+
+You can use these recommendations freely and at any order it suits you best.
+
+Although audio-tactile graphics can be applied to many settings, these recommendations are aimed at inclusive education.
+Refer back to the main article for more information.
+
+</div>
+
+<div class="audio-tactile__credits">
+
+These recommendations are the result of the doctoral thesis by Emilia Christie Picelli Sanches, from the
+[Design Graduate Program (PPGDesign)](http://www.prppg.ufpr.br/site/ppgdesign/pb/), at the
+[Federal University of Paraná (UFPR)](https://www.ufpr.br/portalufpr/) and with the collaboration of the Inclusive Design
+Research Center (IDRC) at OCAD University.
+
+The research was funded by the [Brazilian Federal Foundation for Support and Evaluation of Graduate Education (CAPES)](https://www.gov.br/capes/pt-br).
+Licensed under Creative Commons Attribution 4.0.
+
+</div>