Added Program page

website/program.html

@@ -94,6 +94,92 @@
     <main>
       <h1><span style="color: var(--color-dark-gray)">isLoop 2024</span> Program</h1>
 
+      <h2>Day 1: Pharo in one Day</h2>
+
+      <p>During this day you will learn the survival kit to code in Pharo.
+        You will learn the syntax and the main tools to code and publish code.
+        After that day you will be able to code in Pharo. Yes the syntax fits
+        in half of a postcard.</p>
+
+      <ul>
+        <li>Pharo for the scientists</li>
+        <li>Discover and experience eXTreme Test Driven Design</li>
+        <li>Hands-on with ProfStef</li>
+        <li>Understand the key tools for coding, debugging, inspecting and
+          publishing code</li>
+        <li>Hands on: coding the counter</li>
+      </ul>
+
+      <h2>Day 2: Crafting user interfaces</h2>
+
+      <p>During this day you will learn how to define user interfaces using
+        the Spec UI builder framework. We will also show you how to extend
+        tools to shape them to your own needs. We will also build a simple
+        web server in a couple of pages to revisit the Pharo syntax. You will
+        see how you can build nontrivial programs in an immersed way by
+        interacting with life objects.</p>
+
+      <ul>
+        <li>Simple tour of Spec</li>
+        <li>Build a little App with Spec todo App in 15 min</li>
+        <li>Tools are shaping your mind: Define your own tool. Extend the
+          environment Graph inspector</li>
+        <li>Revisit the syntax building a web server</li>
+      </ul>
+
+      <h2>Day 3: AI with Pharo</h2>
+
+      <p>During that day we will focus on AI and visualization. You will learn
+        about DataFrame (how to grab, and collect data), train a model and
+        validate your results. We will show how you can understand your data
+        and results using the <a href="http://agilevisualization.com"
+        target="_blank" rel="noopener">Roassal</a> scripting visualization
+        engine.</p>
+
+      <ul>
+        <li>Getting started with machine learning</li>
+        <li>TeaLight and machine learning: you will connect a web server to
+          machine learning</li>
+        <li>Data Frame</li>
+        <li>Train a model</li>
+        <li>Validate a model</li>
+        <li>Using live visualization scripting of
+          <a href="http://agilevisualization.com" target="_blank"
+          rel="noopener">Roassal</a> to script interactive visualization</li>
+      </ul>
+
+      <h2>Day 4: Object-oriented Design and Software Engineering</h2>
+
+      <p>During this day you will rethink your OO understanding. At the end of
+        this day, you will not think or program object-oriented the same way.
+        Experts in object-oriented design will give you keys that will change
+        how you will code in any object-oriented language in the future. We
+        will also present advanced software engineering techniques. Finally,
+        we will show you how we can script VLC from Pharo using native
+        calls.</p>
+
+      <ul>
+        <li>Rethink your OOP skills: Understand late binding for real</li>
+        <li>Advanced Tools: Automatic Rewriting, Refactorings, Finder</li>
+        <li>Scripting VLC from Pharo</li>
+        <li>Lapack binding: how to get the full power of Fortran libraries
+          but with the coolness of Pharo</li>
+      </ul>
+
+      <h2>Day 5: Code Analysis</h2>
+
+      <p>During this day we will present the
+        <a href="http://http://modularMoose.org" target="_blank"
+        rel="noopener">Moose</a> is a powerful platform to define and apply
+        software analyses.</p>
+
+      <ul>
+        <li>You will define a meta-model to represent commits, files,
+          and authors</li>
+        <li>You will define specific visualizations in Roassal to display
+          information</li>
+      </ul>
+
     </main>
 
     <footer>

website/style.css

@@ -19,6 +19,7 @@ body {
   font-size: var(--text-font-size);
   font-weight: 400;
   font-style: normal;
+  line-height: 150%;
 }
 
 nav {
@@ -102,6 +103,7 @@ a {
 
 main li {
   padding: 0.3rem;
+  line-height: 120%;
 }
 
 span.ltrText {
@@ -146,7 +148,7 @@ footer p {
   margin: 0;
 }
 
-@media only screen and (min-width: 768px) {
+@media only screen and (min-width: 768px) { 
   main {
     padding-bottom: 3rem;
   }