Add event list to index page

2 files changed, 60 insertions, 3 deletions

diff --git a/_sass/_info.scss b/_sass/_info.scss
index 454fd51..84ef42e 100644
--- a/_sass/_info.scss
+++ b/_sass/_info.scss
@@ -1,3 +1,5 @@
+$info_item_separation: 0.9em;
+
 .info_section {
     margin-bottom: 1.5em;
 }
@@ -18,5 +20,30 @@
 }
 
 .post_list__element {
-    margin-bottom: 0.4em;
+    margin-bottom: $info_item_separation;
+}
+
+.post_list__excerpt {
+    margin-bottom: 0;
+}
+
+.event_list {
+    list-style-type: none;
+    margin-left: 0;
+}
+
+.event_list__row {
+    display: block;
+    width: 100%;
+}
+
+.event_list .summary {
+    @extend h4;
+    @extend .event_list__row;
+    margin-bottom: 0;
+}
+
+.event_list .description {
+    @extend .event_list__row;
+    margin-bottom: $info_item_separation;
 }
diff --git a/index.html b/index.html
index 21543be..1a6845c 100644
--- a/index.html
+++ b/index.html
@@ -20,7 +20,7 @@ layout: default
             <time datetime="{{ post.date | date_to_xmlschema }}">
               {{ post.date | date: "%d.%m.%Y" }}
             </time>
-            <p>
+            <p class="post_list__excerpt">
               {{ post.excerpt | strip_html }}
               <a href="{{ post.url | absolute_url }}">Lisää...</a>
             </p>
@@ -33,7 +33,14 @@ layout: default
     <div class="col span_1_of_2">
       <div class="info_section">
         <h1 class="info_section__title">Tulevat tapahtumat</h1>
-        Tapahtumia.
+        <ul id="event-list" class="event_list">
+        </ul>
+        <ul id="event-list-2" class="event_list">
+        </ul>
+
+        <a href="{{ "/tapahtumat" | absolute_url }}">
+          Kaikki tapahtumat
+        </a>
       </div>
 
       <div class="info_section">
@@ -48,3 +55,26 @@ layout: default
 </article>
 
 </div>
+
+<script src="/static/js/moment.min.js"></script>
+<script src="/static/js/format-google-calendar.js"></script>
+<script type="text/javascript">
+  formatGoogleCalendar.init({
+    calendarUrl: 'https://www.googleapis.com/calendar/v3/calendars/as.tiedottaja@gmail.com/events?key=AIzaSyCJrtmGOeEFAq912lwijvCmKR33SAtC_qo',
+    past: false,
+    upcoming: true,
+    sameDayTimes: true,
+    dayNames: true,
+    pastTopN: -1,
+    upcomingTopN: 5,
+    recurringEvents: true,
+    itemsTagName: 'li',
+    upcomingSelector: '#event-list',
+    pastSelector: '#event-list-2',
+    upcomingHeading: '',
+    pastHeading: '',
+    format: ['*summary*', '*date*', '*description*'],
+    timeMin: '2016-06-03T10:00:00-07:00',
+    timeMax: '2020-06-03T10:00:00-07:00'
+  });
+</script>