updated layout

S2-group · Oct 25, 2024 · bf6ac99 · bf6ac99
1 parent d5f7483
commit bf6ac99
Show file tree

Hide file tree

Showing 13 changed files with 97 additions and 83 deletions.
diff --git a/_data/labs.yml b/_data/labs.yml
@@ -2,5 +2,12 @@
   description: A collaboration between ABN AMRO and the Vrije Universiteit Amsterdam
   details: Sustainable IT - Lab is a collaboration between ABN AMRO and the Vrije Universiteit Amsterdam. This collaboration allows ABN AMRO software architects and decision makers to work closer with software sustainability researchers in academia, contribute to education and science, and collaborate in PhD- and Master-level research. Academics in turn gain a better understanding of how real-world software can be measured and re-designed to achieve sustainability goals.
   contact: Prof. Dr. Patricia Lago [email protected] (VU | S2 Research Group), Wiebren van der Zee (ABN AMRO | CIO – Sustainable IT)
-  img: sustITlab.png
-  img-width: 8rem
+  img: vu-abn.png
+  img-width: 12rem
+
+- title: Lab
+  description: A collaboration between Schuberg Philis and the Vrije Universiteit Amsterdam
+  details: Lab is a collaboration between Schuberg Philis and the Vrije Universiteit Amsterdam.
+  contact: Prof. Dr. Patricia Lago [email protected] (VU | S2 Research Group), Ilja Heitlager (Schuberg Philis | CIO )
+  img: vu-sbp.png
+  img-width: 12rem
diff --git a/_layouts/events.html b/_layouts/events.html
@@ -9,6 +9,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>{{ page.title }}</title>
     <style>
