Tutorial

pages/cursos.html

@@ -10,31 +10,34 @@ lang: pt
 </div>
 
 <div class="mx-6 mt-6">
-{% assign cursos = site.cursos | sort: 'date' | reverse %}
-    <div class="columns is-multiline">
+    {% assign cursos = site.data.cursos | sort: 'date' | reverse %}
+    
+    <div class="content-box">
         {% for curso in cursos %}
-        {% assign nome = curso.name | replace: ".md","" %}
-        <div class="column is-one-third">
-            <a href='{{ site.baseurl }}{{ curso.url  }}.html' class="card-link">
-                <div class="card">
-                    <div class="card-image">
-                        <figure class="image is-4by3">
-                            <img src="{{ site.baseurl }}/thumbs/{{ nome }}.jpg">
-                        </figure>
-                    </div>
-                    <div class="card-content">
-                        <div class="content my-2">
-                            <h1 class="title is-size-4">{{  curso.title }}</h1>
-                            {% for aula in curso.aulas %}
-                            <span class="tag is-link">{{ aula  }}</span>
-                            {% endfor %}
-                            <h3 class="subtitle is-size-6">{{ curso.description  }}</h3>
-                            <h3 class="subtitle is-size-6">{{ curso.author  }}</h3>
-                        </div>
-                    </div>  
+        <div class="box">
+            <div class="box-top">
+                <figure>
+                    <img src="{{ site.baseurl }}/thumbs/{{ curso.name | replace: '.md', '' }}.jpg">
+                </figure>
+            </div>
+    
+            <div class="box-info">
+                <h1>
+                    <a href="{{ site.baseurl }}/cursos/{{ curso.name | slugify: 'latin' }}.html">
+                        {{ curso.title }}
+                    </a>
+                </h1>
+                <p>{{ curso.description }}</p>
+                <p><strong>Autor:</strong> {{ curso.author }}</p>
+    
+                <div class="tags">
+                    {% for aula in curso.aulas %}
+                    <span class="tag is-link">{{ aula }}</span>
+                    {% endfor %}
                 </div>
-            </a>
+            </div>
         </div>
         {% endfor %}
     </div>
+    
 </div>

pages/index.html

@@ -3,15 +3,21 @@ layout: default
 permalink: /
 ---
 
+{% include tutorial/tutorial.html %}
+
 <div class="home-content">
     <div class="banner">
         <h1>Bem vindo ao Alice Class</h1>
         <h3>Participe de uma comunidade colaborativa para criar e compartilhar cursos e materiais educativos.</h3>
+        
+        <br/>
+        <h4 style="margin-top: 100px;">E novo aqui? <span style="color: black;" id="start-tutorial">Click aqui</span> e conheça nosso site.</h4>
+        <!-- <button id="start-tutorial">Iniciar Tutorial</button> -->
     </div>
 
     <div class="lasted">
         <div class="title-section">
-            <h1 class="title">Ultimas aulas</h1>
+            <h1 class="title" id="lasted">Ultimas aulas</h1>
         </div>
 
         <div class="content-box">