Merge branch 'main' into minutes-2024-12-03

.github/workflows/check-consistency.yml

@@ -14,9 +14,11 @@ jobs:
         with:
           go-version: 1.21
       - name: Build tooling
-        run: (cd tooling/go && go build ./cmd/local-overrides-enforcer && go build ./cmd/sprint-consistency)
+        run: (cd tooling/go && go build ./cmd/local-overrides-enforcer && go build ./cmd/sprint-consistency && go build ./cmd/site-consistency)
       - name: Check override consistency
         run: ./tooling/go/local-overrides-enforcer
       - name: Check sprint consistency
         # TODO: The Launch should probably have themes, but for now we'll ignore it so we can be checking the rest of the repo without having to fix this.
         run: ./tooling/go/sprint-consistency --exclude-roots org-cyf-launch
+      - name: Check site consistency
+        run: ./tooling/go/site-consistency

README.md

@@ -14,7 +14,7 @@ Code Your Future is a volunteer-led community of tech professionals, and we teac
 
 Our curriculum content is all open source, and our teaching style is [flipped classroom](https://teachingcommons.stanford.edu/teaching-guides/blended-and-hybrid-teaching-guide/frameworks-blended-and-hybrid-teaching/flipped). This means that anyone should be able to follow the curriculum content independently. We offer mentoring and support to help people work through it, but the content does not assume a teacher/mentor will be present for programme delivery.
 
-Our Global Syllabus Team is responsible for the overall direction of the main curriculum. They decide the strategy and accept new tested content into the core. Find out more by learning [how to contribute](/contributing.md). 
+Our Global Syllabus Team is responsible for the overall direction of the main curriculum. They decide the strategy and accept new tested content into the core. Find out more by learning [how to contribute](/CONTRIBUTING.md). 
 
 Our curriculum and our curriculum platform are tightly integrated with GitHub. We want our learners to know how to use Git and GitHub and how modern development practices work, so we do almost everything right on GitHub. Learners submit their work by creating a pull request to the project repo. They plan their work using GitHub Projects, and they track their progress on the issues. We code review via the GitHub PR interface, and we have some automation and unit testing on quizzes and exercises/problems. 
 

common-content/config

@@ -0,0 +1 @@
+../tooling/common-config/config

common-content/deploy-netlify.sh

@@ -1 +1 @@
-../deploy-netlify.sh
+../tooling/common-config/deploy-netlify.sh

common-content/netlify.toml

@@ -0,0 +1 @@
+../tooling/common-config/netlify.toml

common-docs/config

@@ -0,0 +1 @@
+../tooling/common-config/config

common-docs/content/common-theme/front-matter/blocks/backlog/index.md

@@ -10,7 +10,7 @@ emoji= '📋'
 
 ```toml
 backlog="Module-Name"
-backlog_filter="Week 1"
+backlog_filter="📅 Week 1"
 ```
 
 Only active on the [Backlog view](/common-theme/pages/backlog). This will show a list of all the issues in the backlog repo for the module. You can filter by any label that exists in the backlog repo.

common-docs/content/common-theme/pages/backlog.md

@@ -6,7 +6,7 @@ emoji= '🥞'
 menu_level = ['sprint']
 weight = 2
 backlog= 'Module-Template'
-backlog_filter= 'Week 1'
+backlog_filter='📅 Week 1'
 +++
 
 This view lists issues. It pulls these issues from Github using [Hugo GetRemote](https://gohugo.io/functions/resources/getremote/). It is looking for a repo in your org named `Module-<module-name>` where it expects issues to live. You can edit this of course.

common-docs/content/common-theme/shortcodes/multiple-choice.md

@@ -7,6 +7,8 @@ menu=["shortcodes"]
 
 This is a simple "check understanding" block that allows you to create a multiple choice question with options and feedback. Short assessments like this are a pedagogically sound strategy to boost retention and understanding.
 
+If you need to use `|` characters in your answers/feedback, you can specify the `delimiter` key to use a different delimiter between them.
+
 ### Invoke
 
 ```go

common-docs/deploy-netlify.sh

@@ -0,0 +1 @@
+../tooling/common-config/deploy-netlify.sh

common-docs/netlify.toml

@@ -0,0 +1 @@
+../tooling/common-config/netlify.toml

common-theme/archetypes/backlog.md

@@ -5,7 +5,7 @@ emoji= '🥞'
 menu_level = ['sprint']
 weight = 2
 backlog= 'Module-Template'
-backlog_filter= 'Sprint 1'
+backlog_filter='📅 Sprint 1'
 +++
 
 This view lists all the issues for the current sprint. It is looking for a repo in your org named `Module-<module-name>` where it expects issues to live. You can edit this of course.

common-theme/assets/scripts/time-stamper.js

@@ -2,15 +2,12 @@ class TimeStamper extends HTMLElement {
   constructor() {
     super();
     this.attachShadow({ mode: "open" });
-    this.shadowRoot.innerHTML = `
-            <style>
-                /* You can include any component-specific styles here */
-            </style>
-            <slot></slot>
-        `;
-
-    this.timelineEntries = this.querySelectorAll(".c-block");
-    this.startTime = this.getAttribute('start-time');
+    this.shadowRoot.innerHTML = `<slot></slot>`;
+
+    this.timelineEntries = this.querySelectorAll(
+      ".c-block:not(.is-nested .c-block)"
+    );
+    this.startTime = this.getAttribute("start-time");
   }
 
   connectedCallback() {

common-theme/assets/styles/03-elements/misc-phrasing.scss

@@ -52,9 +52,16 @@ summary > * {
   display: inline-block;
   margin: 0;
 }
-summary::marker {
-  color: var(--theme-color--accent);
-  font-size: var(--theme-type-size--3);
+details {
+  summary::marker {
+    color: var(--theme-color--accent);
+    font-size: var(--theme-type-size--3);
+    transition: all 0.5s cubic-bezier(0.4, 2.08, 0.55, 0.44);
+  }
+  &:hover summary::marker {
+    color: var(--theme-color--pop);
+    font-size: calc(2px + var(--theme-type-size--3));
+  }
 }
 hr {
   border: 0;

common-theme/assets/styles/04-components/chip.scss

@@ -14,7 +14,9 @@
   }
   &__icon {
     font-size: var(--theme-type-size--2);
-    clip-path: circle();
+    &--circle {
+      clip: circle();
+    }
   }
   @include on-event() {
     .c-chip__title {

common-theme/assets/styles/04-components/map.scss

@@ -26,20 +26,29 @@
     left: 0;
   }
 
-  &__stop {
+  &__stop,
+  &__header {
     position: relative;
     z-index: var(--layer);
     @media (min-width: $c-max) {
       max-width: calc(
         calc(var(--theme-spacing--container) / 3) - var(--theme-spacing--gutter)
       );
     }
+
+    // when this header has details
+    > summary {
+      list-style-position: inside;
+      padding-left: var(--theme-spacing--3);
+    }
+    &[open] > summary {
+      list-style-position: inside;
+    }
   }
 
   &__title {
     color: var(--theme-color--brand);
-    position: absolute;
-    z-index: 2;
+    margin-bottom: calc(-1 * var(--theme-spacing--4));
     transform: translate3d(
         calc(-1 * var(--theme-spacing--3)),
         calc(-1 * var(--theme-spacing--5)),

common-theme/assets/styles/04-components/page-footer.scss

@@ -6,9 +6,6 @@
     justify-content: center;
     align-items: center;
     text-transform: lowercase;
-  }
-
-  &__this {
-    color: var(--theme-color--accent-shade);
+    font: var(--theme-font--system);
   }
 }

common-theme/assets/styles/04-components/terms.scss

@@ -0,0 +1,7 @@
+.c-terms {
+  max-width: var(--theme-spacing--linelength);
+  dt {
+    font-weight: 600;
+    color: var(--theme-color--brand);
+  }
+}

common-theme/assets/styles/states/bad.scss

@@ -0,0 +1,5 @@
+//use for failure/incorrect/negative
+
+.is-bad {
+  background: var(--theme-color--bad);
+}

common-theme/assets/styles/states/problem.scss

@@ -0,0 +1,5 @@
+//use for warning alerts
+
+.is-problem {
+  font-weight: bolder;
+}

common-theme/config

@@ -0,0 +1 @@
+../tooling/common-config/config

common-theme/deploy-netlify.sh

@@ -1 +1 @@
-../deploy-netlify.sh
+../tooling/common-config/deploy-netlify.sh

common-theme/layouts/_default/backlog.html

@@ -1,9 +1,61 @@
 {{ define "main" }}
+  {{ $currentPath := .Page.RelPermalink }}
+  {{ $backlog_filter := .Page.Params.backlog_filter }}
+  {{ $repos := .Page.Params.backlog }}
+  {{ if not (reflect.IsSlice $repos) }}
+    {{ $repos = slice $repos }}
+  {{ end }}
   <article>
     {{ partial "page-header.html" . }}
     {{ with .Content }}
       <section class="c-copy">{{ . }}</section>
     {{ end }}
-    {{ partial "issues.html" . }}
+    {{/* you can have multiple repos but probably for sanity let's just stick with one label filter
+      for each repo, grab the issues that match the filter
+    */}}
+    {{ range $repos }}
+      {{ $issueBlocks := partial "block/issues-list-as-blocks.html" (dict "backlog" . "backlog_filter" $backlog_filter) }}
+      {{ $repo := . }}    
+      {{ range $issueBlocks }}
+        <div class="c-alert" role="alert" hidden>
+          <span class="alert__message"></span>
+          <button aria-label="Close" class="clean-btn close" type="button">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <details class="c-issue">
+          <summary class="c-issue__title e-heading__3">
+            {{ .name }}
+            <a class="c-issue__link" href="{{ .src }}">🔗</a>
+            <a
+              href="https://curriculum.codeyourfuture.io/api/clone?state={{ dict "issue" .number "module" $repo "sprint" $backlog_filter "prevURL" (urls.AbsLangURL $currentPath) | jsonify }}"
+              class="e-button"
+              data-props="{{ .Page.RelPermalink }}">
+              Clone
+            </a>
+          </summary>
+          <div class="c-issue__body">
+            {{ partial "block/block.html" (dict "block" . "Page"
+              $.Page "Site" site )
+            }}
+          </div>
+        </details>
+        {{ with .labels.nodes }}
+          <ul class="c-issue__labels c-label__list">
+            {{ range . }}
+              <li
+                class="c-issue__label c-label"
+                style="--color:#{{ .color }}4d">
+                <span
+                  class="c-issue__label-name c-label__name"
+                  title="{{ .description }}">
+                  {{ .name }}
+                </span>
+              </li>
+            {{ end }}
+          </ul>
+        {{ end }}
+      {{ end }}
+    {{ end }}
   </article>
 {{ end }}

common-theme/layouts/_default/term.html

@@ -3,18 +3,27 @@
 
   {{ partial "page-header.html" . }}
     <article class="c-copy">
-      <h3>📛 This is a term definition page</h3>
+    {{ with .Page.Params.details }}
+      <dl class="c-terms">
+        {{ range $metadatum := index . }}
+          <dt>{{ index $metadatum "name" }}</dt> <dd>{{ index $metadatum "value" }}</dd>
+        {{ end }}
+      </dl>
+    {{ end }}
+
       {{ .Content }}
       {{ with .Pages }}
       <footer class="c-page__footer">
-        <h4>Citations</h4>
+        {{ $taxonomy := site.GetPage "/track_kinds" }}
+        <h3>🏷️ {{ or $taxonomy.Params.member_name "Members" }}</h3>
         <ul class="c-label__list">
         {{ range sort . "Title"}}
           <li class="c-label" style="--color:var(--theme-color--block)">
         {{ with .Permalink }}<a href="{{ .}}">{{end}}
             <span class="c-label__name">{{ .Params.emoji |default "🧩"}} {{ .Title }}</span>
         {{ with .Permalink }}</a>{{end}}
       </li>    
+
         {{ end }}
         </ul>
       </footer>

common-theme/layouts/partials/block/issue.html

@@ -21,20 +21,22 @@
           {{ end }}
         {{ end }}
       {{ end }}
+
+      {{/* extract objectives */}}
+      {{ $extractedObjectives := partial "strings/extract-github-objectives.html" $response.body }}
+
+      {{ if gt (len $extractedObjectives) 0 }}
+        <details>
+          <summary>
+            <h3 class="e-heading__4">Learning Objectives</h3>
+          </summary>
+          {{ range $extractedObjectives }}
+            {{ . | markdownify }}
+          {{ end }}
+        </details>
+      {{ end }}
     </header>
-    {{/* extract objectives */}}
-    {{ $extractedObjectives := partial "strings/extract-github-objectives.html" $response.body }}
 
-    {{ if gt (len $extractedObjectives) 0 }}
-      <details>
-        <summary>
-          <h3 class="e-heading__5">Learning Objectives</h3>
-        </summary>
-        {{ range $extractedObjectives }}
-          {{ . | markdownify }}
-        {{ end }}
-      </details>
-    {{ end }}
     <div class="c-block__content c-copy">
       {{ $response.body | markdownify }}
     </div>

common-theme/layouts/partials/block/issues-list-as-blocks.html

@@ -25,6 +25,20 @@
       nodes {
         title
         url
+        number
+        labels(
+          first: 25 
+          orderBy: { 
+          direction: DESC 
+          field: NAME 
+          }
+        ) {
+          nodes {
+            name
+            color
+            description
+          }
+        }
       }
     }
   }
@@ -37,9 +51,9 @@
 {{ $issueBlocks := slice }}
 {{ with resources.GetRemote "https://api.github.com/graphql" (merge $request (partial "github-auth.html" .)) }}
   {{ with .Content | unmarshal }}
-    {{ with .data.repository.issues }}
-      {{ range .nodes }}
-        {{ $issueBlocks = $issueBlocks | append (dict "name" .title "src" .url) }}
+    {{ with .data.repository.issues.nodes }}
+      {{ range sort . "title" "asc" }}
+        {{ $issueBlocks = $issueBlocks | append (dict "name" .title "src" .url "number" .number "labels" .labels) }}
       {{ end }}
     {{ end }}
   {{ end }}

common-theme/layouts/partials/block/link.html

@@ -12,8 +12,9 @@
     {{ with $chip }}
       <img
         src="{{ $chip.RelPermalink }}"
-        alt="{{ $blockData.name }}"
-        class="c-chip__icon" />
+        alt=""
+        role="presentation"
+        class="c-chip__icon c-chip__icon--circle" />
     {{ end }}
     <h4 class="c-chip__title e-heading__2">{{ $blockData.name }}</h4>
     {{ with $blockData.caption }}