+
         .container {
             max-width: 1200px;
             margin: 0 auto;
@@ -89,73 +90,74 @@
     </style>
 </head>
 <body>
-    {% assign date_format = site.date_format | default: "%B %-d, %Y" %}
 
+    {% include header.html type="page" %}
 
-
-<div class="container">
-    <h1>Research Cocktails</h1>
-    <button class="scroll-button scroll-left" onclick="scrollLefty('cocktails')">&#10094;</button>
-    <ul class="post-list" id="cocktails">
-        {% assign sorted_posts = site.cocktails | sort: "event-date" | reverse%}
-        {% for post in sorted_posts %}
-        <li class="post">
-            <a href="{{ post.url }}">
-            <img src="{{ post.thumbnail-img }}" alt="{{ post.title }}">
-            <div>
-                <div class="post-title">
-                    {{ post.title | truncate: 50, "..." }}<br>
-                </div>
-                <div class="post-date">
-                    {{post.event-date  | date: date_format}}
+    {% assign date_format = site.date_format | default: "%B %-d, %Y" %}
+<div class="container-md">
+    <div class="container">
+        <h1>Research Cocktails</h1>
+        <button class="scroll-button scroll-left" onclick="scrollLefty('cocktails')">&#10094;</button>
+        <ul class="post-list" id="cocktails">
+            {% assign sorted_posts = site.cocktails | sort: "event-date" | reverse%}
+            {% for post in sorted_posts %}
+            <li class="post">
+                <a href="{{ post.url }}">
+                <img src="{{ post.thumbnail-img }}" alt="{{ post.title }}">
+                <div>
+                    <div class="post-title">
+                        {{ post.title | truncate: 50, "..." }}<br>
+                    </div>
+                    <div class="post-date">
+                        {{post.event-date  | date: date_format}}
+                    </div>
                 </div>
-            </div>
-            </a>
-        </li>
-        {% endfor %}
-    </ul>
-    <button class="scroll-button scroll-right" onclick="scrollRight('cocktails')">&#10095;</button>
-</div>
+                </a>
+            </li>
+            {% endfor %}
+        </ul>
+        <button class="scroll-button scroll-right" onclick="scrollRight('cocktails')">&#10095;</button>
+    </div>
 
-<!-- <div class="container">
-    <h1>Distinguished Lectures</h1>
-    <button class="scroll-button scroll-left" onclick="scrollLeft()">&#10094;</button>
-    <ul class="post-list" id="postList">
-        {% for post in site.lectures %}
-        <li class="post">
-            <img src="{{ post.thumbnail-img }}" alt="{{ post.title }}">
-            <div class="post-title"><a href="{{ post.url }}" style="color: white; text-decoration: none;">{{ post.title }}</a></div>
-        </li>
-        {% endfor %}
-    </ul>
-    <button class="scroll-button scroll-right" onclick="scrollRight()">&#10095;</button>
-</div> -->
+    <!-- <div class="container">
+        <h1>Distinguished Lectures</h1>
+        <button class="scroll-button scroll-left" onclick="scrollLeft()">&#10094;</button>
+        <ul class="post-list" id="postList">
+            {% for post in site.lectures %}
+            <li class="post">
+                <img src="{{ post.thumbnail-img }}" alt="{{ post.title }}">
+                <div class="post-title"><a href="{{ post.url }}" style="color: white; text-decoration: none;">{{ post.title }}</a></div>
+            </li>
+            {% endfor %}
+        </ul>
+        <button class="scroll-button scroll-right" onclick="scrollRight()">&#10095;</button>
+    </div> -->
 
-<div class="container">
-    <h1>Other Events</h1>
-    <button class="scroll-button scroll-left" onclick="scrollLefty('discevents')">&#10094;</button>
-    <ul class="post-list" id="discevents">
-        {% assign sorted_posts = site.discevents | sort: "event-date" | reverse%}
-        {% for post in sorted_posts %}
-        <li class="post">
-            <a href="{{ post.url }}">
-            <img src="{{ post.thumbnail-img }}" alt="{{ post.title }}">
-            <div>
-                <div class="post-title">
-                    {{ post.title | truncate: 50, "..." }}<br>
+    <div class="container">
+        <h1>Other Events</h1>
+        <button class="scroll-button scroll-left" onclick="scrollLefty('discevents')">&#10094;</button>
+        <ul class="post-list" id="discevents">
+            {% assign sorted_posts = site.discevents | sort: "event-date" | reverse%}
+            {% for post in sorted_posts %}
+            <li class="post">
+                <a href="{{ post.url }}">
+                <img src="{{ post.thumbnail-img }}" alt="{{ post.title }}">
+                <div>
+                    <div class="post-title">
+                        {{ post.title | truncate: 50, "..." }}<br>
+                    </div>
+                    <div class="post-date">
+                        {{post.event-date  | date: date_format}}
+                    </div>
                 </div>
-                <div class="post-date">
-                    {{post.event-date  | date: date_format}}
-                </div>
-            </div>
-            </a>
-        </li>
-        {% endfor %}
-    </ul>
-    <button class="scroll-button scroll-right" onclick="scrollRight('discevents')">&#10095;</button>
-</div>
-
+                </a>
+            </li>
+            {% endfor %}
+        </ul>
+        <button class="scroll-button scroll-right" onclick="scrollRight('discevents')">&#10095;</button>
+    </div>
 
+</div>
 <script>
     function scrollLefty(id) {
         const postList = document.getElementById(id);

diff --git a/_posts/2024-07-03-industry-on-stage-post-event.md b/_posts/2024-07-03-industry-on-stage-post-event.md
@@ -1,11 +1,11 @@
 ---
 layout: post
 title: Industry on Stage
-subtitle: Five real-life challenges for Digital Sustainability
+subtitle: Five real-world challenges for Digital Sustainability
 event-date: 2024-07-03
 cover-img: /assets/img/posts-screenshots/disc-banner-industryonstage.png
-share-img: /assets/img/posts-screenshots/disc-social-industryonstage.png
-thumbnail-img: /assets/img/posts-screenshots/disc-thumb-industryonstage.png
+share-img: /assets/img/posts-screenshots/ios-pitches.jpeg
+thumbnail-img: /assets/img/posts-screenshots/ios-pitches.jpeg
 ---
 
 

diff --git a/assets/css/index.css b/assets/css/index.css
@@ -43,6 +43,7 @@ p a:hover{
 footer {
     border-top: 0;
     margin-top: 0;
+    bottom: 0;
 }
 
 #particles-js {
@@ -409,4 +410,4 @@ footer {
         margin: 1.75rem auto;
         max-width: 100%;
     }
-}
+}
diff --git a/assets/img/lab-screenshots/vu-abn.png b/assets/img/lab-screenshots/vu-abn.png
diff --git a/assets/img/lab-screenshots/vu-sbp.png b/assets/img/lab-screenshots/vu-sbp.png
diff --git a/assets/img/posts-screenshots/ios-pitches.jpeg b/assets/img/posts-screenshots/ios-pitches.jpeg
diff --git a/pages/drops_of_knowledge.md b/pages/drops_of_knowledge.md
@@ -9,14 +9,17 @@ ext-css:
 ext-js:
 - //cdn.jsdelivr.net/npm/[email protected]/particles.min.js
 ---
-<div id="shinyapps-big">
-    {% for videoid in site.data.videos.videos %}
-        <div class="video-tile shinyapp">
-            <div class="video-container">
-                <iframe src="https://www.youtube.com/embed/{{ videoid }}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+
+<div class="container-md" style="margin-bottom:40px; ">
+    <div id="shinyapps-big">
+        {% for videoid in site.data.videos.videos %}
+            <div class="video-tile" style="width=24rem;margin-bottom:10px">
+                <div class="video-container">
+                    <iframe src="https://www.youtube.com/embed/{{ videoid }}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                </div>
             </div>
-        </div>
-    {% endfor %}
+        {% endfor %}
+    </div>
 </div>
 
 <style>

diff --git a/pages/events.md b/pages/events.md
@@ -1,4 +1,5 @@
 ---
 layout: events
+title: Events
 ---
 
diff --git a/pages/labs.md b/pages/labs.md
@@ -11,18 +11,18 @@ ext-js:
 - //cdn.jsdelivr.net/npm/[email protected]/particles.min.js
 ---
 
-<div id="portfolio-out" class="page-section grey-section">
+<div id="portfolio-out">
   <div id="portfolio">
     <div id="shinyapps-big"> 
       {% for lab in site.data.labs %}
-	    <div class="shinyapp" style="width:65rem; background-color:#e6ffe7; ">
-          <a class="applink" href="{{ lab.url }}" target="_blank">
-            <img class="appimg" src="{{ site.url }}/assets/img/lab-screenshots/{{ lab.img }}" style="width: {{ lab.img-width }}" alt="" />
+	    <div class="shinyapp" style="background-color:#e6ffe7; ">
+          <!-- <a class="applink" href="{{ lab.url }}" target="_blank"> -->
+            <img class="appimg" src="{{ site.url }}/assets/img/lab-screenshots/{{ lab.img }}" style="width: {{ lab.img-width }};" alt="" />
             <div class="apptitle">{{ lab.title }}</div>
             <div class="appdesc">{{ lab.description }}</div>
             <div class="appdesc">{{ lab.details }}</div>
             <div class="appdesc">{{ lab.contact }}</div>
-          </a>
+          <!-- </a> -->
         </div>
 	  {% endfor %}
     </div>

diff --git a/pages/partners.md b/pages/partners.md
@@ -4,7 +4,7 @@ title: Partners
 ---
 
 ### National Coalition Digital Sustainability
-<div style="display: inline-block; width:200px">
+<div style="display: inline-block; width:200px; margin-bottom:20px">
 <img alt="NCDS Logo" src="{{ site.url }}/assets/img/posts-screenshots/Coalitie-Duurzame-Digitalisering-Logo-JPG.jpg"/>
 </div>
 <div style="display: inline-block; width:800px; margin-left:10px">
@@ -13,7 +13,7 @@ The DISC is a member of the <a target="_blank" href="https://coalitieduurzamedig
 
 ### Amsterdam Economic Board – LEAP Program
 
-<div style="display: inline-block; width:100px">
+<div style="display: inline-block; width:100px; margin-bottom:20px">
 <img alt="AEB Logo" src="{{ site.url }}/assets/img/AmsterdamEconomicBoard.png"/>
 </div>
 <div style="display: inline-block; width:800px; margin-left:10px">

diff --git a/pages/resources.md b/pages/resources.md
@@ -18,7 +18,7 @@ ext-js:
           <a class="applink" href="{{ resource.url }}" target="_blank" >
             <img class="appimg" src="{{ site.url }}/assets/img/resource-screenshots/{{ resource.img }}" style="width: 100%" alt="" />
             <div class="apptitle">{{ resource.title }}</div>
-            <div class="appdesc">{{ resource.description }}</div>
+            <div class="appdesc">{{ resource.description}}</div>
           </a>
         </div>
 	  {% endfor %}

diff --git a/pages/talent_hub.md b/pages/talent_hub.md
@@ -11,11 +11,11 @@ ext-js:
 - //cdn.jsdelivr.net/npm/[email protected]/particles.min.js
 ---
 
-<div id="portfolio-out" class="page-section grey-section">
+<div id="portfolio-out" >
   <div id="portfolio">
     <div id="shinyapps-big"> 
       {% for lab in site.data.talent_labs %}
-	    <div class="shinyapp" style="cursor: pointer; width:25rem; background-color:#e6faff;" onclick="window.location='{{ lab.url }}'">
+	    <div class="shinyapp" style="cursor: pointer; width:25rem; background-color:#e6faff;margin-top:10px;" onclick="window.location='{{ lab.url }}'">
             <center><img class="appimg" src="{{ site.url }}/assets/img/lab-screenshots/{{ lab.img }}" style="width: {{ lab.img-width }}; color:#e6faff; filter: opacity(0.7) ;" alt="" /></center>
             <div class="apptitle">{{ lab.title }}</div>
             <div class="appdesc">{{ lab.description }}</div>