From 8e87afa4054bff06673442099bee473d6da0f963 Mon Sep 17 00:00:00 2001
From: vicky <vzhong2021@gmail.com>
Date: Sun, 22 Oct 2023 23:07:45 -0700
Subject: [PATCH] jekyll connection

---
 _sass/_ailessons.scss |  10 ++--
 ai_ml_lesson.html     | 126 ++++++++----------------------------------
 2 files changed, 28 insertions(+), 108 deletions(-)

diff --git a/_sass/_ailessons.scss b/_sass/_ailessons.scss
index 821d76ea..3da43b02 100644
--- a/_sass/_ailessons.scss
+++ b/_sass/_ailessons.scss
@@ -71,8 +71,8 @@ label {
 
 .two-by-two {
   display: grid;
-  grid-template-columns: 1fr;
-  grid-template-rows: repeat(4, 1fr);
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  grid-template-rows: repeat(2, minmax(0, 1fr));
   grid-gap: 20px;
 
   @media (min-width: 768px) {
@@ -90,6 +90,7 @@ label {
 .lesson-w-chip {
   width: 100%;
   padding: 1.5rem;
+  height: 100%; 
 
   display: flex;
   flex-direction: column;
@@ -109,10 +110,12 @@ label {
     padding: 0;
     margin: 0;
   }
+}
 
-  div {
+.green-chips {
     display: flex;
     gap: 0.5rem;
+    flex-wrap: wrap;
     div {
       background-color: #016d3a;
       color: white;
@@ -122,7 +125,6 @@ label {
 
       font-size: 14px;
     }
-  }
 }
 
 .lesson-triple-col {
diff --git a/ai_ml_lesson.html b/ai_ml_lesson.html
index 6cc51cb0..0e943079 100644
--- a/ai_ml_lesson.html
+++ b/ai_ml_lesson.html
@@ -91,83 +91,25 @@ <h2>Learning goals</h2>
   <h2>Lessons</h2>
   <div class="center">
     <div class="lesson-triple-col">
+      {% for lesson in site.aiml %}
       <div class="lesson-w-chip">
-        <h3>What is AI</h3>
-        <p>
-          You’ve probably heard of Artificial Intelligence in the news. But what
-          exactly is AI?
-        </p>
-        <div div class="green-chips">
-          <div>slides</div>
-          <div>worksheet</div>
-        </div>
-      </div>
-      <div class="lesson-w-chip">
-        <h3>What is AI</h3>
-        <p>
-          You’ve probably heard of Artificial Intelligence in the news. But what
-          exactly is AI?
-        </p>
-        <div div class="green-chips">
-          <div>slides</div>
-          <div>worksheet</div>
-        </div>
-      </div>
-      <div class="lesson-w-chip">
-        <h3>What is AI</h3>
-        <p>
-          You’ve probably heard of Artificial Intelligence in the news. But what
-          exactly is AI?
-        </p>
-        <div div class="green-chips">
-          <div>slides</div>
-          <div>worksheet</div>
-        </div>
-      </div>
-      <div class="lesson-w-chip">
-        <h3>What is AI</h3>
-        <p>
-          You’ve probably heard of Artificial Intelligence in the news. But what
-          exactly is AI?
-        </p>
-        <div div class="green-chips">
-          <div>slides</div>
-          <div>worksheet</div>
-        </div>
-      </div>
-      <div class="lesson-w-chip">
-        <h3>What is AI</h3>
-        <p>
-          You’ve probably heard of Artificial Intelligence in the news. But what
-          exactly is AI?
-        </p>
-        <div div class="green-chips">
-          <div>slides</div>
-          <div>worksheet</div>
-        </div>
-      </div>
-      <div class="lesson-w-chip">
-        <h3>What is AI</h3>
-        <p>
-          You’ve probably heard of Artificial Intelligence in the news. But what
-          exactly is AI?
-        </p>
-        <div div class="green-chips">
-          <div>slides</div>
-          <div>worksheet</div>
-        </div>
-      </div>
-      <div class="lesson-w-chip">
-        <h3>What is AI</h3>
-        <p>
-          You’ve probably heard of Artificial Intelligence in the news. But what
-          exactly is AI?
-        </p>
-        <div div class="green-chips">
-          <div>slides</div>
-          <div>worksheet</div>
+        <h3>{{lesson.title}}</h3>
+        {% if lesson.excerpt %}
+          {{lesson.excerpt}}
+        {% endif %}
+        <div class="green-chips">
+          {% if lesson.slides_link %}
+          <div href="{{lesson.slides_link}}">slides</div>
+          {% endif %}
+          {% if lesson.homework_link %}
+          <div href="{{lesson.homework_link}}">worksheet</div>
+          {% endif %}
+          {% if lesson.colab_link %}
+          <div href="{{lesson.colab_link}}">colab</div>
+          {% endif %}
         </div>
       </div>
+      {% endfor %}
     </div>
   </div>
 </div>
@@ -178,40 +120,16 @@ <h1 class="reset">More resources</h1>
     <p>These are our favorite AI/ML resources - they're all awesome!</p>
   </div>
   <div class="two-by-two">
+    {% for subcategory in site.data.curriculum_resources.aiml %}
     <div>
-      <h3>ACM AI Resources</h3>
-      <ul>
-        <li>You Belong in AI! Podcast</li>
-        <li>ACM AI Blog</li>
-        <li>Plotting Data Notebook</li>
-        <li>MNIST Dataset with Keras Notebook (Archer School Event)</li>
-        <li>Intro to Deep Learning</li>
-      </ul>
-    </div>
-    <div>
-      <h3>Intro to Deep Learning</h3>
+      <h3>{{subcategory.title}}</h3>
       <ul>
-        <li>Coursera: Deep Learning Specialization</li>
-        <li>The Deep Learning Textbook</li>
-        <li>3Blue1Brown: Neural Networks</li>
-        <li>Udacity: Intro to Deep Learning with TensorFlow</li>
+        {% for item in subcategory.items %}
+        <li>{{item.name}}</li>
+        {% endfor %}
       </ul>
     </div>
-    <div>
-      <h3>Tensorflow and Pytorch</h3>
-      <ul>
-        <li>UC Berkeley: CS294 Tensorflow Tutorial</li>
-        <li>UC Berkeley: CS285 (Deep Reinforcement Learning) Resources</li>
-        <li>Pytorch: Getting Started with Pytorch</li>
-      </ul>
-    </div>
-    <div>
-      <h3>Intro to Machine Learning</h3>
-      <ul>
-        <li>Coursera: Introduction to Machine Learning</li>
-        <li>Hal Daumé III: A Course in Machine Learning</li>
-        <li>Google: Machine Learning Crash Course</li>
-      </ul>
+      {% endfor %}
     </div>
   </div>
 </div>